Creating A CheckBox Control In Xamarin Android App Using VS 2015 Update Three

Introduction

Xamarin is a tool to develop cross-platform and multi-platform apps (Ex - Windows phone, Android, and iOS). In Xamarin, the code sharing concept is used. Xamarin Studio is available in Visual Studio too.

The Check Box Control is used to automatically check (tick) the options and question-types in Android app.

Prerequisites

Visual Studio 2015 update 3

The following steps are needed to be followed in order to create a Check Box in Xamarin Android app.

Step 1 - G to File--> New--> Project. The list of all the project types will be opened. Or, you can simply press "Ctrl+Shift+N".

Project

Step 2 - After opening the New project, select Installed --> Templates --> Visual C# --> Android --> choose Blank App (Android). Next, give your Android app a name (Ex: sample) and give path of your project. Finally, click OK.

Project

Step 3 - Next, go to the Solution Explorer. Next, select Resource --> Layout --> double click to open Main.axml page. You can select either Design view or Code view to design your app.

Project

Step 4 - After this, open the Main.axml file. This will open the main page designer where you can design the app's homepage.

Project

Step 5 - Next, go to the toolbox window where you have all types of tools and control. Go to the Toolbox window. Next, scroll down and look for all tools and controls.

Drag and drop the Check Box control in your Main.axml page.

Project

Step 6 - After dragging and dropping it, the Check Box will show up in your app.

Project

Step 7 - Next, go to the properties window and edit the text value (Ex- android:text=check) and change the id (Ex- CheckBox android:id="@+id/checkbox").

Project

Step 8 - Now, go to the Main.axml source code and tap here. Change the id value or note the value.

Project

Main.axml

<CheckBox android:id="@+id/checkbox" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="check" />

Step 9 - Next go to the Solution explorer window open the MainActivity.cs page write the following c# code

MainActivity.cs

protected override void OnCreate(Bundle bundle) {
base.OnCreate(bundle);
// Set our view from the "main" layout resource
SetContentView(Resource.Layout.Main);
CheckBox checkbox = FindViewById < CheckBox > (Resource.Id.checkbox);
checkbox.Click += (o, e) => {
if (checkbox.Checked)
Toast.MakeText(this, "Checked", ToastLength.Short).Show();
else
Toast.MakeText(this, "Un checked", ToastLength.Short).Show();
};
}

Step 10 - If you have Android Virtual Device, you can run the app in that. Otherwise, connect your Android phone to the system, via USB cable and enable USB debugging.

Go to the Visual Studio now. If connected properly, your Android phone will show in the run menu (Ex- LENOVO A6020a40 (Android 5.1-API 22)).

Next, click on the name of connected Android phone. It will run the app in your device.

Output

In the following image, you can see that the app is running successfully in your device. However, it will take sometime to build the app files and initializing the process. And install app in your phone.

When you check the box, the "Checked" text displays there.

output

If you un-check the checkbox, the text also changes to "Un checked".

output

Summary - So, this was the process of creating a Check Box in Xamarin Android app, using Visual Studio 2015 update 3.

5 Comments

Join the conversation! Your thoughts help the community grow.

Rashmi2y ago
Hi I want to have my checkbox to the right and its label to the left how I have do that
Uttam Padukone7y ago
Hi, Wanted some help in respect of programmatically created checkbox. I create Checkboxes in a do loop with unique ids assigned to each checkbox. Once created, I would now like to (a) detect when the state of each changes viz. checked to unchecked and vice versa and (b) when all checking / unchecking is completed, I would like to go through a do-loop so that the associated values for each checked checkbox is loaded into a different variable array.
Vijayaragavan S10y ago
Good....
Prasanna Murali10y ago
Nice post
Humayun Kabir Mamun10y ago
Nice...