Check Box In Android Using Xamarin.Forms

Introduction
 
This article demonstrates checkbox in Android using Xamarin.Forms. Xamarin is a platform that allows us to create a multi-platform app for Android, Windows, or iOS through a single integrated development environment (IDE). And with Xamarin.Forms, the interface design for all three platforms can be accomplished within its XAML-based standard, native user-interfaces control.
 
Android Output 
 
 
 
Step 1
 
Open Visual Studio and go to New Project >> Installed >> Visual C# >> Cross-Platform. Select Cross-Platform app, then give the project a name and location, and click "OK" button.
 
 
 
Step 2
 
After project creation, add the following Nuget Packages to your project. 
  • Xlab.Forms 
Go to Solution Explorer and select your Solution. Right-click and select "Manage NuGet Packages for Solution". 
 
 
 
Now, select the following NuGet Package and select your project to install it.
 
 
 
Step 3 
 
Open Solution Explorer >> Project Name (Portable) >>App.xaml.cs >> Double click. It will open the design view of this page.
 
 
 
The code is given below; just copy it.
 
 
 
C#  Code
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Text;  
  5.   
  6. using Xamarin.Forms;  
  7.   
  8. namespace Check_Box  
  9. {  
  10.     public partial class App : Application  
  11.     {  
  12.         public App()  
  13.         {  
  14.             InitializeComponent();  
  15.   
  16.             MainPage =new NavigationPage(new MainPage());  
  17.         }  
  18.   
  19.         protected override void OnStart()  
  20.         {  
  21.             // Handle when your app starts  
  22.         }  
  23.   
  24.         protected override void OnSleep()  
  25.         {  
  26.             // Handle when your app sleeps  
  27.         }  
  28.   
  29.         protected override void OnResume()  
  30.         {  
  31.             // Handle when your app resumes  
  32.         }  
  33.     }  
  34. }  
Step 4 
 
Next, add an image to Solution Explorer >> Project Name.Android >> Resources >> Right-Click >> Ddrawable >> Add >> Existing Item.
When you click an existing item button, it opens a dialogue box.
 
 
 
Choose image location and add images.
 
 
 
The image is added successfully. Then move the cursor to that image and verify the image.
 
 
 
Step 5 
 
Now, Open the Solution Explorer >> Project Name (Portable) >> Right-Click >> Add >> New Item or ctrl+Shift+A.
 
 
 
A new dialogue box will open. Now, add the XAML page and give it a name. Click the "Add" button. The XAML page name is "Page1".
 
 
 
Step 6 
 
Open Solution Explorer >> Project Name (Portable)  >> MainPage.xaml. Double click for opening the design view of this page.
 
 
 
 
The code is given below just copy it.
 
 
 
Xaml  Code
 
We are creating a button image inside the stacklayout and button name is "Check Box" and using clicked event. 
  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"  
  3.              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"  
  4.              xmlns:local="clr-namespace:Check_Box"  
  5.              x:Class="Check_Box.MainPage">  
  6.     <ContentPage.Content>  
  7.         <StackLayout>  
  8.             <Button Text="Check Box"   
  9.                    Image="icon.png"  
  10.                    Clicked="Button_Clicked"/>  
  11.         </StackLayout>  
  12.     </ContentPage.Content>  
  13. </ContentPage>  
Step 7 
 
Open Solution Explorer >> Project Name (Portable) >> MainPage.xaml.cs. Double click for opening the design view of this page.
 
 
 
The code is given below just copy it.
 
 
 
C# Code
 
This code is button code. The page name is "Page1". 
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Text;  
  5. using System.Threading.Tasks;  
  6. using Xamarin.Forms;  
  7.   
  8. namespace Check_Box  
  9. {  
  10.     public partial class MainPage : ContentPage  
  11.     {  
  12.         public MainPage()  
  13.         {  
  14.             InitializeComponent();  
  15.         }  
  16.   
  17.         private async void Button_Clicked(object sender, EventArgs e)  
  18.         {  
  19.             await Navigation.PushAsync(new Page1());  
  20.         }  
  21.     }  
  22. }  
Step 8 
 
Open Solution Explorer >> Project Name (Portable) >> Page1.xaml. Double click for opening the design view of this page.
 
 
 
The code is given below just copy it.
 
 
 
 
Xaml Code
 
We are using a control for checkbox and default test using there are "Android", "Windows", "iOS".
  1. xmlns:controls="clr-namespace:XLabs.Forms.Controls;assembly=XLabs.Forms"  
  1. <?xml version="1.0" encoding="utf-8" ?>  
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"  
  3.              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"  
  4.              xmlns:controls="clr-namespace:XLabs.Forms.Controls;assembly=XLabs.Forms"  
  5.              x:Class="Check_Box.Page1">  
  6.     <ContentPage.Content>  
  7.         <StackLayout>  
  8.             <controls:CheckBox DefaultText="Android" HorizontalOptions="FillAndExpand"  />  
  9.             <controls:CheckBox DefaultText="Windows" HorizontalOptions="FillAndExpand" />  
  10.             <controls:CheckBox DefaultText="iOS" HorizontalOptions="FillAndExpand" />  
  11.         </StackLayout>  
  12.     </ContentPage.Content>  
  13. </ContentPage>  
Step 9 
 
Next, select the Build & Deploy option followed by selecting from the list of Android Emulator. You can choose any API (Application Program Interface) Level Emulator to run it.
 
Output
 
After a few seconds, you will see your app working.
Android Output 
 
Finally, we have successfully created Xamarin.Forms application.
 
Conclusion 
 
I hope you have learned about Check Box in Android Using Xamarin.Forms with Visual Studio and C#. 


Similar Articles