CODEWITHSUNDEEP
c#windows-runtimewin-universal-appwinrt-xaml
Overrided
Overrided

Reputation: 157

FlipView EventTrigger for the SelectionChanged event

I'm developing universal app. On one page i decided to use FlipView. I can easily animate SelectionChanged event from code-behind, but i'm just curious if there is a way to animate this event using XAML only. (BTW, UseTouchAnimationsForAllNavigation="True" doesnt work). So, here's simplified example of what i'm doing :

    <FlipView x:Name="MultipleItems">
              <FlipView.Triggers>
                <EventTrigger RoutedEvent="Selector.SelectionChanged">
                    <BeginStoryboard>
                        <Storyboard x:Name="ColorStoryboard">
                            //do stuff
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
              <FlipView.Triggers>
   </FlipView>

I think this way of usage EventTrigger is fine (as far as SelectionChanged event takes arguments inherited from RoutedEventArgs), but it still gives me runtime error on navigation to page that contains FlipView.

Error is next : 

    WinRT information: Failed to assign to property 'Windows.UI.Xaml.EventTrigger.RoutedEvent'. [Line: 69 Position: 35]

   Additional information: The text associated with this error code could not be found.

I believe there's way to assign that RoutedEvent property correctly, but i didnt find it yet. Also I don't wont to use behaviours for such simple thing.

Can anyone help?

Upvotes: 1

Views: 503

Answers (1)

Grace Feng
Grace Feng

Reputation: 16652

You need to install the Microsoft.Xaml.Behaviors.Uwp.Managed in your project. Then the EventTrigger will be supported in an UWP project.

Then in your XAML use this package like this:

xmlns:Interactivity="using:Microsoft.Xaml.Interactivity"
xmlns:Core="using:Microsoft.Xaml.Interactions.Core"
xmlns:Media="using:Microsoft.Xaml.Interactions.Media"

Now you can for example change the background color of FlipView like this:

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.Resources>
        <Storyboard x:Key="std" x:Name="std" >
            <ColorAnimation From="Red" To="Transparent" Duration="0:0:3" 
                            Storyboard.TargetProperty="(Background).(SolidColorBrush.Color)"
                            Storyboard.TargetName="flipView"/>
        </Storyboard>
    </Grid.Resources>
    <FlipView x:Name="flipView" ItemsSource="{x:Bind flipviewCollection}">
        <Interactivity:Interaction.Behaviors>
            <Core:EventTriggerBehavior EventName="SelectionChanged">
                <Media:ControlStoryboardAction Storyboard="{StaticResource std}" />
            </Core:EventTriggerBehavior>
        </Interactivity:Interaction.Behaviors>
        <FlipView.ItemTemplate>
            <DataTemplate>
                <Image Source="{Binding ImageSource}" Stretch="None"/>
            </DataTemplate>
        </FlipView.ItemTemplate>
    </FlipView>
</Grid>

As you can see, I used EventTriggerBehavior and the event's name is SelectionChanged.

Upvotes: 2

Related Questions