Calendarの日付表示をカスタマイズするには？

Silverlightにはカレンダーを表示するためのCalendarコントロールというのがあって、さくっとカレンダーの一覧を出したい時に非常に役に立つ。

これの日付部分はボタンになっていて、日付だけが表示されているんだけど、例えばこの部分にテキストボックスとかを表示したい場合は以下のようにすれば、日付部分に表示するコントロールを変更できる。

Page.xaml

<UserControl x:Class="SilverlightApplication1.Page"
    xmlns="http://schemas.microsoft.com/client/2007" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid x:Name="LayoutRoot" Background="White">
        <Calendar>
            <Calendar.DayStyle>
                <Style TargetType="DayButton">
                    <Setter Property="ContentTemplate">
                        <Setter.Value>
                            <DataTemplate>
                                <StackPanel Width="100" Height="80" Margin="2">
                                    <TextBlock Text="{Binding}" />
                                    
                                    <TextBox Height="50" />
                                </StackPanel>
                            </DataTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Calendar.DayStyle>
        </Calendar>
    </Grid>
</UserControl>

スクリーンショット

解説

日付表示のカスタマイズ自体は「Calendar.DayStyle」要素でできる。似た様なので月表示をカスタマイズするための「Calendar.MonthStyle」なんてのもある。

<Calendar.DayStyle>
...
</Calendar.DayStyle>

この配下に「Style」要素を作成して、TargetTypeをDayButton型に指定する。これを指定しないと動かないので注意！

<Style TargetType="DayButton">
...
</Style>

「Setter」要素でDayButton型のどのプロパティに値を設定するかを指定する。DayButton型にどんなプロパティがあるかはVisualStudioのオブジェクトブラウザなんかで見るとわかる。

ここでは日付ボタンの表示内容をいじくるので、ContentTemplateプロパティを指定する。

<Setter Property="ContentTemplate">
...
</Setter>

ContentTemplateプロパティはDataTemplate型なので、「Setter.Value」要素の配下に「DataTemplate」要素を作成する。

<Setter.Value>
    <DataTemplate>
    ...
    </DataTemplate>
</Setter.Value>

あとはその中に日付ボタンの内容を表示するコントロールを配置するだけ。

<StackPanel Width="100" Height="80" Margin="2">
    <TextBlock Text="{Binding}" />
    
    <TextBox Height="50" />
</StackPanel>

TextBlockのText属性に「{Binding}」と指定すると、日付を表示できる。

こんな感じでカレンダーの表示を自由にカスタマイズすることができる。