DataGridの列ヘッダーやセル内のテキストの位置を右寄せにしてみます。
上記画像のウィンドウ画面のXAMLを元に説明していきます。画面の作成方法は下記リンクの関連ページをご覧下さい。
DataGridの右端の空白列を非表示にする[HorizontalAlignment]
まずは列ヘッダーを右寄せにしてみます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
<Grid> <DataGrid Name="dataGrid01" AutoGenerateColumns="False"> <DataGrid.ColumnHeaderStyle> <Style TargetType="DataGridColumnHeader"> <Setter Property="HorizontalContentAlignment" Value="Right" /> </Style> </DataGrid.ColumnHeaderStyle> <DataGrid.Columns> <DataGridTextColumn Header="ID" Binding="{Binding Id}"> </DataGridTextColumn> <DataGridTextColumn Header="タイトル" Binding="{Binding Title}"> </DataGridTextColumn> <DataGridTextColumn Header="著者" Binding="{Binding Author}" Width="*"> </DataGridTextColumn> </DataGrid.Columns> </DataGrid> </Grid> |
5〜10行目
DataGrid.ColumnHeaderStyle要素のDataGridColumnHeaderにおいて、HorizontalContentAlignmentプロパティをRightに指定しています。下記画像のように全ての列ヘッダー（ID、タイトル、著者）が右寄せになるのがわかります。
次に全てのセル内のテキストを右寄せにしてみます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
<Grid> <DataGrid Name="dataGrid01" AutoGenerateColumns="False"> <DataGrid.CellStyle> <Style TargetType="DataGridCell"> <Setter Property="HorizontalAlignment" Value="Right" /> </Style> </DataGrid.CellStyle> <DataGrid.Columns> <DataGridTextColumn Header="ID" Binding="{Binding Id}"> </DataGridTextColumn> <DataGridTextColumn Header="タイトル" Binding="{Binding Title}"> </DataGridTextColumn> <DataGridTextColumn Header="著者" Binding="{Binding Author}" Width="*"> </DataGridTextColumn> </DataGrid.Columns> </DataGrid> </Grid> |
5〜10行目
DataGrid.CellStyle要素のDataGridCellにおいて、HorizontalAlignmentプロパティをRightに指定しています。下記画像のようにセル内のテキストが右寄せになっているのがわかります。
次にある特定の列ヘッダー（タイトル）と特定の列（著者）のセルを右寄せにしてみます。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
<Grid> <DataGrid Name="dataGrid01" AutoGenerateColumns="False"> <DataGrid.Columns> <DataGridTextColumn Header="ID" Binding="{Binding Id}"> </DataGridTextColumn> <DataGridTextColumn Header="タイトル" Binding="{Binding Title}"> <DataGridTextColumn.HeaderStyle> <Style TargetType="DataGridColumnHeader"> <Setter Property="HorizontalContentAlignment" Value="Right" /> </Style> </DataGridTextColumn.HeaderStyle> </DataGridTextColumn> <DataGridTextColumn Header="著者" Binding="{Binding Author}" Width="*"> <DataGridTextColumn.ElementStyle> <Style TargetType="TextBlock"> <Setter Property="TextAlignment" Value="Right" /> </Style> </DataGridTextColumn.ElementStyle> </DataGridTextColumn> </DataGrid.Columns> </DataGrid> </Grid> |
14〜19行目
DataGridTextColumn.HeaderStyle要素のDataGridColumnHeaderにおいて、HorizontalContentAlignmentプロパティをRightに指定しています。下記画像のようにタイトルの列ヘッダーだけが右寄せになっているのがわかります。
27〜32行目
DataGridTextColumn.ElementStyle要素のTextBlockにおいて、TextAlignmentプロパティをRightに指定しています。下記画像のように著者列のセルのみが右寄せになっているのがわかります。
