WPF的DataGrid简单使用

　　简单做个记录。有时候会忘记某个样式怎么调整；

 首先写一个DataGrid，AlternatingRowBackground表示隔行更改背景色；AlternationCount表示隔的行数；：

<DataGrid Grid.Row="1"
          AlternatingRowBackground="Snow"
          AlternationCount="2"
          ItemsSource="{Binding Students}">
</DataGrid>       

再写ID列，Width是宽度比例，后面几列写法一样，更改下Header和Binding：

<DataGridTemplateColumn Width="*" Header="ID">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <Border BorderThickness="0 0 1 0" BorderBrush="LightGray">
                <TextBlock Text="{Binding ID}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            </Border>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

这个是输入框列，这里注意下Text的Binding需要指定UpdateSourceTrigger，否则不会立即更改，但是我记得单独写TextBox默认就是立马触发的：

<DataGridTemplateColumn Width="1.2*" Header="Score">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <TextBox Text="{Binding Score,UpdateSourceTrigger=PropertyChanged}" FontWeight="Light" VerticalAlignment="Center" Margin="3 0 3 0"/>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

这个是Edit列，里面是个Button，Command绑定的全局的委托命令，注意指定RelativeSource:

<DataGridTemplateColumn Width="1*" Header="Edit">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <Button Content="🖊" 
                    BorderThickness="0"
                    Background="Transparent"
                    VerticalAlignment="Center" 
                    HorizontalAlignment="Center" 
                    Command="{Binding DataContext.EditCommand, RelativeSource={RelativeSource AncestorType={x:Type UserControl} }}"
                    />
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>

最后写Style，美化下外观：

<Style TargetType="DataGrid">
    <Setter Property="Width" Value="500"/>
    <Setter Property="VerticalAlignment" Value="Top"/>
    <Setter Property="AutoGenerateColumns" Value="False"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="RowHeaderWidth" Value="0"/>
    <Setter Property="CanUserAddRows" Value="False"/>
    <Setter Property="GridLinesVisibility" Value="None" />
    <Setter Property="Cursor" Value="Hand"/>
    <Setter Property="SelectedIndex" Value="{Binding SelectedIndex}"/>
</Style>

AutoGenerateColumns:这个改为false就不会自动生成列了；RowHeaderWidth:改成0最左边的行标题就会消失；CanUserAddRows:改为false,最下面的空白行消失；GridLinesVisibility:默认的行列分割线消失；

<Style TargetType="DataGridRow">
    <Setter Property="BorderThickness" Value=" 0 0 0 1"/>
    <Setter Property="BorderBrush" Value="LightGray"/>
    <Setter Property="Height" Value="25"/>
    <Setter Property="VerticalAlignment" Value="Center"/>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value=" true">
            <Setter Property="Background" Value="#F0F8FF"/>
        </Trigger>
    </Style.Triggers>
</Style>

这里设置鼠标移动后每行的颜色变化效果；

<Style TargetType="DataGridCell">
    <Setter Property="BorderThickness" Value="0"/>
    <Style.Triggers>
        <Trigger Property="IsSelected" Value=" true">
            <Setter Property="Background" Value="LightCyan"/>
            <Setter Property="Foreground" Value="Blue"/>
            <Setter Property="FontWeight" Value="Bold"/>
        </Trigger>
    </Style.Triggers>
</Style>

这里设置选中某行后的效果，原来的蓝色太丑了；

<Style TargetType="DataGridColumnHeader">
    <Setter Property="Height" Value="50"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Border Background="SkyBlue" BorderThickness="0 0 1 0" BorderBrush="LightGray">
                    <TextBlock Text="{Binding}" 
                               FontSize="15" 
                               FontWeight="Bold"
                               Foreground="White"
                               FontFamily="Times New Roman"
                               VerticalAlignment="Center" 
                               HorizontalAlignment="Center"/>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这里美化列标题样式，对模板进行编辑；

以上，在VM中写对应的Model即可；