Introduction

In this article we will see how can we use DomainUpDown Control available in Silverlight 3 Toolkit.

Creating Silverlight Project

Fire up Visual Studio 2008 and create a Silverlight Application. Name it as DomainUpDownInSL3.

1.gif

Go ahead and add a DomainUpDown control and name it as MyDomainUpDown.

I have designed the page as follows:

2.gif

Now what we need is a collection of sample data.

Create a class and name it as States.cs

Add the following properties:

public class States
 {
 public string State { get; set; }
 public string Capital { get; set; }
 public string Short { get; set; }
 public string Language { get; set; }
 }

Now we need to make a data template of the DomainUpDown control and bind properties to it.

<inputToolkit:DomainUpDown x:Name="MyDomainUpDown" HorizontalAlignment="Left" ValueMemberPath="Short" Height="75" FontSize="34" Grid.Column="1" Grid.Row="1">
 <inputToolkit:DomainUpDown.ItemTemplate>
 <DataTemplate>
 <Grid MinWidth="370">
 <Grid.Background>
 <SolidColorBrush Color="#aa000000" />
 </Grid.Background>
 <TextBlock Foreground="#22ffffff" Margin="4+0,2+0" FontSize="34" Text="{Binding Short}" />
 <StackPanel HorizontalAlignment="Right" Margin="0, 0, 8, 0">
 <TextBlock HorizontalAlignment="Right" Foreground="White" FontSize="12" Text="{Binding Capital}" Padding="2" />
 <TextBlock HorizontalAlignment="Right" Foreground="White" FontSize="14" Text="{Binding Language}" Padding="2" />
 <TextBlock HorizontalAlignment="Right" Foreground="White" FontSize="14" Text="{Binding State}" Padding="2" />
 </StackPanel>
 </Grid>
 </DataTemplate>
 </inputToolkit:DomainUpDown.ItemTemplate>
 </inputToolkit:DomainUpDown>

Now we will create a sample list of data and assign the ItemSource of the DomainUpDown control to it:

public MainPage()
 {
 InitializeComponent();
 List<States> myList = new List<States>
{
new States{ State="Andhra Pradesh", Capital="Hyderabad", Short="AP", Language="Telugu and Urdu"},
 new States{State="Arunachal Pradesh" , Capital="Itanager", Short="ARP", Language="Miji, Apotanji, Merdukpen, Tagin,Adi"},
 new States{State="Assam" , Capital="Dispur", Short="AS", Language="Assamese"},
 new States{State="Bihar" , Capital="Patna", Short="BH", Language="Hindi"},
 new States{State="Chhattisgarh" , Capital="Raipur", Short="CH", Language="Hindi"},
 new States{State="Goa" , Capital="Panaji", Short="GO", Language="Marathi and Konkani"},
 new States{State="Gujarat" , Capital="Gandhinagar", Short="GUJ", Language="Gujarati"},
 new States{State="Haryana" , Capital="Chandigarh", Short="HAR", Language="Hindi"},
 new States{State="Himachal Pradesh" , Capital="Shimla", Short="HP", Language="Hindi and Pahari"},
 new States{State="Jammu & Kashmir" , Capital="Srinagar, Jammu", Short="JK", Language="Kashmiri,Dogri, Urdu, Ladakhi"},
 new States{State="Jharkhand" , Capital="Ranchi", Short="JH", Language="Hindi"},
 new States{State="Karnataka" , Capital="Bangalore", Short="KR", Language="Kannda"},
 new States{State="Kerala" , Capital="Trivandrum", Short="KL", Language="Malayalam"},
 new States{State="Madhya Pradesh" , Capital="Bhopal", Short="MP", Language="Hindi"},
 new States{State="Maharashtra" , Capital="Bombay", Short="MH", Language="Marathi"},
 new States{State="Manipur" , Capital="Imphal", Short="MN", Language="Manipuri"},
 new States{State="Meghalaya" , Capital="Shillong", Short="MG", Language="Khasi, Jaintia and Garo"},
 new States{State="Mizoram" , Capital="Aizawl", Short="MZ", Language="Mizo and English"},
 new States{State="Nagaland" , Capital="Kohima", Short="NG", Language="Ao, Konyak, Angami, Sema and Lotha"},
 new States{State="Orissa" , Capital="Bhubaneswar", Short="ORI", Language="Oriya"},
 new States{State="Punjab" , Capital="Chandigarh", Short="PN", Language="Punjabi"},
 new States{State="Rajasthan" , Capital="Jaipur", Short="RJ", Language="Rajasthani and Hindi"},
 new States{State="Sikkim" , Capital="Gangtok", Short="SK", Language="Bhutia, Hindi, Nepali, Lepcha, Limbu"},
 new States{State="Tamil Nadu" , Capital="Chennai", Short="TN", Language="Tamil"},
 new States{State="Tripura" , Capital="Agartala", Short="TR", Language="Bengali, Tripuri, Manipuri, Kakborak"},
 new States{State="Uttar Pradesh" , Capital="Lucknow", Short="UP", Language="Hindi"},
 new States{State="Uttaranchal" , Capital="Dehra Dun", Short="UC", Language="Hindi"},
 new States{State="West Bengal" , Capital="Kolkata", Short="WB", Language="Bengali"}
 };
 MyDomainUpDown.ItemsSource = myList;
 }

That's it. Now run your application and you will find the following screen:

3.gif

The good thing about this control is that when it reaches at the beginning or at the end the button gets disabled.

Enjoy Coding.