2013-07-15 166 views
0

我想要做的是開/關切換按鈕,因爲我使用圖像作爲資源,我的主要想法是將一個圖像作爲正常ON狀態,另一個用於鼠標懸停ON和第三個按下ON狀態。關閉狀態也是一樣,全部都在一個按鈕中。我用普通的按鈕完全一樣,但在這裏我遇到了一些我不知道的事情:在所有觸發器中執行xaml中的IF條件,我不知道哪裏可以啓動。我讀了一些關於multitriggers的內容,但這看起來很複雜 - 任何更簡單的方法來做到這一點? 這就是我迄今爲止所做的。懸停/按下狀態的按鈕

<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> 

我真的會在這裏使用一些幫助,提前謝謝。

回答

0

您可以創建一個自定義按鈕。

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>