I'm currently creating a control that is mainly just an ItemsControl
displaying some items.
In addition I have some controls which allows the user to filter the items in that ItemsControl
.
What I'm trying to do is to make it better visible to the user which items are removed when the filter is applied.
So what I did was instead of really filtering the ICollectionView
, I introduced a new property IsVisible
on the VM used for each item.
Then I added a ScaleTransform
as LayoutTransform
to the DataTemplate
, and I added a DataTrigger
to animate the transform:
<Style x:Key="FilterCollapse" TargetType="{x:Type StackPanel}">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=IsVisible}" Value="False">
<DataTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
To="0"
Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetProperty="LayoutTransform.ScaleY"
To="0"
BeginTime="0:0:0.0"
Duration="0:0:0.5"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.EnterActions>
<DataTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Storyboard.TargetProperty="LayoutTransform.ScaleY"
To="1"
Duration="0:0:0.5"/>
<DoubleAnimation Storyboard.TargetProperty="Opacity"
To="1"
BeginTime="0:0:0.5"
Duration="0:0:0.5"/>
</Storyboard>
</BeginStoryboard>
</DataTrigger.ExitActions>
</DataTrigger>
</Style.Triggers>
</Style>
<DataTemplate x:Key="MyTemplate">
<StackPanel Style="{StaticResource FilterCollapse}">
<StackPanel.LayoutTransform>
<ScaleTransform ScaleX="1" ScaleY="1"/>
</StackPanel.LayoutTransform>
If the User now filters everything works fine.
But the problem I have is if the anything开发者_如何转开发 changed in the list (adding new items, ...) the Storyboard
is applied again, although the user did filter anything.
The reason for it is, that after the list has been changed, the DataTemplate
will be recreated, with a ScaleY of "1", then the DataTrigger
is applied again, and the scoreboard applied again.
In this case I would like that no animation happens.
Any ideas how to do this? tia Martin
I found a solution that works for me.
I'm now creating the ScaleTransform
in my VM, and bind it to the LayoutTransform
from the DataTemplate
. Because of this the object stays the same all the time, and doesn't lose its value once the DataTemplate
is recreated.
精彩评论