我正在开发一个MUI风格的WPF应用程序。我正在使用像例如http://modernuiicons.com这样的图标。
现在,如果我使用以下代码:
<Button x:Name="_ButtonSearch" Background="White" Grid.Column="3" Margin="20,20,20,20" Click="_ButtonSearch_Click" >
<Button.OpacityMask>
<VisualBrush Visual="{StaticResource appbar_magnify}" Stretch="Uniform"/>
</Button.OpacityMask>
</Button>
使用&#34; appbar_magnify&#34;的以下XAML:
<Canvas x:Key="appbar_magnify" Width="76" Height="76" Clip="F1 M 0,0L 76,0L 76,76L 0,76L 0,0">
<Path Width="33.1464" Height="33.1465" Canvas.Left="21.8536" Canvas.Top="22" Stretch="Fill" Fill="{DynamicResource BlackBrush}" Data="F1 M 42.5,22C 49.4036,22 55,27.5964 55,34.5C 55,41.4036 49.4036,47 42.5,47C 40.1356,47 37.9245,46.3435 36,45.2426L 26.9749,54.2678C 25.8033,55.4393 23.9038,55.4393 22.7322,54.2678C 21.5607,53.0962 21.5607,51.1967 22.7322,50.0251L 31.7971,40.961C 30.6565,39.0755 30,36.8644 30,34.5C 30,27.5964 35.5964,22 42.5,22 Z M 42.5,26C 37.8056,26 34,29.8056 34,34.5C 34,39.1944 37.8056,43 42.5,43C 47.1944,43 51,39.1944 51,34.5C 51,29.8056 47.1944,26 42.5,26 Z "/>
</Canvas>
我得到以下内容:
正如您在我绘制的突出显示方块中看到的那样,按钮会切割图标的一小部分。因此,当您单击程序中的按钮时,它将如下所示:
被切断的部分现在是黑色的。看起来不太好看。
所以我的问题是,我该如何改进这种情况?
问候
答案 0 :(得分:0)
我似乎找不到确切的原因。 这是由Button的模板中的ButtonChrome元素引起的。
您可以执行以下两项操作之一:
1)覆盖按钮模板。
<Geometry x:Key="magnifierGeometry">F1 M 42.5,22C 49.4036,22 55,27.5964 55,34.5C 55,41.4036 49.4036,47 42.5,47C 40.1356,47 37.9245,46.3435 36,45.2426L 26.9749,54.2678C 25.8033,55.4393 23.9038,55.4393 22.7322,54.2678C 21.5607,53.0962 21.5607,51.1967 22.7322,50.0251L 31.7971,40.961C 30.6565,39.0755 30,36.8644 30,34.5C 30,27.5964 35.5964,22 42.5,22 Z M 42.5,26C 37.8056,26 34,29.8056 34,34.5C 34,39.1944 37.8056,43 42.5,43C 47.1944,43 51,39.1944 51,34.5C 51,29.8056 47.1944,26 42.5,26 Z </Geometry>
<ControlTemplate TargetType="{x:Type Button}">
<Path Stretch="Uniform" Data="{StaticResource magnifierGeometry}" Fill="{TemplateBinding Foreground}"/>
</ControlTemplate>
2)使用视口定义填充它。
注意更清晰的方法来创建不透明蒙版。
<Button Margin="20,20,20,20" BorderThickness="0">
<Button.OpacityMask>
<DrawingBrush Stretch="Uniform" Viewport="0.05,0.05,0.9,0.9" >
<DrawingBrush.Drawing>
<DrawingGroup>
<DrawingGroup.Children>
<GeometryDrawing Brush="Blue" Geometry="{StaticResource magnifierGeometry}" />
</DrawingGroup.Children>
</DrawingGroup>
</DrawingBrush.Drawing>
</DrawingBrush>
</Button.OpacityMask>
</Button>