Question

我想在DataGrid中显示我的数据。我为它写了我的风格，这里是

    <Style TargetType="DataGridColumnHeader">
        <Setter Property="FontSize" Value="20"/>
        <Setter Property="Background" Value="DarkGreen" />
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="BorderThickness" Value="0,0,0,1"/>
        <Setter Property="BorderBrush" Value="ForestGreen"/>
        <Setter Property="Height" Value="80"/>
        <Setter Property="Padding" Value="5,0,0,0"/>
    </Style>

    <Style TargetType="DataGridRow">
        <Setter Property="FontSize" Value="18"/>
        <Setter Property="Background" Value="White"/>
        <Setter Property="Margin" Value="0,6,0,0"/>
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="LightGreen"/>
                <Setter Property="Foreground" Value="DarkGreen"/>
            </Trigger>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background" Value="LightGreen"/>
                <Setter Property="Foreground" Value="DarkGreen"/>
                <Setter Property="BorderBrush" Value="ForestGreen"/>
                <Setter Property="BorderThickness" Value="1"/>
            </Trigger>
        </Style.Triggers>
    </Style>

    <Style TargetType="DataGridCell">
        <Setter Property="Height" Value="80"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="Focusable" Value="False"/>
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background" Value="LightGreen"/>
                <Setter Property="Foreground" Value="DarkGreen"/>
                <Setter Property="BorderThickness" Value="0"/>
            </Trigger>
        </Style.Triggers>
    </Style>

当我选择行时，边框显示向上，但行的宽度变得大于DataGrid的宽度 - ＆gt;我看不到右边的边框和水平滚动条显示了。

所以问题是：如何增加行的边框厚度，但不增加行的宽度和高度？

UPD before selection

after selection

Answer 1

<ColumnDefinition Width="50"/>
<ColumnDefinition Width="5*"/>
<ColumnDefinition Width="5*"/>

第1列是固定宽度50，而其他2是相同宽度。这使得您的窗口左边距较窄，右边有网格尺寸边距。更改列3宽度= 50.如果这不是您想要的方式，请同时制作col 2 *＆amp; 3 width = *，因为它与5 *相同。

接下来，为每个网格列分配一个宽度作为比例。当您调整窗口大小时，只有最后一列文本被切断。否则看起来很不错细

Answer 2

将DataGridRow样式更改为以下样式：

<DataGrid.RowStyle>
    <Style TargetType="{x:Type DataGridRow}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type DataGridRow}">
                    <Border x:Name="DGR_Border" 
                            Background="{TemplateBinding Background}"
                            SnapsToDevicePixels="True">
                        <SelectiveScrollingGrid>
                            <SelectiveScrollingGrid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="*"/>
                            </SelectiveScrollingGrid.ColumnDefinitions>
                            <Grid Grid.Column="1">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*"/>
                                    <RowDefinition Height="Auto"/>
                                </Grid.RowDefinitions>
                                <DataGridCellsPresenter ItemsPanel="{TemplateBinding ItemsPanel}" 
                                                        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
                                <DataGridDetailsPresenter Margin="4" 
                                                          Grid.Row="1" 
                                                          SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical}, Converter={x:Static DataGrid.RowDetailsScrollingConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" 
                                                          Visibility="{TemplateBinding DetailsVisibility}"/>

                                <Border BorderBrush="{TemplateBinding BorderBrush}" 
                                        BorderThickness="{TemplateBinding BorderThickness}" 
                                        Grid.RowSpan="2"/>
                            </Grid>
                            <DataGridRowHeader SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical" 
                                               Visibility="{Binding HeadersVisibility, ConverterParameter={x:Static DataGridHeadersVisibility.Row}, Converter={x:Static DataGrid.HeadersVisibilityConverter}, RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}"/>
                        </SelectiveScrollingGrid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Style.Triggers>
            <Trigger Property="DetailsVisibility" Value="Visible">
                <Setter Property="BorderThickness" Value="4,1,4,4"/>
                <Setter Property="BorderBrush" Value="#FF3886B9"/>
            </Trigger>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Background" Value="LightGreen"/>
                <Setter Property="Foreground" Value="DarkGreen"/>
                <Setter Property="BorderBrush" Value="ForestGreen"/>
                <Setter Property="BorderThickness" Value="1"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</DataGrid.RowStyle>

希望这可以解决您的问题...

WPF DataGridRow BorderThickness增加行的宽度

2 个答案: