如何在启动屏幕中应用Lottie动画?

3

我正在尝试在我的启动屏幕中使用Lottie动画。

我创建了一个包含我的AnimationView的新XAML页面:

<StackLayout>
    <forms:AnimationView 
        x:Name="SplashView" 
        Animation="hello.json"
        Loop="true"
        AutoPlay="true"
        IsEnabled="True"
        IsPlaying="True"
        IsVisible="True"
        VerticalOptions="Center" 
        HorizontalOptions="Center" />
</StackLayout>

当应用程序启动时,MainPage 应该包含 AnimationView。我添加了一个名为 'SplashView.OnFinish' 的事件,因此当动画结束时,使用 NavigationPage.PushAsync 将页面更改为我的主页。
以下是代码:
public SplashScreen ()
{
    InitializeComponent ();
    NavigationPage.SetHasNavigationBar(this, false);

    SplashView.Play();
    SplashView.OnFinish += SplashView_OnFinish;
}

protected override void OnAppearing()
{
    base.OnAppearing();
    SplashView.Play();
}

private void SplashView_OnFinish(object sender, EventArgs e)
{
    Navigation.PushAsync(new MainPage());
}

所有功能正常,但我无法看到动画,只有一个白色页面。

Navigation.PushAsync可以正常工作,但动画不显示。

我尝试使用OnAppearing方法来触发我的动画开始,但仍然无法正常工作。


只是出于好奇,根据我的理解,在主页面加载之前出现的屏幕称为启动画面。您需要在启动画面上添加动画,但如果将其指定为主页面,那么在主页面加载之前会出现什么? - MShah
是的,我已经将背景图片设置为真正的启动画面,这个只是在之后出现的,只是一种额外的装饰。 - dr1sshamra
1个回答

0

这样你就可以简化代码,PushAsync 返回一个 Task,所以你需要使用 await

public partial class SplashPage : ContentPage
{
    public SplashPage()
    {
        InitializeComponent();
        NavigationPage.SetHasNavigationBar(this, false);
    }

    async void SplashView_OnFinish(object sender, EventArgs e)
    {
        await Navigation.PushAsync(new MainPage());
    }
}

对于 XAML,您不希望启用循环,因为 OnFinish 处理程序永远不会被调用。 您可以提供 OnFinish 处理程序等等... 最大的问题是仅使用 vert/horz 选项的 Center 不会为视图提供大小,请使用 FillAndExpand 尝试匹配包含视图。

<forms:AnimationView
    x:Name="SplashView"
    Animation="hello.json"
    Loop="false" 
    AutoPlay="true"
    OnFinish="SplashView_OnFinish"
    VerticalOptions="FillAndExpand" 
    HorizontalOptions="FillAndExpand" />

1
谢谢,它起作用了,顺便说一下,问题是由于hello.json文件引起的。我改变了它,然后它就工作了。我还有一个问题,请问我能把XAML页面作为真正的启动画面吗?我的意思是这个只是一个技巧,我已经有一个默认的背景图像作为启动画面。但如果我可以制作一个个性化的XAML页面作为启动画面,那就太好了。 - dr1sshamra
1
@dr1sshamra 不可以使用 XAML 页面作为“真正”的启动画面,在 Android 上我个人只使用主题中的 windowBackground,速度快,仍然能够在应用程序启动时显示某些内容。 - SushiHangover
对于那些给答案点踩的人:问题是关于表单 SplashScreen 页面的,而答案严格回答了这个问题。虽然我们都明白可能还有另一个主题是创建本地启动画面。 - Nick Kovalsky

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接