Welcome to Xamarin Guy Show Blog

Keep updated for latest and Greatest Posts from Xamarin guy

Xamarin Forms Bottom Navigation Easy Steps[Tutorial 11]

Hey guys in this tutorial we are going to achieve Bottom navigation. It’s an simple implementation of bottom navigation.
Step 1:
At first set your MainPage as Startup page inside App.xaml.cs.

Step 2 :
Basics :
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..
StackLayout:
It  organizes our  views in a one-dimensional line  either horizontally or vertically.
Grid:
Grid supports arranging views into rows and columns. we can separate any layout with the help of grid.
Content View :
ContentView and ContentPage are meant to be used as base class for your own views and pages. Use ContentPage when you want a Page, use ContentView when you want a View
Now inside our project our Mainpage.xaml will contain 2 grid rows . On first gird row we will add any contents inside contentView . Then we will divide 2nd grid row to 4 columns and add the images inside the resources folder of IOS and Android and give it a source for the image tag. Then we will add <TapGestureRecognizer command to give a tap event inside MainPage.xaml for the image.


Step 2:Now inside our code behind  part the image that was clicked will be handeled over here. In this tutorial  we are going to navigate the page using the variable “page”. Which will let us navigate to next page.

Leave a Reply

Ads Blocker Image Powered by Code Help Pro

Ads Blocker Detected!!!

We have detected that you are using extensions to block ads. Please support us by disabling these ads blocker.