xamGrid コントロールの代わりに xamDataGrid コントロールを使用してください。xamGrid は数年以内に廃止する予定のため、新しい機能の追加はありません。xamGrid のサポートおよび重要なバグ修正は廃止時まで提供されます。コードベースの xamDataGrid への移動に関する質問は、サポートまでお問い合わせください。
遅延スクロールおよび GroupBy を有効にすると、デフォルトのプレビューは xamGrid コントロールの親の最初の列を表示します。ただし、このプレビューをカスタマイズするために開発者自身のデータ テンプレートを作成することもできます。
このトピックでは以下を前提とします。
階層的な xamGrid コントロールをページのデータに既にバインドしてあること。詳細は、 データ バインディングおよび 列レイアウトの定義のトピックを参照してください。
遅延スクロールを有効にしてあります。詳細は、 遅延スクロールを参照してください。
GroupBy を有効にしてあります。詳細については、 GroupBy トピックを参照してください。
DeferredScrollingSettings オブジェクトの GroupByDeferredScrollTemplate プロパティをカスタム データ テンプレートに設定することによって、遅延スクロール設定をカスタマイズします。このデータ テンプレートは、グリッドがグループ化される値を表示し、また xamGrid を異なる色でシェードします。
GroupByDeferredScrollTemplate プロパティのタグを xamGrid に追加します
XAML の場合:
<ig:XamGrid.DeferredScrollingSettings>
<ig:DeferredScrollingSettings AllowDeferredScrolling="Default">
<ig:DeferredScrollingSettings.GroupByDeferredScrollTemplate>
<!-- DataTemplate を追加します -->
</ig:DeferredScrollingSettings.GroupByDeferredScrollTemplate>
</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}
Foreground - White
XAML の場合:
<TextBlock Text="{Binding Path=Row.Data}" Foreground="White"/>
アプリケーションを保存して実行します。
