How to Pass Data in Pages using Xamarin.Forms
Until now we have seen how to go from one page to another with NavigationPage and Navigation, but it Is not enough in live applications. You also need to pass some information to another page.
In this tutorial we are going to see how to pass data between different pages in Xamarin.Forms.
We simply try to add a Entry (TextBox, TextField) and a Button and when button press it send the text entered to the second page.
Let’s Start:
For this, we will create a new solution, go to new solution select -> C# -> Mobile Apps -> Blank App(Xamarin.Forms Portable) and give it name “PassDataXamarinForms”
Create 2 files that extendsContantPage give it name as “MainPage” and “SecondPage”.
Set NavigationPage to the “MainPage.cs”, if you don’t know about it refer our old tutorial of NavigationPage.
Now in MainPage.cs add a Entry and Button Control:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
public MainPage () { Entry txt_name = new Entry { WidthRequest=250, HorizontalOptions = LayoutOptions.Start, Placeholder="Enter Name" }; var txtlayout = new StackLayout { Padding= new Thickness(35,20,0,0), Children={ txt_name, }, }; txtlayout.WidthRequest = 10; Button btn_send = new Button{ Text="Send" }; btn_send.Clicked += (sender, e) => { Navigation.PushAsync(new SecondPage(txt_name.Text)); }; Content = new StackLayout { Children = { txtlayout,btn_send } }; Title="First Page"; } |
In Navigation.PushAsync we pass data of Entry in Constructor.
For this we have to change in the Constructor method of SecondPage:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
public SecondPage (string data) { string Name = data; Label lbl_name = new Label { Text ="hello "+ Name }; Content = new StackLayout { Children = { lbl_name } }; Title="Second Page"; } |
Now just try to build and run the app, if everything is fine you will see your app like:
For iOS:
For Android:
If you like this tutorial then you can download full copy of the code from github.
Leave a Reply