Step 3 of 4: Adding Navigation Buttons

In This Topic

In this step you will add navigation buttons to switch between the C1Scheduler views. Add the following markup between the <Grid> tags and above the <c1sched> tags you added in the previous step:

XAML	Copy Code
<Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition /> </Grid.RowDefinitions> <StackPanel Grid.Row="0" Orientation="Horizontal"> <Button Content="One Day" c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}" c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand" c1:CommandExtensions.CommandParameter="{Binding Path=OneDayStyle, ElementName=sched1}"/> <Button Content="Working Week" c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}" c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand" c1:CommandExtensions.CommandParameter="{Binding Path=WorkingWeekStyle, ElementName=sched1}"/> <Button Content="Week" c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}" c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand" c1:CommandExtensions.CommandParameter="{Binding Path=WeekStyle, ElementName=sched1}"/> <Button Content="Month" c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}" c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand" c1:CommandExtensions.CommandParameter="{Binding Path=MonthStyle, ElementName=sched1}"/> <Button Content="Time Line" c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}" c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand" c1:CommandExtensions.CommandParameter="{Binding Path=TimeLineStyle, ElementName=sched1}"/> </StackPanel>

XAML

Copy Code

<Grid.RowDefinitions>
      <RowDefinition Height="Auto"/>
      <RowDefinition />
</Grid.RowDefinitions>

<StackPanel Grid.Row="0" Orientation="Horizontal">

<Button Content="One Day"
    c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}"
    c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand"
    c1:CommandExtensions.CommandParameter="{Binding Path=OneDayStyle, ElementName=sched1}"/>
<Button Content="Working Week"
    c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}"
    c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand"
    c1:CommandExtensions.CommandParameter="{Binding Path=WorkingWeekStyle, ElementName=sched1}"/>

<Button Content="Week"
    c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}"
    c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand"
    c1:CommandExtensions.CommandParameter="{Binding Path=WeekStyle, ElementName=sched1}"/>

<Button Content="Month"
    c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}"
    c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand"
    c1:CommandExtensions.CommandParameter="{Binding Path=MonthStyle, ElementName=sched1}"/>
<Button Content="Time Line"
    c1:CommandExtensions.CommandTarget="{Binding ElementName=sched1}"
    c1:CommandExtensions.Command="sched:C1Scheduler.ChangeStyleCommand"
    c1:CommandExtensions.CommandParameter="{Binding Path=TimeLineStyle, ElementName=sched1}"/>
</StackPanel>

The attached properties of the C1.Silverlight.CommandExtensions class will handle button clicks and execute corresponding C1Scheduler commands.

Product Support Forum | Print this page