Невозможно установить свойство другого элемента с помощью EventTrigger в XAML

Question

У меня есть следующий код XAML, содержащий 3 кнопки. Цель состоит в том, чтобы изменить непрозрачность двух других кнопок, когда один из них нажат.

<Grid x:Name="MainToolbar"> 
    <Grid Grid.Row="0" Background="Red"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <Button x:Name="pinButton" HorizontalAlignment="Center" Grid.Column="0" Background="Red"> 
      <Button.Triggers> 
       <EventTrigger RoutedEvent="Button.Click"> 
        <BeginStoryboard> 
         <Storyboard> 
          <DoubleAnimationUsingKeyFrames Storyboard.TargetName="newsButton" Storyboard.TargetProperty="Opacity"> 
           <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.5"/> 
          </DoubleAnimationUsingKeyFrames> 
          <DoubleAnimationUsingKeyFrames Storyboard.TargetName="weatherButton" Storyboard.TargetProperty="Opacity"> 
           <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.5"/> 
          </DoubleAnimationUsingKeyFrames> 
         </Storyboard> 
        </BeginStoryboard> 
       </EventTrigger> 
      </Button.Triggers> 
      <Button.Template> 
       <ControlTemplate> 
        <Image Source="/Assets/Top-Pin-Icon-60px.png" Stretch="None"/> 
       </ControlTemplate> 
      </Button.Template> 
     </Button> 
     <Button x:Name="newsButton" HorizontalAlignment="Center" Grid.Column="1" Background="Red"> 
      <Image Source="/Assets/Top-News-Icon-60px.png" Stretch="None"/> 
     </Button> 
     <Button x:Name="weatherButton" HorizontalAlignment="Center" Grid.Column="2" Background="Red"> 
      <Image Source="/Assets/Top-Weather-Icon-60px.png" Stretch="None"/> 
     </Button> 
    </Grid> 
</Grid> 

Я думаю, что использование EventTrigger будет решение для этого типа требования, но я получил сообщение об ошибке: Не удалось присвоить свойству «Windows.UI.Xaml.EventTrigger.RoutedEvent» на линии, которая устанавливает RoutedEvent. Я проверил, и я уверен, что значение должно быть «Button.Click».

Это универсальное приложение для Windows, поэтому я не уверен, что это изменит ситуацию. Есть ли другой способ? Или это решение? Код указан в UserControl.

UPDATE:

После некоторых исследований, это выглядит как лучшее решение заключается в использовании визуального государства, поэтому я решил попробовать следующее.

<UserControl 
x:Class="Innobec.Mobile.Apps.CityScope.UserControls.TopHorizontalToolBar" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:Innobec.Mobile.Apps.CityScope.UserControls" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" 
d:DesignHeight="80" 
d:DesignWidth="400"> 

<VisualStateManager.VisualStateGroups> 
    <VisualStateGroup x:Name="ActiveButtonStates"> 
     <VisualState x:Name="PinActiveState"> 
      <Storyboard> 
       <DoubleAnimation Storyboard.TargetName="newsButton" Storyboard.TargetProperty="Opacity" From="1" To="0.5" Duration="0:0:2"/> 
       <DoubleAnimation Storyboard.TargetName="weatherButton" Storyboard.TargetProperty="Opacity" From="1" To="0.5" Duration="0:0:2"/> 
      </Storyboard> 
     </VisualState> 
     <VisualState x:Name="NewsActiveState"> 
      <Storyboard> 
       <DoubleAnimation Storyboard.TargetName="pinButton" Storyboard.TargetProperty="Opacity" From="1" To="0.5" Duration="0:0:2"/> 
       <DoubleAnimation Storyboard.TargetName="weatherButton" Storyboard.TargetProperty="Opacity" From="1" To="0.5" Duration="0:0:2"/> 
      </Storyboard> 
     </VisualState> 
     <VisualState x:Name="WeatherActiveState"> 
      <Storyboard> 
       <DoubleAnimation Storyboard.TargetName="pinButton" Storyboard.TargetProperty="Opacity" From="1" To="0.5" Duration="0:0:2"/> 
       <DoubleAnimation Storyboard.TargetName="newsButton" Storyboard.TargetProperty="Opacity" From="1" To="0.5" Duration="0:0:2"/> 
      </Storyboard> 
     </VisualState> 
    </VisualStateGroup> 
</VisualStateManager.VisualStateGroups> 
<Grid x:Name="MainToolbar"> 
    <Grid Grid.Row="0" Background="Red"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 

     <Button x:Name="pinButton" HorizontalAlignment="Center" Grid.Column="0" Background="Red" Click="pinButton_Click"> 
      <Image Source="/Assets/Top-Pin-Icon-60px.png" Stretch="None"/> 
     </Button> 
     <Button x:Name="newsButton" HorizontalAlignment="Center" Grid.Column="1" Background="Red"> 
      <Image Source="/Assets/Top-News-Icon-60px.png" Stretch="None"/> 
     </Button> 
     <Button x:Name="weatherButton" HorizontalAlignment="Center" Grid.Column="2" Background="Red"> 
      <Image Source="/Assets/Top-Weather-Icon-60px.png" Stretch="None"/> 
     </Button> 
    </Grid> 
</Grid> 

Однако, ничего не происходит, когда я делаю вызов на следующую строку в код-позади, так что я делаю неправильно в настоящее время ?:

VisualStateManager.GoToState(this, "PinActiveState", false); 

Answer 1

Я не уверен, если это эквивалентно тому, что вы пытаетесь выполнить, но, вытащив раскадровку из кнопки, вы можете использовать поведение sdk для запуска его с событием, вот код:

<UserControl.Resources> 
    <Storyboard x:Name="NewsButtonStoryBoard"> 
     <DoubleAnimationUsingKeyFrames Storyboard.TargetName="newsButton" Storyboard.TargetProperty="Opacity"> 
      <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.5"/> 
     </DoubleAnimationUsingKeyFrames> 
     <DoubleAnimationUsingKeyFrames Storyboard.TargetName="weatherButton" Storyboard.TargetProperty="Opacity"> 
      <DiscreteDoubleKeyFrame KeyTime="0:0:0" Value="0.5"/> 
     </DoubleAnimationUsingKeyFrames> 
     <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Control.FontFamily)" Storyboard.TargetName="userControl"> 
      <DiscreteObjectKeyFrame KeyTime="0"> 
       <DiscreteObjectKeyFrame.Value> 
        <FontFamily>Global User Interface</FontFamily> 
       </DiscreteObjectKeyFrame.Value> 
      </DiscreteObjectKeyFrame> 
     </ObjectAnimationUsingKeyFrames> 
    </Storyboard> 
</UserControl.Resources> 

<Grid x:Name="MainToolbar"> 
    <Grid Grid.Row="0" Background="Red"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
      <ColumnDefinition /> 
     </Grid.ColumnDefinitions> 
     <Button x:Name="pinButton" HorizontalAlignment="Center" Grid.Column="0" Background="Red"> 
      Button One 
      <Interactivity:Interaction.Behaviors> 
       <Core:EventTriggerBehavior EventName="Click"> 
        <Media:ControlStoryboardAction Storyboard="{StaticResource NewsButtonStoryBoard}"/> 
       </Core:EventTriggerBehavior> 
      </Interactivity:Interaction.Behaviors> 
     </Button> 
     <Button x:Name="newsButton" HorizontalAlignment="Center" Grid.Column="1" Background="Red"> 
      Button Two 
     </Button> 
     <Button x:Name="weatherButton" HorizontalAlignment="Center" Grid.Column="2" Background="Red"> 
      Button Three 
     </Button> 
    </Grid> 
</Grid> 

забудьте добавить ссылку и Xmlns Поведения SDK для управления:

xmlns:Interactivity="using:Microsoft.Xaml.Interactivity" xmlns:Core="using:Microsoft.Xaml.Interactions.Core" 

Я просто проверял это в пустом проекте (в пользовательском элементе управления) и нажав на первую кнопку тускнеет два других (I» Думаю, это то, что вы пытаетесь сделать). Я изменил содержимое кнопок, так как у меня нет ваших изображений, но, надеюсь, вы получите эту идею, и она вам полезна.