This topic will walk you through creating a C1DateTimeSelector control and applying some basic styling to the control via code.

Follow these steps:

1. Open MainPage.xaml if it isn't already open and locate the <Grid> </Grid> tag set. Edit the markup so that it resembles the following markup:

   Markup	Copy Code
   <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}" x:Name="LayoutRoot"> </Grid>

   
   
2. Right-click your page and select View Code from the list to switch to code view.
   
3. Add the following namespaces to your application

   C#	Copy Code
   using C1.Xaml;

   Visual Basic	Copy Code
   Imports C1.Xaml

   
   
4. Insert the following constructor directly below the InitializeComponent() method:

   C#	Copy Code
   C1DateTimeSelector c1DTS1 = new C1DateTimeSelector();

   Visual Basic	Copy Code
   Dim c1DTS1 As C1DateTimeSelector = New C1DateTimeSelector

   
   
5. Add the following code inside the constructor to control the width and height of the C1DateSelector control:

   C#	Copy Code
   c1DTS1.Height = 55; c1DTS1.Width = 600;

   Visual Basic	Copy Code
   c1DTS1.Height = 55 c1DTS1.Width = 600

   
   
6. Insert the final line of code to display the C1DateSelector:

   C#	Copy Code
   LayoutRoot.Children.Add(c1DTS1);

   Visual Basic	Copy Code
   LayoutRoot.Children.Add(c1DTS1)

   
   
7. Run your application. The C1DateTimeSelector control should resemble the following image: