Howdy!!! 🙋‍♀️In this case we are going to replicate a Sneaker UI App obtained from Dribble. You can check the design here!




Before starting, to get the best out of the post, I’ll leave you some instructional notes so that you have a better experience reproducing the UI:

At the beginning, you will see an image with the original UI where you will see divided into blocks as we’ll be working each part of the design.
.
Each block presents the image with the design explicitly that we’ll be working on that block, they are highlighted in a box.
.
In each of the code blocks you can see a comment that says: “Here add the code that is being explained in the next block“. To keep you as focused as possible, this part indicates you that the next block code explanation goes right where the comment line is added.
.
I will not be using styles so that the properties added to the various components can be seen and understood faster in the explanation process.
.

Let’s start!
Let’s divide the original design into blocks…

Subscribe to a hand-picked round up of the best Xamarin development links every week. Published every Friday. Free.