5

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.

当鼠标进入此图像时，出现以下异常：“在'System.Windows.Controls.Image'的名称范围内找不到'itmTempPanel'名称。”

如何从故事板开始的元素更改其他元素属性。

谢谢您的帮助 ！！

4

1 回答 1

6

有两种方法可以解决这个问题。第一个是使用{x:Reference}.NET 4.0 中的一项功能用于 WPF。如果您的应用程序面向 .NET 4.0，您应该遵循这种方法。这个想法是将 设置为Storyboard.Target您要设置动画的对象（在本例中为WrapPanel）。虽然我们可以使用BindingforStoryboard.Target但我们不能使用RelativeSource或ElementName设置绑定源，因为Storyboard（或 Timeline）不是 FrameworkElement（或 FrameworkContentElement）。指定源的唯一方法是设置Source属性。但是，我们通常可以将其设置为StaticResourceorDynamicResource或直接（使用元素语法）。幸运的{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可以用来将 Trigger 源绑定到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属性。您还可以指定为 false（等于）DataTrigger.ExitActions时开始制作动画。IsMouseOverMouseLeave

于 2014-09-28T11:49:51.593 回答