XamDataGrid では、デフォルトで選択行やアクティブ行、ホバー行など各種状態に対して青色を基調とした配色が行われています。これら行のスタイルを状況に応じて変更したいという状況はよくあります。今回は行のスタイルを状態毎に個別に変更する方法をご紹介します。

実装方法

XamDataGrid の行のスタイルは DataRecordPresenter クラスで設定することができます。XamDataGrid の各要素の構成は「xamDataGrid について」を参照下さい。

DataRecordPresenter に対するスタイルを作成します。Setter の Value には ComboBox で選択している色をバインドしています。実装の詳細は サンプル をご覧ください。

<Style TargetType="{x:Type igDP:DataRecordCellArea}">
    <!--アクティブ行の背景色-->
    <Setter Property="BackgroundActive"
            Value="{Binding ElementName=BackgroundActive_Color, Path=SelectedItem}"/>
    <!--選択行の背景色-->
    <Setter Property="BackgroundSelected"
            Value="{Binding ElementName=BackgroundSelected_Color, Path=SelectedItem}"/>
    <!--ホバー行の背景色-->
    <Setter Property="BackgroundHover"
            Value="{Binding ElementName=BackgroundHover_Color, Path=SelectedItem}"/>
    <!--アクティブ行のボーダー色-->
    <Setter Property="BorderActiveBrush"
            Value="{Binding ElementName=BorderActiveBrush_Color, Path=SelectedItem}"/>
    <!--ホバー行のボーダー色-->
    <Setter Property="BorderHoverBrush"
            Value="{Binding ElementName=BorderHoverBrush_Color, Path=SelectedItem}"/>
    <!--選択行のボーダー色-->
    <Setter Property="BorderSelectedBrush"
            Value="{Binding ElementName=BorderSelectedBrush_Color, Path=SelectedItem}"/>
</Style>

実行結果

画面右側のコンボボックスから色情報を選択して下さい。行のスタイルを無効化される場合、全てのコンボボックスで白色(#FFFFFFFF)を選択して下さい。

XamDataGrid 行スタイル

オンラインリソース

レコード ホバーの色の変更
http://jp.infragistics.com/help/wpf/xamdata-changing-the-record-hover-color

xamDataGrid、xamDataCarousel および xamDataPresenter のスタイリング ポイント
http://jp.infragistics.com/help/wpf/wpf-working-with-xamdatagrid-xamdatacarousel-and-xamdatapresenter-styling-points

Tagged:

製品について

Ultimate UI for WPF