我最近开始使用Microsoft Expression Blend和Visual Studio 2010开始学习FluidMoveSetTagBehavior和FluidMoveBehavior的所有内容。根据我在网上找到的几个例子,我创建了下面的示例,除了小问题
我一直在尝试测试创建动画,以便在选择ListViewItem时显示TextBlock的更新。
当在ListView中选择项目时,文本会根据FluidMoveBehavior移动到TextBlock,但文本在动画阶段会垂直拉伸。然后,一旦动画结束,它就会在TextBlock中正确捕捉。我最初也有水平拉伸这个问题,但我能够解决这个问题,添加一些HorizontalAlignment =“Left”属性。虽然没有这样的幸运VerticalAlignment属性。
Xaml Code
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="1*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<WrapPanel>
<TextBox Height="23" Name="TextBox1" Margin="4" VerticalAlignment="Center" Width="120" />
<Button Content="Add" Margin="4" Name="Button1" VerticalAlignment="Top" Width="75" />
<Button Content="Remove" Margin="4" Name="Button2" VerticalAlignment="Top" Width="75" />
</WrapPanel>
<ListView Grid.Row="1" Height="150" Name="ListView1" SelectionMode="Single" VerticalAlignment="Top">
<ListView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel >
<i:Interaction.Behaviors>
<ei:FluidMoveBehavior Duration="0:0:0.5" AppliesTo="Children">
<ei:FluidMoveBehavior.EaseY>
<QuarticEase EasingMode="EaseInOut"/>
</ei:FluidMoveBehavior.EaseY>
<ei:FluidMoveBehavior.EaseX>
<QuarticEase EasingMode="EaseInOut"/>
</ei:FluidMoveBehavior.EaseX>
</ei:FluidMoveBehavior>
</i:Interaction.Behaviors>
</StackPanel>
</ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" FontSize="14" HorizontalAlignment="Left" TextWrapping="Wrap"
Opacity="0" TextAlignment="Center" Height="23" >
<i:Interaction.Behaviors>
<ei:FluidMoveSetTagBehavior Tag="DataContext"/>
</i:Interaction.Behaviors>
<TextBlock.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
Duration="00:00:01"
From="0"
To="1" BeginTime="00:00:00.4000000" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="FrameworkElement.Unloaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
Duration="00:00:01"
From="1"
To="0" />
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<StackPanel Grid.Column="1" Grid.Row="1">
<TextBlock DataContext="{Binding SelectedItem, Mode=TwoWay, ElementName=ListView1}" HorizontalAlignment="Left"
TextWrapping="Wrap" FontSize="14" Text="{Binding Mode=OneWay}" Height="23" >
<i:Interaction.Behaviors>
<ei:FluidMoveBehavior InitialTag="DataContext" Duration="0:0:2">
<ei:FluidMoveBehavior.EaseX>
<CircleEase EasingMode="EaseOut"/>
</ei:FluidMoveBehavior.EaseX>
</ei:FluidMoveBehavior>
</i:Interaction.Behaviors>
</TextBlock>
</StackPanel>
</Grid>
背后的代码
Class MainWindow
Private Sub Button1_Click(sender As System.Object, e As System.Windows.RoutedEventArgs) Handles Button1.Click
ListView1.Items.Insert(0, TextBox1.Text)
End Sub
Private Sub Button2_Click(sender As System.Object, e As System.Windows.RoutedEventArgs) Handles Button2.Click
ListView1.Items.Remove(ListView1.Items(0))
End Sub
End Class
希望有人可以提供帮助。