我使用BorderThickness = 2制作了一个自定义复选框按钮。我想在选中边框时将其颜色更改为蓝色。
问题是边框和图标之间有很细的黑线,这使我很烦。有什么办法可以删除这个吗?
以下是我的按钮样式字典的部分代码。
<Style x:Key="ExampleButton" TargetType="{x:Type CheckBox}">
<Setter Property="Width" Value="40" />
<Setter Property="Height" Value="40" />
<Setter Property="Background" Value="{StaticResource BrushDarkGray11}" />
<Setter Property="BorderBrush" Value="{StaticResource BrushDarkGray11}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type CheckBox}">
<Border x:Name="Grid" Background="{TemplateBinding Background}"
CornerRadius="2" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="2">
<ContentPresenter x:Name="Content" Content="{TemplateBinding Content}"
HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="Grid" Property="BorderBrush" Value="{StaticResource BrushBlue1}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
这似乎是WPF渲染某种带有反走样边缘的边框的结果。
通过告诉WPF通过添加<Setter Property="SnapsToDevicePixels" Value="True" />
样式来渲染捕捉到屏幕像素的线条,我能够(大部分)在测试代码中摆脱了它(当我进行任何类型的桌面开发时,Window
无论如何我总是将其设置为认为它使WPF看起来更干净)。这看起来更好,但每个角上都有一个不同颜色的小像素,最有可能来自圆角。
接下来,我尝试嵌套边框,如下所示:
<ControlTemplate TargetType="{x:Type CheckBox}">
<Border
x:Name="Grid"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="2"
CornerRadius="2">
<Border Background="{TemplateBinding Background}">
<ContentPresenter
x:Name="Content"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="{TemplateBinding Content}" />
</Border>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="Grid" Property="BorderBrush" Value="{StaticResource BrushBlue1}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
这似乎已经为我完全解决了。
我只是注意到这掩盖了内角半径。我有点喜欢这种效果,但是,如果这对您的项目来说是个问题,则可以使用aGrid
覆盖边框,以便将四舍五入的边框放在顶部。确保四舍五入Border
具有透明效果Background
。您还需要Margin
将背景上的设置Border
为与相同的值BorderThickness
,否则该背景会通过Border
带有圆角的外角渗出。
<ControlTemplate TargetType="{x:Type CheckBox}">
<Grid>
<Border Margin="2" Background="{TemplateBinding Background}">
<ContentPresenter
x:Name="Content"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Content="{TemplateBinding Content}" />
</Border>
<Border
x:Name="Grid"
Background="Transparent"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="2"
CornerRadius="2" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="Grid"
Property="BorderBrush"
Value="{StaticResource BrushBlue1}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句