Изменение триггера события WPF Другой элемент пользовательского интерфейса

Question

Я определил ListBox в своем XAML, который использует ItemTemplate. Внутри ItemTemplate Я разместил изображение.

<ListBox.ItemTemplate> 
<ListBox.ItemsPanel> 
<ItemsPanelTemplate> 
    <WrapPanel x:Name="itmTempPanel" IsItemsHost="True" ItemWidth="60" ItemHeight="60" Width="{Binding ElementName=lstFilesDropped, Path=Width}"/> 
</ItemsPanelTemplate> 
</ListBox.ItemsPanel> 
... 
<Image> 
<Image.Triggers> 
    <EventTrigger RoutedEvent="MouseEnter"> 
    <BeginStoryboard> 
    <Storyboard> 
    <DoubleAnimation Storyboard.TargetProperty="Height" To="71" Duration="0:0:0.3" /> 
    <DoubleAnimation Storyboard.TargetName="itmTempPanel" Storyboard.TargetProperty="Height" To="71"  Duration="0:0:0.3" /> 
    </Storyboard> 
    </BeginStoryboard> 
    </EventTrigger> 
</Image.Triggers> 
</Image> 
</ListBox.ItemTemplate> 

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

Когда мышь вводит к этому изображению, я получил следующее исключение: Имя 'itmTempPanel' не может быть найдено в области имен 'System.Windows.Controls.Image'. "

Как я могу изменить другое свойство элемента из элемента, начинающего раскадровку.

Благодарим за помощь!

Answer 1

Есть 2 способа решить эту проблему. Первый использует {x:Reference} функцию .NET 4.0 для WPF. Вы должны следовать этому подходу, если ваше приложение нацелено на .NET 4.0. Идея устанавливает Storyboard.Target объекту, который вы хотите оживить (в данном случае это WrapPanel). Хотя мы можем использовать Binding для Storyboard.Target, но мы не можем использовать RelativeSource или ElementName, чтобы установить источник привязки, потому что Storyboard (или временная шкала) не является элементом FrameworkElement (или FrameworkContentElement). Единственный способ указать источник - установить свойство Source. Однако мы можем обычно установить это на StaticResource или DynamicResource или напрямую (используя синтаксис элемента). Хорошо, что {x:Reference} был представлен в .NET 4.0, и это может помочь вам ссылаться на любой именованный объект внутри XAML (так, как он работает, это не то, что ElementName). Вот код для первого подхода:

<DoubleAnimation Storyboard.Target="{Binding Source={x:Reference itmTempPanel}}" 
       Storyboard.TargetProperty="Height" 
       To="71" Duration="0:0:0.3" />  

Второй подход основан на DataTrigger. Однако этот триггер не для Image, это точно для WrapPanel. Но теперь ElementName можно использовать для привязки источника триггера к Image. Таким образом, этот подход можно использовать, если {x:Reference} не поддерживается.

<WrapPanel x:Name="itmTempPanel" IsItemsHost="True" ItemWidth="60" ItemHeight="60" 
      Width="{Binding ElementName=lstFilesDropped, Path=Width}"> 
    <WrapPanel.Style> 
    <Style TargetType="WrapPanel"> 
     <Style.Triggers> 
      <DataTrigger Binding="{Binding IsMouseOver,ElementName=image}" 
         Value="True"> 
       <DataTrigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
        <DoubleAnimation Storyboard.TargetProperty="Height" 
             To="71" Duration="0:0:0.3" /> 
        </Storyboard> 
       </BeginStoryboard> 
       </DataTrigger.EnterActions> 
      </DataTrigger> 
     </Style.Triggers> 
    </Style> 
    </WrapPanel.Style> 
</WrapPanel> 

<Image Name="image"> 
    <Image.Triggers> 
    <EventTrigger RoutedEvent="MouseEnter"> 
     <BeginStoryboard> 
     <Storyboard> 
      <DoubleAnimation Storyboard.TargetProperty="Height" To="71" 
          Duration="0:0:0.3" />  
     </Storyboard> 
     </BeginStoryboard> 
    </EventTrigger> 
    </Image.Triggers> 
</Image> 

Обратите внимание, что вы должны дать Image имя (например, image). Удаляется <DoubleAnimation> для WrapPanel. Вместо того, чтобы использовать EventTrigger, мы использовали DataTrigger, слушая IsMouseOver. Вы также можете указать DataTrigger.ExitActions, чтобы начать анимацию, когда IsMouseOver является ложным (равным MouseLeave).