xamGrid コントロールの代わりに xamDataGrid コントロールを使用してください。xamGrid は数年以内に廃止する予定のため、新しい機能の追加はありません。xamGrid のサポートおよび重要なバグ修正は廃止時まで提供されます。コードベースの xamDataGrid への移動に関する質問は、サポートまでお問い合わせください。
遅延スクロールを有効にすると、デフォルトのプレビューは xamGrid の最初の列の値を表示します。ただし、このプレビューをカスタマイズするために開発者自身のデータ テンプレートを作成することもできます。
前提
このトピックは、ページ上のデータにバインドされた xamGrid コントロールがすでにあることが前提となっています。詳細は、 xamGrid をデータにバインドのトピックを参照してください。このトピックは遅延スクロールが有効になっていることも前提です。詳細は、 遅延スクロールを参照してください。
DeferredScrollingSettings オブジェクトの DeferredScrollTemplate プロパティをカスタム データ テンプレートに設定することによって、遅延スクロール設定をカスタマイズします。このデータ テンプレートは、ProductName の値を表示し、xamGrid コントロールを異なる色でシェードします。
DeferredScrollTemplate プロパティのタグを xamGrid に追加します。
XAML の場合:
<ig:XamGrid.DeferredScrollingSettings>
<ig:DeferredScrollingSettings AllowDeferredScrolling="Default">
<ig:DeferredScrollingSettings.DeferredScrollTemplate>
<!-- DataTemplate を追加します -->
</ig:DeferredScrollingSettings.DeferredScrollTemplate>
</ig:DeferredScrollingSettings>
</ig:XamGrid.DeferredScrollingSettings>
DataTemplate を作成します。遅延スクロール テンプレートのデータ コンテキストは ScrollTipInfo オブジェクトであるので、このデータ テンプレート内の ScrollTipInfo オブジェクトによって公開される以下のプロパティをバインドできます。
行
FirstColumnValue
列
Grid パネルを DataTemplate に追加します。
Rectangle を Grid パネルに追加します。この矩形はシェーディングの外観にするために xamGrid 上に表示されます。
以下のプロパティを Rectangle に設定します。
Fill - Blue
Opacity - 0.65
XAML の場合:
<DataTemplate>
<Grid>
<Rectangle Fill="Blue" Opacity="0.65"/>
<!--StackPanel を追加します -->
</Grid>
</DataTemplate>
StackPanel コンテナーを Grid パネルに追加します。以下のプロパティを設定します。
HorizontalAlignment - Center
VerticalAlignment - Center
XAML の場合:
<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center"> <!-- TextBlock を追加します --> </StackPanel>
TextBox コントロールを StackPanel コンテナーに追加します。この TextBox コントロールで ProductName 列から情報を表示します。
以下のプロパティを設定します。
Text - {Binding Path = Row.Data.ProductName}
Foreground - White
XAML の場合:
<TextBlock Text="{Binding Path=Row.Data.ProductName}" Foreground="White"/>
アプリケーションを保存して実行します。
