wpf – 如何修复带圆角的按钮中边框和背景之间的空白区域?

前端之家收集整理的这篇文章主要介绍了wpf – 如何修复带圆角的按钮中边框和背景之间的空白区域?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我为我的 WPF应用程序创建了一个简单的按钮模板:
<Style x:Key="DialogButton" TargetType="{x:Type Button}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border Name="buttonBorder" CornerRadius="8" BorderThickness="2" BorderBrush="{TemplateBinding Background}" Background="{TemplateBinding Background}" MaxHeight="30" MinWidth="70" Margin="0,8,8">
                    <Grid>
                        <TextBlock Text="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                    </Grid>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouSEOver" Value="true">
                        <Setter TargetName="buttonBorder" Property="BorderBrush" Value="{DynamicResource WindowBackColor}"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

但正如您在下面的屏幕截图中看到的那样,按钮在角落中有一个小的空白区域:

这是按钮的放大部分:

我怎样才能解决这个问题?

谢谢!

WPF默认情况下使用抗锯齿渲染元素,这可能会导致形状之间的间隙很小.

在边框上将EdgeMode设置为别名,这应该摆脱小差距

RenderOptions.EdgeMode="Aliased"

例:

<Style TargetType="{x:Type Button}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type Button}">
                    <Border RenderOptions.EdgeMode="Aliased" Name="buttonBorder" CornerRadius="8" BorderThickness="2" BorderBrush="{TemplateBinding Background}" Background="{TemplateBinding Background}" MaxHeight="30" MinWidth="70" Margin="0,8">
                        <Grid>
                            <TextBlock Text="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                        </Grid>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouSEOver" Value="true">
                            <Setter TargetName="buttonBorder" Property="BorderBrush" Value="{DynamicResource WindowBackColor}"/>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

结果:

之前(抗锯齿):之后(别名):

选项2:

另一个简单的选项是将样式中的网格更改为边框并将背景和CornerRadius设置为相同但将边距设置为-1,这将导致比使用别名更平滑的外观并消除小间隙

例:

<Border Name="buttonBorder" CornerRadius="8" BorderThickness="2" BorderBrush="{TemplateBinding Background}" MaxHeight="30" MinWidth="70" Margin="0,8">
    <Border CornerRadius="8" Margin="-1" Background="{TemplateBinding Background}" >
        <TextBlock Text="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
    </Border>
</Border>
原文链接:https://www.f2er.com/windows/365339.html

猜你在找的Windows相关文章