首页 > 解决方案 > 请求异步任务时是否可以弹出一个lottie动画视图

问题描述

我创建了一个内容视图,并在这个内容视图中插入了一个抽签动画:

我正在尝试使其成为通用动画视图,以便可以将其用于多个异步任务

加载动画.xaml

<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:lottie="clr-namespace:Lottie.Forms;assembly=Lottie.Forms"
             x:Class="Fit_Plans.Views.Common.LoadingAnimation">
  <ContentView.Content>
      <StackLayout>
          <lottie:AnimationView
              Grid.Column="0"
              Margin="-20"
              x:Name="LoadingAnimationView"
              Animation="loading_animation.json"

              AutoPlay="false"
              HeightRequest="160"
              WidthRequest="160"
              VerticalOptions="FillAndExpand"
              HorizontalOptions="FillAndExpand"/>
        </StackLayout>
  </ContentView.Content>
</ContentView>

现在在我的 SomeView.Xaml.cs

 async protected override void OnAppearing()
        {
            Product produits = new Product();          
            if(getListProduit ==null || getListProduit.Count<=0)
            {  
                getListProduit = await produits.loadMenuAsync(api, siteUrl);
                PopulateProductsLists(getListProduit);
            }
            base.OnAppearing();

        }

您会注意到我有一个等待异步任务:

getListProduit = await produits.loadMenuAsync(api, siteUrl);

是否可以让我的抽签动画弹出 animation.jason ,并在任务完成后关闭弹出窗口?或者,做这种事情的最好方法是什么?

标签: xamlxamarinxamarin.formslottie

解决方案


如果您想在弹出窗口中显示抽奖动画,我鼓励您使用出色的Rg.Plugins.Popup库。您可以从 nuget 获取它,然后创建一个弹出页面,您应该在其中添加彩票动画(与上面所做的相同)。这样您就可以重用这个弹出动画页面。

您的弹出页面的 XAML 看起来与此类似:

<pages:PopupPage 
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
    xmlns:animations="clr-namespace:Rg.Plugins.Popup.Animations;assembly=Rg.Plugins.Popup"
    x:Class="MyProject.MyPopupPage">
    <!--You can set an animation in the xaml file or in the csharp code behind-->
    <pages:PopupPage.Animation>
        <animations:ScaleAnimation 
            PositionIn="Center"
            PositionOut="Center"
            ScaleIn="1.2"
            ScaleOut="0.8"
            DurationIn="400"
            DurationOut="300"
            EasingIn="SinOut"
            EasingOut="SinIn"
            HasBackgroundAnimation="True"/>
    </pages:PopupPage.Animation>
    <!--You can use any elements here which are extended from Xamarin.Forms.View-->
     <lottie:AnimationView
          Grid.Column="0"
          Margin="-20"
          x:Name="LoadingAnimationView"
          Animation="loading_animation.json"

          AutoPlay="true"
          HeightRequest="160"
          WidthRequest="160"
          VerticalOptions="FillAndExpand"
          HorizontalOptions="FillAndExpand"/>
</pages:PopupPage>

在这里,您可以找到使用新弹出页面的代码。


推荐阅读