Silverlight - 按鈕不會改變顏色

Question

我想要有以下行爲 - 當用戶將鼠標移到按鈕上時，按鈕中的文本會改變顏色。我創建以下樣式+模板：

<Style TargetType="blib:ButtonWithImage"> 
    <Setter Property="Background"> 
     <Setter.Value> 
      <ImageBrush ImageSource="images/buttonBackground.png"></ImageBrush> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="Width" Value="173"></Setter> 
    <Setter Property="Height" Value="40"></Setter> 
    <Setter Property="Foreground" Value="#FF000000"/> 
    <Setter Property="Padding" Value="0"/> 
    <Setter Property="BorderThickness" Value="0"/> 
    <Setter Property="BorderBrush"> 
     <Setter.Value> 
      <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
       <GradientStop Color="#FFA3AEB9" Offset="0"/> 
       <GradientStop Color="#FF8399A9" Offset="0.375"/> 
       <GradientStop Color="#FF718597" Offset="0.375"/> 
       <GradientStop Color="#FF617584" Offset="1"/> 
      </LinearGradientBrush> 
     </Setter.Value> 
    </Setter> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="blib:ButtonWithImage"> 
       <Border x:Name="Background" CornerRadius="0" Background="Transparent" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}"> 
        <Grid Background="{TemplateBinding Background}"> 
         <vsm:VisualStateManager.VisualStateGroups> 
          <vsm:VisualStateGroup x:Name="CommonStates"> 
           <vsm:VisualState x:Name="Normal"/> 
           <vsm:VisualState x:Name="MouseOver"> 
            <Storyboard> 
             <ColorAnimation Duration="0" Storyboard.TargetName="Text" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" To="#D8FFFFFF"></ColorAnimation> 
            </Storyboard> 
           </vsm:VisualState> 
           <vsm:VisualState x:Name="Pressed"> 
            <Storyboard> 
             <ColorAnimation Duration="0" Storyboard.TargetName="Text" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" To="#D8FFFFFF"></ColorAnimation> 
            </Storyboard> 
           </vsm:VisualState> 
           <vsm:VisualState x:Name="Disabled"> 
            <Storyboard> 
             <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledVisualElement" Storyboard.TargetProperty="Opacity" To=".55"/> 
            </Storyboard> 
           </vsm:VisualState> 
          </vsm:VisualStateGroup> 
          <vsm:VisualStateGroup x:Name="FocusStates"> 
           <vsm:VisualState x:Name="Focused"> 
            <Storyboard> 
             <DoubleAnimation Duration="0" Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="Opacity" To="1"/> 
            </Storyboard> 
           </vsm:VisualState> 
           <vsm:VisualState x:Name="Unfocused" /> 
          </vsm:VisualStateGroup> 
         </vsm:VisualStateManager.VisualStateGroups> 
         <StackPanel Height="Auto" Orientation="Horizontal" Margin="10,3,10,3"> 
          <Image Source="{TemplateBinding ImageSource}" Width="24" Height="24" Stretch="Fill"/> 
          <TextBlock x:Name="Text" Text="{TemplateBinding Content}" HorizontalAlignment="Left" FontWeight="Bold" Margin="5,0,0,0" VerticalAlignment="Center" FontSize="12" FontFamily="Arial" Foreground="#FFFFF6BB" /> 
         </StackPanel> 
        </Grid> 
       </Border> 

      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

但它不起作用。爲什麼？

Answer 1

VisualStateManager.VisualStateGroups屬性應附加到模板中的根元素，在本例中爲Border，名稱爲「Background」。目前你在邊界內的Grid上，但VisualStateManager不會找到它。

另外你的ButtonWithImage類必須來自Button（除非你有你自己的代碼來調用GoToState），但我懷疑你已經有了。