Windows Phone 7 Date Selection Control datepicker and Time Selection Control timepicker

Datepicker and timepicker are controls in Microsoft's toolkit components.

Datepicker is a date Selection Control used for date format input. The implementation result is as follows:

Timepicker is a Time Selection Control used for time format input. The implementation result is as follows:

In Windows Phone 7ProgramUse these two controls

1. Load Microsoft. Phone. Controls. toolkit. dll references.

Add a space reference in XAML

Xmlns: Toolkit = "CLR-namespace: Microsoft. Phone. controls; Assembly = Microsoft. Phone. Controls. toolkit"

2. XAML call syntax

   <  Stackpanel  X: Name  = "Contentpanel"  Grid. Row = "1"  Margin  = "12, 0, 12, 0"  >  
  <  Toolkit: datepicker  X: Name  = "Datepicker"  Header  = "Datepicker date Selection control"  Value  = "2/3/2010"     />  
  < Toolkit: timepicker  X: Name  = "Timepicker"  Header  = "Timepicker Time Selection control"  Valuestringformat  ="  {} {0: t}  "  />  
  <  Toolkit: datepicker  X: Name  = "Datepicker1"  Header = "Extended datepicker control"  Value  = "2/3/2010"  
Pickerpageuri  = "/Datepickerdemo; component/custompage. XAML"     />  
  </  Stackpanel  > 

Shown below

Pickerpageuri refers to the link URL of the extended control, that is, the address that implements the extended control.

The extension control must inherit the idatetimepickerpage interface.

Below is the mpage. XAMLCode

  <  Grid  X: Name  = "Contentpanel"  Grid. Row  = "1"  Margin  = "12, 0, 12, 0"  >  
  <  Border  Borderbrush  = "Red"  Background  = "Orange" Height  = "200"  Width  = "300"  >  
  <  Button  Content  = "Datetime now"  X: Name  = "BTN"  Click  = "Btn_click"  />  
  </ Border  >  
  </  Grid  > 

   Public     Partial     Class  Custompage: phoneapplicationpage, idatetimepickerpage
{
  Public  Custompage ()
{
Initializecomponent ();
}

 # Region  Idatetimepickerpage members  

  Public  Datetime  ?  Value
{
  Get  ;
  Set  ;
}

  # Endregion  

  Private     Void Btn_click (  Object  Sender, routedeventargs E)
{
  //  Select time and close the page  
  Value  =  Datetime. now;
Navigationservice. Goback ();  //  Return  
  }
} 

A valuechanged event is an event triggered after the date or time is selected.

The mainpage. XAML. CS page shows how to use this event.

  Public     Partial     Class  Mainpage: phoneapplicationpage
{
  //  Constructor  
    Public  Mainpage ()
{
Initializecomponent ();
  This  . Datepicker. valuechanged  + =    New  Eventhandler  <  Datetimevaluechangedeventargs  >  (Picker_valuechanged );
}

  Void  Picker_valuechanged (  Object  Sender, datetimevaluechangedeventargs E)
{
Datetime date  =  (Datetime) E. newdatetime;
MessageBox. Show (date. tostring (  " D  "  ));
}
} 

After the date is selected, the result is as follows: