The following topic explains how to bind a schedule to a C1DateTimePicker control in Microsoft Blend, Visual Studio, and using XAML.
Using Microsoft Blend
In Blend, linking C1Scheduler to the C1DateTimePicker control is as easy as setting a property, just like linking a schedule to a calendar.
1. Add a C1Scheduler and C1DateTimePicker control to your window.
2. Under Objects and Timelines, click C1Scheduler1, and enter C1Scheduler1 as the name of the control.
3. Select the C1DateTimePicker control you added to the window.
4. In the Properties panel of Design view, click the Advanced Property Options button next to the C1DateTimePicker.DateTime property in the DateTime category.
5. Select Custom Expression and enter the following expression:
{Binding Path=SelectedDateTime, ElementName=C1Scheduler1, Mode=TwoWay}
This will bind the selected date of the C1DateTimePicker to the schedule.
The equivalent XAML code can be viewed by clicking the XAML view tab. It should look like the following:
<c1sched:C1DateTimePicker HorizontalAlignment="Left" Margin="47,330,0,0" VerticalAlignment="Top" FontFamily="Tahoma" d:LayoutOverrides="Height" d:IsStaticText="True" DateTime="{Binding Path=SelectedDateTime, ElementName=C1Scheduler1, Mode=TwoWay}"/>
6. Press F5 to run the project and select a date in the C1DateTimePicker. The schedule’s selected date will change accordingly. If you select the TimePicker drop-down arrow and choose a time, the time will be selected in the schedule, except when the data view of C1Scheduler is set to Month View.
Using Visual Studio
To link C1Scheduler to a C1DateTimePicker control:
1. Add a C1Scheduler and C1DateTimePicker control to your Window1.xaml.
2. Select the schedule, and in the Properties window, enter C1Scheduler1 in the Name text box, if necessary.
3. Select the C1DateTimePicker control you added to the window.
4. In the XAML window, find the <my:C1DateTimePicker /> XAML.
5. Edit the XAML so it looks similar to the following:
<c1sched:C1DateTimePicker Name="C1DateTimePicker1" VerticalAlignment="Bottom" HorizontalAlignment="Left" FontFamily="Tahoma" DateTime="{Binding Path=SelectedDateTime, ElementName=C1Scheduler1, Mode=TwoWay}"/>
6. Press F5 to run the project and select a date in the C1DateTimePicker. The schedule's selected date will change accordingly. If you select the TimePicker drop-down arrow and choose a time, the time will be selected in the schedule, except when the data view of C1Scheduler is set to Month View.
Using XAML
The following XAML binds C1Scheduler to a C1DateTimePicker control:
<c1sched:C1DateTimePicker Name="C1DateTimePicker1" VerticalAlignment="Bottom" HorizontalAlignment="Left" FontFamily="Tahoma" DateTime="{Binding Path=SelectedDateTime, ElementName=C1Scheduler1, Mode=TwoWay}"/>
|
