Hey guys in this tutorial we are going to make Advanced LogIn Page UI Design inside xamarin forms project.
Step1 :
At first set your MainPage as Start up Page inside App.xaml.cs.
Step 2 :
Now the design page i.e: Our MainPage.xaml. Understanding this tutorial is not like understanding rocket science 😀 .
Basics:
StackLayout:
It organizes our views in a one-dimensional line either horizontally or vertically.
Entry:
It is used for single-line text input. It supports multiple keyboard types and can be used as a password field.
Label:
Label which is a view is used for displaying text. It can have custom fonts , colored text and font families etc.
Button:
It displays a text string or bitmap image or both indicating a command, When user presses the Button with a finger or clicks it with a mouse to initiate that command.
After a Button command is clicked then user can perform various events like navigation, validation, converter etc..
Grid:
Grid supports arranging views into rows and columns. we can separate any layout with the help of grid.
Simple 3 rows are defined. In which we have given fixed height to 1st and 3rd row . For 2nd row have again divided it to 7 rows that’s all now we will add our necessary content inside the grid rows.
Code and tutorial is pretty explanatory so follow it and enjoy. 🙂
In first grid row 0 image and a label is added .
On second grid row image entry and button is added & On last grid row, we have added labels for login which can be made clickable by adding gestures.
Download full project from here : http://xamaringuyshow.com/loginappuitut13/
Rafa
Hi, do you have the images you use to share ? Thanks
samirgc
You can download images that are available labeled free of use in google.