每个列标题的边框 [英] Border per column header

问题描述

我想在 wpf 上创建一个表格，每个列标题都有一个圆角，这是我目前得到的:

I want to create a table on wpf that each column header has a round corner this is what i got so far:

如您所见，我得到了想要的结果，但也有一些不想要的结果.不希望出现的是所有数据网格标题本身(而不是列)具有相同的边框，我需要使其透明，我该怎么做?

as you can see, i have the desired outcome with a little un desired outcome. the undesired out come is that the all data grid header itself (not the columns) is getting the same border, i need to make it transparent, how can i do that?

这是样式的一部分:

<DataGrid.ColumnHeaderStyle>
    <Style TargetType="{x:Type DataGridColumnHeader}">
        <Setter Property="SeparatorBrush"  Value="Transparent"/>
        <Setter Property="Margin" Value="2"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>                                        
                        <Grid>
                            <Border CornerRadius="5 5 0 0" BorderThickness="1" BorderBrush="Black">
                                <TextBlock Text="{Binding }"/>
                            </Border>
                        </Grid>                                        
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</DataGrid.ColumnHeaderStyle>  

推荐答案

由于某些原因，DataGrid 在其模板中有一个空白的 DataGridColumnHeader.空白列没有 DataContext 值 (null).因此，在 DataTrigger 中将边框画笔更改为透明:

for some reasons, DataGrid has a blank DataGridColumnHeader in its template. that blank columns doesn't have DataContext value (null). So change border brush to transparent in a DataTrigger:

<ControlTemplate>
    <Grid>
        <Border CornerRadius="5 5 0 0" BorderThickness="1" >
            <TextBlock Text="{Binding}"/>
            <Border.Style>
                <Style TargetType="Border">
                    <Setter Property="BorderBrush" Value="Black"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding}" Value="{x:Null}">
                            <Setter Property="BorderBrush" Value="Transparent"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>
        </Border>
    </Grid>
</ControlTemplate>

<小时>改进版本，在标题模板中使用 ContentPresenter 并在触发器中测试内容

---

improved version, which uses ContentPresenter in header template and test Content in a trigger

<ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
    <Grid>
        <Border CornerRadius="5 5 0 0" BorderThickness="1" >
            <ContentPresenter/>                                        
            <Border.Style>
                <Style TargetType="Border">
                    <Setter Property="BorderBrush" Value="Black"/>
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}" Value="{x:Null}">
                            <Setter Property="BorderBrush" Value="Transparent"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Border.Style>
        </Border>
    </Grid>
</ControlTemplate>

header 不是必要的文本，例如:

header is not necessary a text, e.g.:

<DataGrid.Columns>
    <DataGridTextColumn Binding="{Binding Path=Name}">
        <DataGridTextColumn.Header>
            <Border Background="Cyan">
                <TextBlock Text="NAME" Margin="5"/>
            </Border>
        </DataGridTextColumn.Header>
    </DataGridTextColumn>
</DataGrid.Columns>

这篇关于每个列标题的边框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！