バージョン

xamCarouselListBox のパスで要素のスケールを変更

xamCarouselListBox コントロールによって、パス上の位置に基づいてパーセントで項目をスケールすることができます。スケーリングはレコードに 3D 効果を提供します。ScalingEffect は、 ScalingEffectsStops を含む ScalingEffectStopCollection (それぞれがオフセットとそのオフセットで適用する値を指定する) を定義する点で、その他のパスエフェクトに似ています。値は 0 から 10 に進むことができる小数のパーセントです。

CarouselViewSettings オブジェクトの UseScaling プロパティを True に設定することによってスケーリングを有効にします。この同じオブジェクトで、 ScalingEffectStopDirection プロパティを UseItemPath、Horizontal、または Vertical に設定します。

Note

注: このトピックは、 xamCarouselListBox をアプリケーションに追加のタスクを完了していることが前提となります。

  1. ViewSettings オブジェクトを定義します。

XAML の場合:

<igWindows:XamCarouselListBox.ViewSettings>
        ...
</igWindows:XamCarouselListBox.ViewSettings>
  1. CarouselViewSettings オブジェクトを指定して、UseScaling プロパティを True に、ScalingEffectStopDirection プロパティを UseItemPath に設定します。

XAML の場合:

<igWindows:CarouselViewSettings ScalingEffectStopDirection="UseItemPath"
  UseScaling="True">
        ...
</igWindows:CarouselViewSettings>
  1. ScalingEffectStops オブジェクトを定義します。このオブジェクトには、ScalingEffectStopCollection と ScalingEffectStops が含まれます。3 つの ScalingEffectStops を作成します。

XAML の場合:

<igWindows:CarouselViewSettings.ScalingEffectStops>
        <igWindows:ScalingEffectStopCollection>
                <igWindows:ScalingEffectStop Offset="0" Value="2" />
                <igWindows:ScalingEffectStop Offset=".5" Value="1.1" />
                <igWindows:ScalingEffectStop Offset="1" Value=".1" />
        </igWindows:ScalingEffectStopCollection>
</igWindows:CarouselViewSettings.ScalingEffectStops>
  1. プロジェクトをビルドして実行します。以下の画像のように、パスを通過すると xamCarouselListBox 内の項目のサイズが大きくなります。

xamCarouselListBox のパスで要素のスケールを変更