WPF DataGridのスタイルについての備忘録

WPF　DataGridを使用する

スタイルシートを外に出す。

1. リソースディクショナリを追加する
2. スタイルシートを使用するWindowにリソースの参照を記述する

    <Window.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="pack://application:,,,/プロジェクト名;component/フォルダ名/Resource.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>

・スタイルシートに記述していく

    <!--データグリッドスタイル集-->
    <Style x:Key="DataGridHeaderStyle" TargetType="DataGridColumnHeader">
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
    </Style>
    <Style x:Key="DataGridCellStyle" TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Center"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
    </Style>
    <Style x:Key="NumberCellstyle" TargetType="TextBlock">
        <Setter Property="HorizontalAlignment" Value="Right"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
    </Style>

・使用する画面側でスタイルシートを参照していく

        <DataGrid x:Name="datagrid" Grid.Row="5" Grid.ColumnSpan="6" Margin="3"
                  ItemsSource="{Binding ResultData}"
                  AutoGenerateColumns="False" SelectionUnit="Cell"
                  ScrollViewer.VerticalScrollBarVisibility="Visible"
                  ScrollViewer.HorizontalScrollBarVisibility="Visible"
                  FontSize="18" CanUserAddRows="False">
            <DataGrid.Columns>
                <DataGridTextColumn Header="在庫品番" Width="*" Binding="{Binding Inventory_No}"/>
                <DataGridTextColumn Header="在庫品名" Width="*" Binding="{Binding Inventory_Name}"/>
                <DataGridTextColumn Header="製品名" Width="auto" Binding="{Binding Material_Name}"/>
                <DataGridTextColumn Header="数量" Width="*" Binding="{Binding Stock_Quantity,StringFormat=N0}"
                                    HeaderStyle="{StaticResource DataGridHeaderStyle}"
                                    ElementStyle="{StaticResource NumberCellstyle}"/>
                <DataGridTextColumn Header="単位" Width="auto" Binding="{Binding Unit_Name}"/>
                <DataGridTextColumn Header="発注点" Width="*" Binding="{Binding Reorder_Point,StringFormat=N0}"
                                    HeaderStyle="{StaticResource DataGridHeaderStyle}"
                                    ElementStyle="{StaticResource NumberCellstyle}"/>
                <DataGridTextColumn Header="部門" Width="*" Binding="{Binding Dept_Name}"/>
                <DataGridTextColumn Header="最終入庫日" Width="*" Binding="{Binding Last_In_Date_Formatted}"/>
                <DataGridTextColumn Header="最終出庫日" Width="*" Binding="{Binding Last_Out_Date_Formatetd}"/>
            </DataGrid.Columns>
        </DataGrid>

・指定している部分はHeaderStyleとElementStyle
・CellStyleとElementStyleとあって、セルの中の値を弄りたい場合はElementStyleにします。
セル内の値を中央揃えにしたりとか、割とCellStyleで説明している資料が多かった気がする。

<DataGridTextColumn Header="数量" Width="*" Binding="{Binding Stock_Quantity,StringFormat=N0}"
                                    HeaderStyle="{StaticResource DataGridHeaderStyle}"
                                    ElementStyle="{StaticResource NumberCellstyle}"/>

セルのフォーマットについて

・最初はスタイルシートに組み込む形を採用しようと思いましたがめんどくさくなったので使用する側のWindowに記述しました。

Binding="{Binding Stock_Quantity,StringFormat=N0}"

1. 数値のフォーマットについて
   ・上記の内容です。StringFormat=N0はカンマ区切りです。
   ・その他の書式については調べてください。
2. 日付のフォーマットについて
   ・元のデータ型が日付型であればStringFormat=yyyy/MM/ddで変更できますが
   ・データの取り扱いの関係で8桁の数値で持っている事もあります。
   その場合はStrngFormatでは日付型に変換できないので気を付けましょう。
   処理コードで文字列型に変換してバインドしてあげて下さい。

まとめ

・WPFでデータグリッドのスタイルについて躓いたところを記録として残します。