Post
Ask Question

Creating A Seek Bar Control In Xamarin Android App

Introduction

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


Seek Bar control is used to increase brightness control and  seek  songs in Android apps.

Prerequisites
  • Visual Studio 2015 update 3

The following steps need to be followed in order to create a Seek Bar control in Xamarin Android app using Visual Studio 2015 update 3.

Step 1 - Click File--> New --> Project. This will open all types of projects in the Visual Studio or click (Ctrl+Shift+N).



Step 2 - After opening the New Project, select Installed-->Templates-->Visual C#-->Android-->choose the Blank App (Android).

Next, give your Android app a name (Ex:sample) and give path of your project. Click OK.



Step 3 - Next, go to the Solution Explorer. Next, select Resource --> Layout --> double click to open main.axml page. 

If you want to design the app through GUI, choose the Design View, otherwise select Code View. 



Step 4 - After opening the main.axml file, just design the app as per your requirement. 



Step 5 - Next, delete the default "Hello World" button.

Go to the source panel. You can see the button coding. Just delete this button.



Step 6 - After deleting the XAML code, delete the C# button action code.

Go to the MainActivity.cs page and delete the button code.


 
Step 7 - Next, go to the toolbox window which has all types of the tools and control. Go to the toolbox window and scroll down. You will see the Seek Bar Control.

Drag and drop the Seek Bar Control in your main.axml page.



Step 8 - This will show the Rating Bar in your app page.



Main.axml Code
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout  
  3.     xmlns:android="http://schemas.android.com/apk/res/android"  
  4.   
  5. android:orientation="vertical"  
  6.   
  7. android:layout_width="match_parent"  
  8.   
  9. android:layout_height="match_parent"  
  10.   
  11. android:minWidth="25px"  
  12.   
  13. android:minHeight="25px">  
  14.     <SeekBar  
  15.   
  16. android:layout_width="match_parent"  
  17.   
  18. android:layout_height="wrap_content"  
  19.   
  20. android:id="@+id/seekBar1" />  
  21. </LinearLayout>   
Step 9 - If you have an Android Virtual Device, you can run the app in the Virtual device. Otherwise, connect Android phone via USB cable in your system or laptop, and enable USB debugging. 
Next, go to Visual Studio. It will show the model name of connected phone in Run menu. Click the connected Android phone. It will run the app in your Android phone. 



Output

The app will take some time because the app will be built in your phone.

Here is the output with Seek Bar control.



Summary - So, this was the process of creating Seek Bar Control in Xamarin Android app, using Visual Studio 2015 update 3.

 


Similar Articles