WPF路径几何样式的不同颜色

Question

我使用路径几何组来构建一个几何形状，该几何形状替换WPF中的按钮：

<UserControl.Resources>
    <ControlTemplate x:Key="bT" TargetType="Button">
        <Path StrokeThickness="1.5" >
            <Path.Data>
                <GeometryGroup>
                    <EllipseGeometry Center="7,7" RadiusX="7" RadiusY="7" />
                    <LineGeometry StartPoint="4,4" EndPoint="10,10" />
                    <LineGeometry StartPoint="10,4" EndPoint="4,10" />
                </GeometryGroup>
            </Path.Data>
            <Path.Style>
                <Style TargetType="{x:Type Path}">
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="False">
                            <Setter Property="Stroke" Value="LightGray" />
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Stroke" Value="Red" />
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </Path.Style>
        </Path>
    </ControlTemplate>
</UserControl.Resources>

按钮像

一样实现

<Button Template="{StaticResource ResourceKey=bT}" />

现在我的问题是我无法以不同的颜色样式。例如，我想要的椭圆地理测定法的行为比我的线域。有没有办法？

Answer 1

您可以在控制图上有几个命名路径，将IsMouseOver触发器移至ControlTemplate.Triggers并在设置器中使用TargetName。还请注意，ControlTemplate中的所有路径都有默认样式。

<ControlTemplate TargetType="Button" x:Key="bT">
    <ControlTemplate.Resources>
        <Style TargetType="Path">
            <Setter Property="Fill" Value="Transparent"/>
            <Setter Property="Stroke" Value="LightGray"/>
            <Setter Property="StrokeThickness" Value="1.5"/>
        </Style>
    </ControlTemplate.Resources>
    <Canvas>
        <Path x:Name="circle">
            <Path.Data>
                <EllipseGeometry Center="7,7" RadiusX="7" RadiusY="7"/>
            </Path.Data>
        </Path>
        <Path x:Name="cross">
            <Path.Data>
                <GeometryGroup>
                    <LineGeometry StartPoint="4,4" EndPoint="10,10"/>
                    <LineGeometry StartPoint="10,4" EndPoint="4,10"/>
                </GeometryGroup>
            </Path.Data>
        </Path>
    </Canvas>
    <ControlTemplate.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter TargetName="circle" Property="Stroke" Value="Red"/>
            <Setter TargetName="cross" Property="Stroke" Value="Green"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

cross路径也可以使用路径标记语法简短编写：

<Path x:Name="cross" Data="M4,4 L10,10 M4,10 L10,4"/>