Анимация состояния в ListBox ItemTemplate

Question

У меня есть список, который читает из коллекции Observable, и ItemTemplate'ed:

<DataTemplate x:Key="DataTemplate1">
    <Grid x:Name="grid" Height="47.333" Width="577" Opacity="0.495">
        <Image HorizontalAlignment="Left" Margin="10.668,8,0,8" Width="34" Source="{Binding ImageLocation}"/>
        <TextBlock Margin="56,8,172.334,8" TextWrapping="Wrap" Text="{Binding ApplicationName}" FontSize="21.333"/>
        <Grid x:Name="grid1" HorizontalAlignment="Right" Margin="0,10.003,-0.009,11.33" Width="26" Opacity="0" RenderTransformOrigin="0.5,0.5">
            <Image HorizontalAlignment="Stretch" Margin="0" Source="image/downloads.png" Stretch="Fill" MouseDown="Image_MouseDown" />
        </Grid>
    </Grid>
</DataTemplate>

<ListBox x:Name="searchlist" Margin="8" ItemTemplate="{DynamicResource DataTemplate1}" ItemsSource="{Binding SearchResults}" SelectionChanged="searchlist_SelectionChanged" ItemContainerStyle="{DynamicResource ListBoxItemStyle1}" />

В общем, мой вопрос: «Как проще всего сделать анимацию для отдельных элементов в этом списке, какони выбраны? В основном, изображение внутри "grid1" будет медленно устанавливать свою непрозрачность на 1.

Я бы предпочел использовать состояния, но я не знаю ни одного способа просто сказать blend и xaml:«Когда выбранный элемент изменяется, измените непрозрачность изображения на 1 в течение 0,3 секунды». Фактически, я делал это в файле .cs с помощью VisualStateManager.

Кроме того, есть еще одинКогда выбранный индекс изменяется, мы переходим в файл CS и смотрим на SelectedItem. SelectedItem возвращает экземпляр объекта, с которым он был связан (объект внутри наблюдаемой коллекции), а НЕ экземпляр DataTemplate / ListItemи т.д. Итак, как я могу извлечь правильное изображение из этого списка?

Состояние анимации с помощью VisualStateManager I cотлично справляется, если это просто нормальные вещи, но когда дело доходит до элементов сгенерированных списков, я теряюсь.

Спасибо

Answer 1

На это можно ответить через этот пост: Состояния WPF / Silverlight - активировать из XAML?

Особая благодарность: Dan Auclair

Answer 2

Я указал анимацию в шаблонах элементов списка, используя вместо этого раскадровку на панели стека, если используется сетка.

<StackPanel Grid.Row="0" Height="175" Orientation="Vertical" Width="Auto">

  <StackPanel.Triggers>
    <EventTrigger RoutedEvent="StackPanel.Loaded">
      <EventTrigger.Actions>
        <BeginStoryboard>
          <Storyboard x:Name="mystoryboard">

            <DoubleAnimationUsingKeyFrames
            Storyboard.TargetName="Trans"
            Storyboard.TargetProperty="X">
              <LinearDoubleKeyFrame Value="-387" KeyTime="0:0:1" />
            </DoubleAnimationUsingKeyFrames>
          </Storyboard>

        </BeginStoryboard>
      </EventTrigger.Actions>
    </EventTrigger>
  </StackPanel.Triggers>

  <TextBlock Margin="400,40,-400,0" TextWrapping="Wrap" Text="{Binding ApplicationName}" FontSize="21.333">
    <TextBlock.RenderTransform>
      <TranslateTransform x:Name="Trans" X="0" Y="0" />
    </TextBlock.RenderTransform>
  </TextBlock>
</StackPanel>

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