如何更改 Datagrid 选定行的颜色和数据网格 Header UWP 中的字体 xaml

Question

我想更改 uwp 中数据网格选定行的颜色和数据网格列的高度 xaml 我正在使用 xamarin 表单。从 NuGet 安装包后。我能够使用数据网格。现在的问题是如何在 uwp

中更改数据网格 column/row 高度和选定行的颜色

我的数据网格xaml代码：=

 <controls:DataGrid AutoGenerateColumns="False"    CanUserResizeColumns="False" IsReadOnly="True" Margin="31,21,103,483" Name="UserListView" VerticalScrollBarVisibility="Auto"  UseLayoutRounding="True" HorizontalScrollBarVisibility="Auto" TabIndex="4" FontSize="14" Background="White"  
       HeadersVisibility="Column"   SelectedIndex="0" HorizontalGridLinesBrush="#E1E1E1" IsTabStop="True" RenderTransformOrigin="0.504,0.739" Grid.Row="2" BorderBrush="#E1E1E1" BorderThickness="1" Grid.Column="2" Grid.ColumnSpan="7" >

        <controls:DataGrid.Columns   >

          <controls:DataGridTemplateColumn     CanUserReorder="False" CanUserResize="False" Width="50" x:Name="userCheckBox" >
                <controls:DataGridTemplateColumn.CellTemplate >
                    <DataTemplate>
                        <CheckBox  Foreground="#444444" Height="10" Width="10" Margin="15,10,0,10"   x:Name="IndvCheckBox" DataContext="{Binding userId}" Unchecked="UserUnchecked"  Checked="UserChecked"  UseLayoutRounding="True">

                        </CheckBox>
                    </DataTemplate>
                </controls:DataGridTemplateColumn.CellTemplate>
            </controls:DataGridTemplateColumn>

            <controls:DataGridTemplateColumn  CanUserReorder="False" CanUserResize="False"   Header="Name" Width="380"  >
                <controls:DataGridTemplateColumn.CellTemplate   >
                    <DataTemplate>
                        <TextBlock  Margin="10,20,0,10"  x:Name="NameTextBox" Foreground="#444444" FontSize="12" FontFamily="Montserrat" >
                            <Run Text="{Binding userPrefix}" />
                            <Run Text="{Binding userFirstName}" />
                            <Run Text="{Binding userLastName}" />
                        </TextBlock>
                    </DataTemplate>
                </controls:DataGridTemplateColumn.CellTemplate>
            </controls:DataGridTemplateColumn>

        <controls:DataGridTemplateColumn  CanUserReorder="False" CanUserResize="False"   Header="Email" Width="380" >
                <controls:DataGridTemplateColumn.CellTemplate >
                    <DataTemplate>
                        <TextBlock  Margin="10,20,0,10" Text="{Binding userEmail}" x:Name="NameTextBox" Foreground="#444444" FontSize="12" FontFamily="Montserrat" />
                    </DataTemplate>
                </controls:DataGridTemplateColumn.CellTemplate>
            </controls:DataGridTemplateColumn>

            <controls:DataGridTemplateColumn CanUserReorder="False" CanUserResize="False"  Header="Phone" Width="250" >
                <controls:DataGridTemplateColumn.CellTemplate >
                    <DataTemplate>
                        <TextBlock  FontSize="12" Margin="10,20,0,10"  Text="{Binding userPhone}"   Foreground="#444444" FontFamily="Montserrat"/>
                    </DataTemplate>
                </controls:DataGridTemplateColumn.CellTemplate>
            </controls:DataGridTemplateColumn>

            <controls:DataGridTemplateColumn Tag="Col" Header="Update" Width="*">
                <controls:DataGridTemplateColumn.CellTemplate >
                    <DataTemplate>
                  <Image HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,20,0,10" Height="15" DataContext="{Binding userId}"  Width="15" Source="Images/Edit.png" Tapped="GridUpdateBtnClick"  />
                    </DataTemplate>
                </controls:DataGridTemplateColumn.CellTemplate>
            </controls:DataGridTemplateColumn>

        </controls:DataGrid.Columns>
    </controls:DataGrid>

Answer 1

How to change the Datagrid selcted row color

DataGrid控件中有ActiveRowColor属性用来管理Row选中的颜色。更多请参考this.

<dg:DataGrid  ActiveRowColor="Red"/>

and data grid Header Font in UWP xaml

您可以使用以下代码来管理页眉字体大小。

<dg:DataGrid.HeaderFontSize>
    <OnIdiom  x:TypeArguments="x:Double">
        <OnIdiom.Tablet>15</OnIdiom.Tablet>
        <OnIdiom.Phone>12</OnIdiom.Phone>
    </OnIdiom>
</dg:DataGrid.HeaderFontSize>

很遗憾，DataGrid 没有提供 FontFamily 属性的 Header。所以你需要像下面这样设置HeaderLabelStyle。

<dg:DataGrid.HeaderLabelStyle>
    <Style TargetType="Label">
        <Setter Property="FontFamily" Value="SimSun"></Setter>
    </Style>
</dg:DataGrid.HeaderLabelStyle>

如何更改 Datagrid 选定行的颜色和数据网格 Header UWP 中的字体 xaml

How to change the Datagrid selcted row color and data grid Header Font in UWP xaml

xaml

xamarin

xamarin.forms

uwp-xaml