달력

52024  이전 다음

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
반응형


파일구조

Nuget설치해주시고
Install-Package Com.Airbnb.Xamarin.Forms.Lottie

MainPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:App9Animation"
             xmlns:forms="clr-namespace:Lottie.Forms;assembly=Lottie.Forms"
             x:Class="App9Animation.MainPage">
 
    <StackLayout Padding="30">
        <Button x:Name="BtnLogin" 
                Text="Login" 
                BorderColor="#CB9600" 
                BackgroundColor="#F4B400" />
        <forms:AnimationView 
                x:Name="AnimationView"
                Animation="LottieLogo1.json"
                Loop="True"
                AutoPlay="True"
                VerticalOptions="FillAndExpand"
                HorizontalOptions="FillAndExpand"/>
    </StackLayout>
 
</ContentPage>
 
cs

MainPage.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Xamarin.Forms;
 
namespace App9Animation
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
 
            this.AnimationView.IsVisible = false;
            this.BtnLogin.Clicked += BtnLogin_Clicked;
        }
 
        private void BtnLogin_Clicked(object sender, EventArgs e)
        {
            this.AnimationView.IsVisible = true;
        }
    }
}
 
cs


MainActivity.cs

using System;
 
using Android.App;
using Android.Content.PM;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;
using Lottie.Forms.Droid;
 
namespace App9Animation.Droid
{
    [Activity(Label = "App9Animation", Icon = "@mipmap/icon", Theme = "@style/MainTheme", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)]
    public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsAppCompatActivity
    {
        protected override void OnCreate(Bundle bundle)
        {            
            TabLayoutResource = Resource.Layout.Tabbar;
            ToolbarResource = Resource.Layout.Toolbar;
 
            base.OnCreate(bundle);
 
            global::Xamarin.Forms.Forms.Init(this, bundle);
            LoadApplication(new App());
 
            AnimationViewRenderer.Init();
        }
    }
}
 
cs


안드로이드에 AnimationViewRenderer.Init();추가

IOS도 추가해야 한다고 하는데 맥이 없는 관계로 ㅠ


사용한 애니메이션 파일

LottieLogo1.json



실행

  


참조

https://github.com/martijn00/LottieXamarin


https://www.lottiefiles.com/



Lottie는 iOS 및 Android 용 Airbnb에서 만든 모바일 애니메이션 라이브러리로 Adobe After Effects 애니메이션 (JSON으로 내 보낸)을 파싱하고 기본 애니메이션 API를 사용하여 렌더링한다고 한다.


'프로그래밍 > xamarin' 카테고리의 다른 글

[xamarin]팝업창-AbsoluteLayout  (0) 2018.07.08
[xamarin]어플 닫기 전에 물어보고 닫기  (0) 2018.06.24
[xamarin]CustomRenderers  (0) 2018.06.03
[xamarin]Alert Dialog  (0) 2018.05.27
[xamarin] Profile UI Design  (0) 2018.05.20
Posted by 유령회사
|