Table of Contents
Learning How to analyze UI and turn it to code is an essential part of any mobile application development process.
In this post, I have a 3 pages Flutter UI design to Learn from, Below I explain each page with the important widgets used to build it, So let’s dive in.
The home page has the textField, a horizontal
ListView.builder , then the other ListView to show restaurants.
The single restaurant screen has a
Hero with the Image as its child, the restaurant details in a
Row , the contact and review in another
Row and the GridView that displays the menu.
The cart screen has a ListView Separated by a Diver, and the ListView Item is a Row holding the images and Column Details( name, restaurant, and button) also the price, these two pieces are inside another Row so we can have a space between them.
To learn more check the source code on my GitHub.