Laying out Widgets in Flutter 🔥
Hello Everyone,
Today’s Mobile Application Industry is growing exponentially and it's critical to develop Modern and Structured UI for the Application which people will be using. You can develop User Interface using Technologies like Android using Android Studio and IOS using XCODE, but if you want to develop for both of these platforms then Flutter is there for you, it's really easy to develop UI in flutter if you get along with it. So we’ll see how we can develop a Simple User Interface that you can then implement your Design out of it using these Basic Concepts. Lets Start…Coding!
If you are a Video Person then check out my Youtube Video here:
What we will be Designing and Implementing?
We will be Designing below UI using Flutter.
As you can observe there are a number of things in the UI to implement. There is a Text widget, Image Widget, and a Button all these widgets as laid out Vertically in the Screen.
We will be using Column and Row widget to align these Widgets properly on the Screen.
We’ll start with the Column widget. Column and Row widget has an attribute called MainAxisAlignment and ColumnAxisAlignment both of these can be used to align the children of the Column and Row in either Vertical or Horizontal Fashion.
So lets first create a Brand new Project and name it anything , in main.dart file add the Below Code.
Here we created a Class Named MyApp that is a Stateless widget because there is nothing in the UI Screen that will be Changing during the Runtime and will not hold any state. Then we add a Scaffold that will hold all our Application Widgets.
Then we added a Column that lays all of our Text, Image, and Button widgets 🤓 .
We used crossAxisAlignment: CrossAxisAlignment.start, in Column to align all the Child widgets to Start off the Screen then at last we Wrapped up our Column widget with some Padding Widget to give some padding in its descendants.
So that’s how we build our very Simple UI in Flutter. Thanks for Reading and See you again..!
If you are a Video Person then check out my Youtube Video here:
