Question

我想知道是否可以执行以下操作：

创建一个黑白图像，比如一只狗
将图像添加到按钮作为遮罩
使用（数据）触发器更改样式，例如残疾人 - 狗是灰色的，“装载” - 狗是红色的，“准备好”狗是黄色等等。

基本上我想使用像素创建按钮图标，但能够根据触发器在运行时设置颜色。像这样：

dog buttons

Answer 1

经过2小时的谷歌搜索后，这是答案

<Window x:Class="IconTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <!-- button style -->
        <Style x:Key="ToolButton" TargetType="Button">
            <Setter Property="OverridesDefaultStyle" Value="True"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Border Width="16" Height="16" Background="#ffbbbbbb">
                            <Rectangle Name="rect" Fill="Black" OpacityMask="{TemplateBinding Content}"/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter TargetName="rect" Property="Fill" Value="Green" />
                            </Trigger>
                            <Trigger Property="IsPressed" Value="True">
                                <Setter TargetName="rect" Property="Fill" Value="Yellow" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Window.Resources>
    <Grid>
        <Button Width="16" Height="16" Style="{StaticResource ToolButton}">
            <ImageBrush ImageSource="/test.png"/>
        </Button>
    </Grid>
</Window>

Answer 2

您可以为OpacityMask定义Button。我相信您可以添加触发器（如果需要）来更改Button的Background。

enter image description here

<强>示例：

<Button Height="100" Width="100" Background="Green">
    <Button.OpacityMask>
    <DrawingBrush AlignmentX="Left" AlignmentY="Top">
        <DrawingBrush.Drawing>
        <DrawingGroup>
            <GeometryDrawing Brush="#33000000">
            <GeometryDrawing.Geometry>
                <RectangleGeometry Rect="0,0,40,40" />
            </GeometryDrawing.Geometry>
            </GeometryDrawing>
            <GeometryDrawing Brush="#FF000000">
            <GeometryDrawing.Geometry>
                <RectangleGeometry Rect="10,10,20,20">
                <RectangleGeometry.Transform>
                    <RotateTransform Angle="45" CenterX="20" CenterY="20" />
                </RectangleGeometry.Transform>
                </RectangleGeometry>
            </GeometryDrawing.Geometry>
            </GeometryDrawing>
        </DrawingGroup>
        </DrawingBrush.Drawing>
    </DrawingBrush>
    </Button.OpacityMask>
</Button>

Answer 3

在我看来，您不需要在WPF中创建图像掩码来满足您的要求。您只需编辑按钮类的控件模板即可。

请参阅此页面中的椭圆按钮示例。 Control Template

然后您可以使用触发器简单地更改该形状的填充颜色。 Trigger

干杯，

使用图像作为WPF按钮图标掩码？

3 个答案: