WPF - 觸發改變前景和多個按鈕的對象

我試圖做一個RoutedEvent激活ColorAnimation在TextBlock的背景和Panel內Buttons。我的目標是在使用MouseEnter和MouseLeave RoutedEvents時更改TextBlock的前景和麪板的背景。WPF - 觸發改變前景和多個按鈕的對象

下面的代碼實際上工作。但是，只有當鼠標光標在這兩個對象之一上時纔有效（這是有道理的）。

我想不出我應該怎麼做才能激活兩個ColorAnimations當鼠標移動到按鈕（特別是如果它不是在Panel或TextBlock）

這裏是一個實例的按鈕看起來像正常：

這是如何按鈕看起來像當我專注ŧ他Panel：

這是Button的樣子，當我專注自己（的按鈕背景具有的顏色與面板的背景與文本塊的前景一樣）

而且這是按鈕應該看起來像當鼠標在按鈕上時的樣子

<UserControl.Resources> 
<Style x:Key="Path" TargetType="Path"> 
    <Style.Triggers> 
     <EventTrigger RoutedEvent="MouseEnter"> 
      <BeginStoryboard> 
       <Storyboard> 
        <ColorAnimation Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" To="White" Duration="0:0:1"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
     <EventTrigger RoutedEvent="MouseLeave"> 
      <BeginStoryboard> 
       <Storyboard> 
        <ColorAnimation Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" To="Gray" Duration="0:0:1"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Style.Triggers> 
</Style> 
<Style x:Key="TextBlock" TargetType="TextBlock"> 
    <Style.Triggers> 
     <EventTrigger RoutedEvent="MouseEnter"> 
      <BeginStoryboard> 
       <Storyboard> 
        <ColorAnimation Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" To="White" Duration="0:0:1"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
     <EventTrigger RoutedEvent="MouseLeave"> 
      <BeginStoryboard> 
       <Storyboard> 
        <ColorAnimation Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" To="Gray" Duration="0:0:1"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Style.Triggers> 
</Style> 
</UserControl.Resources> 

<Button Name="btnTest" 
     BorderThickness="0" 
     Width="200" 
     Height="200" 
     Margin="5,5,0,0" 
     VerticalAlignment="Top" 
     > 
    <Button.Triggers> 
     <EventTrigger RoutedEvent="MouseEnter"> 
      <BeginStoryboard> 
       <Storyboard> 
        <ColorAnimation Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" To="Gray"/> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Button.Triggers> 
    <StackPanel> 
     <Path Style="{StaticResource Path}" Fill="Gray" 
       Stretch="Fill" Width="98.851" Height="94.776" 
       Data="M819.2,0H204.8C92,0,0,92.2,0,204.8v614.4C0,931.8,92,1024,204.8,1024h614.4c112.6,0,204.8-92.2,204.8-204.8V204.8 C1024,92.2,931.8,0,819.2,0z M879,337.8l-15.8,93L774.6,463.6L702,403.4l15.8-93.2l88.4-33L879,337.8z M786.2,594.8 c-61.601,22.8-129,7-180-35.399L217.8,831.2L128,702.8L528,423c-16.8-95.2,28.6-188.4,112.8-219.6c56.2-20.8,117.2-9.6,166.2,25 l-136,50.4L646.6,424L760,518l136-50.4C881.2,525.6,842.4,574,786.2,594.8z" 
       /> 
     <TextBlock Style="{StaticResource TextBlock}" Margin="0,20,0,0" FontSize="15" FontWeight="Bold" Foreground="Gray" HorizontalAlignment="Center"> 
     TEST 
     </TextBlock> 
    </StackPanel> 
</Button>

編輯1 我測試艾哈邁德的代碼，並將其部分工作。當我的光標位於Button時，DataTrigger有效。但是，當我離開它（IsMouseOver = FALSE）的Path填寫和TextBlock前景沒有變回： OBS：我不得不添加DataTrigger.EnterActions避免以下錯誤信息：

類型'BeginStoryBoard'的值不能添加到'SetterBaseCollection'類型的集合或字典中。

<UserControl.Resources> 
    <Style x:Key="Path" TargetType="Path"> 
     <Style.Triggers> 
      <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Button},Path=IsMouseOver}" Value="True"> 
       <DataTrigger.EnterActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" To="White" Duration="0:0:1"/> 
         </Storyboard> 
        </BeginStoryboard> 
       </DataTrigger.EnterActions> 
      </DataTrigger> 
      <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Button},Path=IsMouseOver}" Value="False"> 
       <DataTrigger.EnterActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" To="Gray" Duration="0:0:1"/> 
         </Storyboard> 
        </BeginStoryboard> 
       </DataTrigger.EnterActions> 
      </DataTrigger> 
     </Style.Triggers> 
    </Style> 
    <Style x:Key="TextBlock" TargetType="TextBlock"> 
     <Style.Triggers> 
      <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Button},Path=IsMouseOver}" Value="True"> 
       <DataTrigger.EnterActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" To="White" Duration="0:0:1"/> 
         </Storyboard> 
        </BeginStoryboard> 
       </DataTrigger.EnterActions> 
      </DataTrigger> 
      <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Button},Path=IsMouseOver}" Value="False"> 
       <DataTrigger.EnterActions> 
        <BeginStoryboard> 
         <Storyboard> 
          <ColorAnimation Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" To="Gray" Duration="0:0:1"/> 
         </Storyboard> 
        </BeginStoryboard> 
       </DataTrigger.EnterActions> 
      </DataTrigger> 
     </Style.Triggers> 
    </Style> 
</UserControl.Resources>

來源

2015-12-09 Murilo lima alves

艾哈邁德初始代碼，我做了一些研究，我發現EnterActions和ExitActions性能。使用單一DataTrigger，我可以定義我的動畫時IsMouseOver是真

<Style x:Key="Path" TargetType="Path"> 
    <Style.Triggers> 
     <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Button},Path=IsMouseOver}" Value="True"> 
      <DataTrigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <ColorAnimation Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" To="White" Duration="0:0:1"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </DataTrigger.EnterActions> 
      <DataTrigger.ExitActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <ColorAnimation Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" To="Gray" Duration="0:0:1"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </DataTrigger.ExitActions> 
     </DataTrigger> 
    </Style.Triggers> 
</Style>

來源

2015-12-10 11:54:50

相反EventTrigger的添加DataTrigger結合到文/面板UI元素祖先

<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Button},Path=IsMouseOver}" Value="True"> 
    <BeginStoryboard> 
     <Storyboard> 
       <ColorAnimation Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" To="Gray" Duration="0:0:1"/> 
     </Storyboard> 
    </BeginStoryboard> 
</DataTrigger> 

other triggers for IsMouseOver being false ...

你兩個專家組或TextBlock的做到這一點，只需刪除按鈕觸發當鼠標位於按鈕上方時，它將觸發並顯示文字/面板故事板。

來源

2015-12-09 19:32:53 Ahmad

您好艾哈邁德！感謝您的回答 –

我編輯了我的帖子，與艾哈邁德的建議分享了代碼結果，但沒有像我期望的那樣工作。 –

你可以強調什麼沒有按預期工作！ – Ahmad

WPF - 觸發改變前景和多個按鈕的對象

回答

相關問題