カルーセルのカスタマイズ

「C1CarouselPanel の使用」トピックの例の C1CarouselPanel をカスタマイズするには、ItemsPanelTemplate 内の <c1:C1CarouselPanel/> タグ、または <ItemsControl> タグでプロパティを設定します。カルーセルに導入されるプロパティはすべて添付依存プロパティなので、<ItemsControl> タグでプロパティを設定できます。したがって、カルーセルのプロパティを実行時に変更できます。

C1CarouselPanel タグ

たとえば、C1CarouselPanel の可視要素の数を制限するために、<c1:C1CarouselPanel> タグで PageSize プロパティを設定できます。

WPF
Silverlight

XAML	コードのコピー
<Window.Resources> <!-- C1CarouselPanel を定義する ItemsPanelTemplate テンプレート。--> <ItemsPanelTemplate x:Key="carouselPanel"> <!-- PageSize プロパティを使用して、可視要素の数を３つに制限します。--> <c1:C1CarouselPanel PageSize="3" /> </ItemsPanelTemplate> </Window.Resources>

XAML

コードのコピー

<Window.Resources>
     <!-- C1CarouselPanel を定義する ItemsPanelTemplate テンプレート。-->
    <ItemsPanelTemplate x:Key="carouselPanel">
        <!-- PageSize プロパティを使用して、可視要素の数を３つに制限します。-->
        <c1:C1CarouselPanel PageSize="3" />
    </ItemsPanelTemplate>
</Window.Resources>

XAML	コードのコピー
<UserControl.Resources> <!-- C1CarouselPanel を定義する ItemsPanelTemplate テンプレート。--> <ItemsPanelTemplate x:Key="carouselPanel"> <!-- PageSize プロパティを使用して、可視要素の数を３つに制限します。--> <c1:C1CarouselPanel PageSize="3" /> </ItemsPanelTemplate> </UserControl.Resources>

XAML

コードのコピー

<UserControl.Resources>
     <!-- C1CarouselPanel を定義する ItemsPanelTemplate テンプレート。-->
    <ItemsPanelTemplate x:Key="carouselPanel">
        <!-- PageSize プロパティを使用して、可視要素の数を３つに制限します。-->
        <c1:C1CarouselPanel PageSize="3" />
    </ItemsPanelTemplate>
</UserControl.Resources>

ItemsControl タグ

C1CarouselPanel の可視要素の数を制限するために、<ItemsControl> タグで PageSize プロパティを設定することもできます。

XAML	コードのコピー
<!-- ItemsPanel が C1CarouselPanel を定義する ItemsPanelTemplate に設定された ItemsControl。PageSize プロパティは、可視要素の数を３つに制限します。--> <ItemsControl ItemsPanel="{StaticResource carouselPanel}" c1grid:C1CarouselPanel.PageSize="3"> <!-- ItemsControl 内の任意のコントロールまたは画像。--> <Image Width="51" Height="51" Source="image1.png"/> <Image Width="51" Height="51" Source="image2.png"/> <Image Width="51" Height="51" Source="image3.png"/> <Button Height="23" Name="Button1" Width="75">Button</Button> </ItemsControl>

XAML

コードのコピー

<!-- ItemsPanel が C1CarouselPanel を定義する ItemsPanelTemplate に設定された 

ItemsControl。PageSize プロパティは、可視要素の数を３つに制限します。-->
            <ItemsControl ItemsPanel="{StaticResource carouselPanel}" 

             c1grid:C1CarouselPanel.PageSize="3">
            <!-- ItemsControl 内の任意のコントロールまたは画像。-->
            <Image Width="51" Height="51" Source="image1.png"/>
            <Image Width="51" Height="51" Source="image2.png"/>
            <Image Width="51" Height="51" Source="image3.png"/>
            <Button Height="23" Name="Button1" Width="75">Button</Button>
</ItemsControl>