2011-12-07 50 views
1

這是我爲「X」按鈕關閉製表符的完整樣式。 它的工作原理。但我對此並不滿意。如何更改StoryBoard中的路徑顏色?

如果你看看StoryBoard s你會注意到我洗牌2個不同的Path的可見性,以實現我的「X」改變顏色的效果。我寧願做顏色的變換,但好像我不能結合的Path

而且Stroke財產,我有TextBlock只是讓我的光標觸發MouseOver狀態了整個廣場。如果我只是離開Path - MouseOver只會觸發實際Path s顏色。任何方式使這部分更專業?

<Style x:Key="CloseTabButtonStyle" TargetType="Button"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="Button"> 
         <Grid> 
          <VisualStateManager.VisualStateGroups> 
           <VisualStateGroup x:Name="CommonStates"> 
            <VisualState x:Name="Normal"> 
             <Storyboard> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="NormalPath"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Visible</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="MouseOverPath"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Collapsed</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualState> 
            <VisualState x:Name="MouseOver"> 
             <Storyboard> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="MouseOverPath"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Visible</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
              <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="NormalPath"> 
               <DiscreteObjectKeyFrame KeyTime="0"> 
                <DiscreteObjectKeyFrame.Value> 
                 <Visibility>Collapsed</Visibility> 
                </DiscreteObjectKeyFrame.Value> 
               </DiscreteObjectKeyFrame> 
              </ObjectAnimationUsingKeyFrames> 
             </Storyboard> 
            </VisualState> 
           </VisualStateGroup> 
          </VisualStateManager.VisualStateGroups> 
          <TextBlock Width="8" Height="8"/> 
          <Path x:Name="MouseOverPath" Stroke="#67c5e0" StrokeThickness="2" Data="M0,0 L8,8 M8,0 L0,8 z" /> 
          <Path x:Name="NormalPath" Stroke="#9feaff" StrokeThickness="2" Data="M0,0 L8,8 M8,0 L0,8 z" /> 
         </Grid> 
        </ControlTemplate> 
       </Setter.Value> 
      </Setter> 
     </Style> 

回答

3

你必須深入刷級來改變筆觸顏色。這是一個簡單的動畫,顯示瞭如何。

<Storyboard x:Name="Storyboard1"> 
<ColorAnimationUsingKeyFrames 
     Storyboard.TargetProperty="(Shape.Stroke).(SolidColorBrush.Color)" 
     Storyboard.TargetName="path"> 
    <EasingColorKeyFrame KeyTime="0" Value="Black"/> 
      <EasingColorKeyFrame KeyTime="0:0:2.9" Value="Yellow"/> 
     </ColorAnimationUsingKeyFrames> 
    </Storyboard>