Question

我想要做的是打开/关闭togglebutton，因为我使用图像作为资源我的主要想法是将一个图像作为正常ON状态，另一个图像作为鼠标悬停ON，第三个图像作为按下ON状态。 OFF状态也是如此，所有这一切都在一个按钮中。我使用普通按钮完全一样，但在这里我遇到了一些我不知道的事情：在xaml中使用所有触发器执行IF条件，我不知道从哪里开始。我读过一些关于多重触发器的内容，但这看起来很复杂 - 这样做更容易吗？这就是我到目前为止所做的。

 <ToggleButton IsChecked="False" Height="70" Width="70" >
        <ToggleButton.Background>
            <ImageBrush ImageSource="Resources\off_button_1.png" Stretch="None" />
        </ToggleButton.Background>
        <ToggleButton.Style>
            <Style TargetType="{x:Type ToggleButton}" >
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ToggleButton}" >
                            <StackPanel Orientation="Horizontal">
                                <Image x:Name="image" Source="Resources\off_button_1.png" Margin="0" Stretch="None" />

                            </StackPanel>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsMouseOver" Value="true">
                                    <Setter TargetName="image" Property="Source" Value="Resources/off_button_1_hover.png" />

                                </Trigger>
                                <Trigger Property="IsPressed" Value="true">
                                    <Setter TargetName="image" Property="Source" Value="Resources/off_button_1_pressed.png" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ToggleButton.Style>
    </ToggleButton>

我真的在这里使用了一些帮助，提前谢谢你。

Answer 1

您可以创建自定义按钮。

public class ImageButton : Button
{
    static ImageButton()
    { 
        DefaultStyleKeyProperty.OverrideMetadata(typeof(ImageButton), new FrameworkPropertyMetadata(typeof(ImageButton)));
    }


    public ImageSource NormalImage
    {
        get { return (ImageSource)GetValue(NormalImageProperty); }
        set { SetValue(NormalImageProperty, value); }
    }

    public ImageSource HoverImage
    {
        get { return (ImageSource)GetValue(HoverImageProperty); }
        set { SetValue(HoverImageProperty, value); }
    }

    public ImageSource PressedImage
    {
        get { return (ImageSource)GetValue(PressedImageProperty); }
        set { SetValue(PressedImageProperty, value); }
    }

 public static readonly DependencyProperty NormalImageProperty =
      DependencyProperty.Register(
          "NormalImage", typeof(ImageSource), typeof(ImageButton));

    public static readonly DependencyProperty HoverImageProperty =
        DependencyProperty.Register(
            "HoverImage", typeof(ImageSource), typeof(ImageButton));        

    public static readonly DependencyProperty PressedImageProperty =
        DependencyProperty.Register(
            "PressedImage", typeof(ImageSource), typeof(ImageButton));

}

这是XAML ControlTemplate

<Style TargetType="{x:Type local:ImageButton}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:ImageButton}">
                <Border Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}">
                    <Image x:Name="PART_Image" Source="{Binding NormalImage, RelativeSource={RelativeSource TemplatedParent}}"/>
                </Border>

                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Source" Value="{Binding HoverImage, RelativeSource={RelativeSource TemplatedParent}}" TargetName="PART_Image"/>
                    </Trigger>
                    <Trigger Property="IsPressed" Value="True">
                        <Setter Property="Source" Value="{Binding PressedImage, RelativeSource={RelativeSource TemplatedParent}}" TargetName="PART_Image"/>
                    </Trigger>                                          
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Togglebutton具有悬停/按下状态

1 个答案: