Add support for `EventTrigger`

[vynxc]

Current behavior

<Page.Triggers>
            <EventTrigger RoutedEvent="Page.Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation
                            Storyboard.TargetName="MyPage"
                            Storyboard.TargetProperty="Opacity"
                            From="0.0"
                            To="1.0"
                            Duration="0:0:1" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Page.Triggers>  

Throwing code rejection for Android But working on uwp. If deleted works fine on Android. No storyboard animation are working on android.

Expected behavior

Fades page in on loaded .

How to reproduce it (as minimally and precisely as possible)

<Page.Triggers>
            <EventTrigger RoutedEvent="Page.Loaded">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation
                            Storyboard.TargetName="MyPage"
                            Storyboard.TargetProperty="Opacity"
                            From="0.0"
                            To="1.0"
                            Duration="0:0:1" />
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Page.Triggers> 

Workaround

No response

Works on UWP/WinUI

Yes

Environment

Uno.UI / Uno.UI.WebAssembly / Uno.UI.Skia

NuGet package version(s)

Last Uno & Material Ui packages

Affected platforms

Android

IDE

No response

IDE version

Visual studio 2022

Relevant plugins

No response

Anything else we need to know?

No response

[Youssef1313]

@vynxcc Can you update the issue and include the XAML code properly please?

See https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/creating-and-highlighting-code-blocks for how to properly add code to the issue.

GitHub Docs

Creating and highlighting code blocks - GitHub Docs

Share samples of code with fenced code blocks and enabling syntax highlighting.

[Youssef1313]

It also looks like this is not yet implemented:

https://github.com/unoplatform/uno/blob/cbc6e58d4988863b9b8d22c64afc900fa2d87e8e/src/Uno.UI/Generated/3.0.0.0/Windows.UI.Xaml/EventTrigger.cs#L5-L8

[vynxc]

@vynxcc Can you update the issue and include the XAML code properly please?

See https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/creating-and-highlighting-code-blocks for how to properly add code to the issue.

GitHub DocsCreating and highlighting code blocks - GitHub DocsShare samples of code with fenced code blocks and enabling syntax highlighting.

Sorry buddy! Got it

GitHub Docs

Creating and highlighting code blocks - GitHub Docs

Share samples of code with fenced code blocks and enabling syntax highlighting.

[vynxc]

It also looks like this is not yet implemented:

https://github.com/unoplatform/uno/blob/cbc6e58d4988863b9b8d22c64afc900fa2d87e8e/src/Uno.UI/Generated/3.0.0.0/Windows.UI.Xaml/EventTrigger.cs#L5-L8

How would I animate in android? Could you provide me with a sample

[Youssef1313]

@vynxcc See the remarks from Microsoft docs:

Triggers, EventTrigger, Actions and BeginStoryboard are not commonly used. These API mainly exist for compatibility in XAML originally used for Microsoft Silverlight. For most scenarios where event triggers were used previously, do one of these:

• Use built-in animations from the animation library. See Quickstart: Animating your UI using the animation library.
• For events in control templates, use visual states and VisualStateManager. See Storyboarded animations for visual states or Quickstart: Control templates.
• For app-specific UI animations, define a Loaded handler on the page. This handler can reference a Storyboard that's defined in page-level resources, and call the Begin method on that Storyboard. See Storyboarded animations.

For your example, I think it falls under the third point. So you can move the storyboard to page resources and call Begin in Loaded event handler for the page

[vynxc]

@vynxcc See the remarks from Microsoft docs:

Triggers, EventTrigger, Actions and BeginStoryboard are not commonly used. These API mainly exist for compatibility in XAML originally used for Microsoft Silverlight. For most scenarios where event triggers were used previously, do one of these:

• Use built-in animations from the animation library. See Quickstart: Animating your UI using the animation library.
• For events in control templates, use visual states and VisualStateManager. See Storyboarded animations for visual states or Quickstart: Control templates.
• For app-specific UI animations, define a Loaded handler on the page. This handler can reference a Storyboard that's defined in page-level resources, and call the Begin method on that Storyboard. See Storyboarded animations.

For your example, I think it falls under the third point. So you can move the storyboard to page resources and call Begin in Loaded event handler for the page

Thanks for the extremely fast replys, I'll try that.

[vynxc]

no error. animation works on uwp but not android. xaml -

    <UserControl.Resources>
        <Storyboard x:Name="myStoryboard">
            <DoubleAnimation
                Storyboard.TargetName="MyGrid"
                Storyboard.TargetProperty="Opacity"
                From="0.0"
                To="1.0"
                Duration="0:0:1" />
        </Storyboard>
    </UserControl.Resources>

codebehind -

private void ShowControl_Loaded(object sender, RoutedEventArgs e)
        {
            Storyboard storyboard = (Storyboard)this.FindName("myStoryboard");
            storyboard.Begin();
        }

[vynxc]

Fixed with using myStoryboard.Begin(); lol

[Youssef1313]

@vynxcc It probably wasn't working due to https://github.com/unoplatform/uno/issues/7258

[jeromelaban]

Lets keep this issue opened for the implementation of EventTrigger.