使用不同懸停狀態的按鈕資源

Question

我使用xaml中的spritesheet通過重新定位按鈕的translateX和translateY值來創建按鈕。

我想要做的是更改translateX和translateY值的狀態變化，我敢肯定這是可能的xaml，但在混合下它可以讓我改變這些x和y值，因爲它說他們是計算值（我不希望這些值補間，只是在懸停時更改）

下面是當前單個狀態按鈕的示例。

 <Button Content="test" HorizontalAlignment="Center" Height="57" VerticalAlignment="Center" Width="294" d:LayoutOverrides="VerticalAlignment"> 
      <Button.Resources> 
       <Style x:Key="ButtonStyle1" TargetType="Button"> 
        <Setter Property="Template"> 
         <Setter.Value> 
          <ControlTemplate TargetType="Button"> 
           <Grid> 
            <Rectangle x:Name="R" Opacity="1" StrokeThickness="0" Visibility="Visible"> 
             <Rectangle.Fill> 
              <ImageBrush ImageSource="/Project;component/wp7_buttons.png" Stretch="None" AlignmentX="Left" AlignmentY="Top" > 
               <ImageBrush.Transform> 
                <CompositeTransform TranslateX="-558" TranslateY="0"/> 
               </ImageBrush.Transform> 
              </ImageBrush> 
             </Rectangle.Fill> 
            </Rectangle> 
            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
           </Grid> 
          </ControlTemplate> 
         </Setter.Value> 
        </Setter> 
       </Style> 
      </Button.Resources> 
      <Button.Style> 
       <StaticResource ResourceKey="ButtonStyle1"/> 
      </Button.Style> 
     </Button> 

我該怎麼做？我需要能夠將每個狀態綁定到包含x和y翻譯值以及ImageSource的屬性。

Answer 1

你有VisualStates工作就像在混合下面

您CAND編輯按鈕模板拷貝，你會看到它的所有VisualStates。

，所以你只需要改變Storyboard.TargetName和Storyboard.TargetProperty，以配合您的圖像刷CompositeTransform :)

<ControlTemplate TargetType="Button"> 
    <Grid x:Name="Root"> 
     <VisualStateManager.VisualStateGroups> 
      <VisualStateGroup x:Name="CommonStates"> 
       <VisualStateGroup.Transitions> 
        <VisualTransition GeneratedDuration="0:0:0.1" /> 
        <VisualTransition To="Pressed" /> 
        <VisualTransition From="Pressed" /> 
       </VisualStateGroup.Transitions> 
       <VisualState x:Name="Normal" /> 
       <VisualState x:Name="MouseOver"> 
        <Storyboard> 
         <DoubleAnimation Duration="0" Storyboard.TargetName="PressedElement" Storyboard.TargetProperty="(FrameworkElement.Opacity)" To="0" /> 
         <DoubleAnimation Duration="0" Storyboard.TargetName="MouseOverElement" Storyboard.TargetProperty="(FrameworkElement.Opacity)" To="1" /> 
        </Storyboard> 
       </VisualState> 
       <VisualState x:Name="Pressed"> 
        <Storyboard> 
         <DoubleAnimation Duration="0" Storyboard.TargetName="NormalElement" Storyboard.TargetProperty="(FrameworkElement.Opacity)" To="0.25" /> 
         <DoubleAnimation Duration="0" Storyboard.TargetName="PressedElement" Storyboard.TargetProperty="(FrameworkElement.Opacity)" To="1" />