UIPickerView In Xamarin iOS

Introduction

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

Prerequisites

Xamarin Studio.
Xcode.

The steps given below are required to be followed in order to create a Picker View using UIPickerView in Xamarin iOS.

Step 1

Go To Xamarin Studio.

Click New Solution—> select iOS—>select App--> choose Single View App. Afterward, click "Next".

Step 2

In this step, configure your app. Give the App Name (Ex:sample), Organization Identifier. Then, click Next.

Step 3

In this step, give your project name (Ex: Sample) and solution name (Ex: Sample). Give the path of your project. Afterward, click Create.

Step 4

Subsequently, go to the solution. In the solution, you get all the files and sources available in your project. Now, select Main.storyboard and double click to open Main.storyboard page.

After opening the Main.storyboard, you can design this page as per your desire.

Step 5

In this step, design your app using Storyboard, Toolbox, and Properties.

UIPicker(CountryPicker).
Lable(lblValue).

Step 6

Create CountryPickerModel Inheritance class from UIPickerViewModel.

Step 7

Go to the CountryPickerModel.cs page and write the code given below in it.

CountryPickerModel.cs

using UIKit;
using System.Collections.Generic;
using System;
namespace XamariniOSUIPicker {
public class CountyPickerModel: UIPickerViewModel {
List < string > Country;
public EventHandler ValueChanged;
public string SelectedValue;
public CountyPickerModel(List < string > Country) {
this.Country = Country;
}
public override nint GetRowsInComponent(UIPickerView pickerView, nint component) {
return Country.Count;
}
public override nint GetComponentCount(UIPickerView pickerView) {
return 1;
}
public override string GetTitle(UIPickerView pickerView, nint row, nint component) {
return Country[(int) row];
}
public override void Selected(UIPickerView pickerView, nint row, nint component) {
var country = Country[(int) row];
SelectedValue = country;
ValueChanged ? .Invoke(null, null);
}
}
}

Step 8

In this step, go to the ViewController.cs page. Then, write the following code in that file.

ViewController.cs

using System;
using System.Collections.Generic;
using UIKit;
namespace XamariniOSUIPicker {
public partial class ViewController: UIViewController {
protected ViewController(IntPtr handle): base(handle) {
// Note: this .ctor should not contain any initialization logic.
}
List < string > Country = new List < string > {
"America",
"Australia",
"Bangladesh",
"Canada",
"Colombia",
"China",
"Denmark",
"India"
};
public override void ViewDidLoad() {
base.ViewDidLoad();
// Perform any additional setup after loading the view, typically from a nib.
var picker = new CountyPickerModel(Country);
CountryPicker.Model = picker;
picker.ValueChanged += (sender, e) => {
lblValue.Text = picker.SelectedValue;
};
}
public override void DidReceiveMemoryWarning() {
base.DidReceiveMemoryWarning();
// Release any cached data, images, etc that aren't in use.
}
}
}

Step 9

Now, go to Run option. Choose Debug and a model from the list of iPhone and iPad simulators.

Output

After a few seconds, the app will start running on your iPhone simulator. You will see your app working successfully.

You can see the UiPickerView is working successfully.

Summary

This was the process of creating a Picker View using UIPickerView in Xamarin iOS. Please share your comments and feedback.

4 Comments

Join the conversation! Your thoughts help the community grow.

roberto7y ago
How about changing the list? I have two list to populate the picker depending user choice ( using a segmented control)
Crash B.8y ago
This was awesome, it helped me a lot especially the event handler. Was wondering how to implement when something was selected. Thanks!
Logesh Palani9y ago
Nice bro ,,,??????
Arvind Chourasiya9y ago
Nice Article. Thank you for sharing.