You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何修改WPF中Xceed.PropertyGrid的网格行线条颜色与粗细?

我之前也跟你一样,被Xceed PropertyGrid默认那淡得几乎看不见的行线条坑过😅,下面几种方法都能轻松解决这个问题,你按需选就行:

方法1:覆盖全局系统资源(快速生效)

Xceed的PropertyGrid默认依赖系统自带的画笔来渲染行线条,比如{x:Static SystemColors.ControlDarkBrushKey}。你可以在App.xaml或者当前窗口的资源里重新定义这个画笔,就能全局修改所有类似控件的线条颜色

<Window.Resources>
    <!-- 替换默认的行分隔线颜色为深灰色 -->
    <SolidColorBrush x:Key="{x:Static SystemColors.ControlDarkBrushKey}" Color="#FF999999" />
</Window.Resources>

不过这种方法有个局限:没法直接调整线条粗细,因为默认线条的厚度是控件模板里固定的。如果要改粗细,得用下面的方法。

方法2:自定义PropertyGridRow样式(精准控制)

这是我最常用的方法,直接给PropertyGridRow写自定义样式,既能改颜色,又能调粗细,还不会影响其他控件:

<xceed:PropertyGrid>
    <xceed:PropertyGrid.RowStyle>
        <Style TargetType="xceed:PropertyGridRow">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="xceed:PropertyGridRow">
                        <!-- 核心:修改底部Border的颜色和粗细 -->
                        <Border x:Name="rowBorder"
                                BorderThickness="0 0 0 1" <!-- 这里控制线条粗细,比如改成2就是2像素 -->
                                BorderBrush="#FF666666"   <!-- 这里设置线条颜色,选你需要的深色 -->
                                Background="{TemplateBinding Background}">
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="*"/>
                                </Grid.ColumnDefinitions>
                                <!-- 保留原有的标签和编辑器区域 -->
                                <xceed:PropertyItemLabel x:Name="propertyLabel"
                                                         Grid.Column="0"
                                                         Content="{Binding DisplayName}"
                                                         Margin="4"/>
                                <ContentPresenter x:Name="propertyEditor"
                                                 Grid.Column="1"
                                                 Content="{Binding Editor}"
                                                 Margin="4"/>
                            </Grid>
                        </Border>
                        <!-- 保留选中状态的触发器,按需调整 -->
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="rowBorder" Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/>
                                <Setter TargetName="propertyLabel" Property="Foreground" Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </xceed:PropertyGrid.RowStyle>
</xceed:PropertyGrid>

这里我把线条粗细设为1像素,颜色用了深灰色#FF666666,你可以根据自己的主题调整数值。如果要更粗的线条,直接把BorderThickness的最后一个值改成2或者3就行。

方法3:修改Xceed主题资源(适合用了官方主题的项目)

如果你项目里引用了Xceed的官方主题(比如Aero、Metro等),可以找到主题资源字典里的PropertyGridRow样式,直接修改其中的Border属性。不过这种方法需要你对主题资源结构有一定了解,适合需要统一主题风格的场景。

另外,如果你的PropertyGrid是分组显示的,分组的分隔线也可以用类似方法修改,只需要把目标类型换成PropertyGridGroup就行。

内容的提问来源于stack exchange,提问作者Osman

火山引擎 最新活动