安卓动画的简单实现方法(Animation和AnimationDrawable)

  • Animation-补间动画(Tweened Animation)

    实例先行:


    activity.xml:
    <LinearLayout
            android:id="@+id/winpay_loading_parent"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:orientation="vertical">
    
            <ImageView
                android:id="@+id/winpay_loading_bg"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:contentDescription="@null"
                android:src="@mipmap/winpay_loading_bg" />
    
            <TextView
                android:id="@+id/winpay_loading_tips"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="3dp"
                android:text="@string/winpay_loading" />
        </LinearLayout>
    preview


    winpay_loading_bg.png


    res/anim/loading_animation.xml
    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android">
        <rotate
            android:duration="1000"
            android:fromDegrees="0"
            android:interpolator="@android:anim/linear_interpolator"
            android:pivotX="50%"
            android:pivotY="50%"
            android:repeatCount="-1"
            android:repeatMode="restart"
            android:startOffset="-1"
            android:toDegrees="+360" />
    
    </set>
    

    activity
    mLoadingBg = (ImageView) findViewById(R.id.winpay_loading_bg);
    Animation ImageRotateAnimation = AnimationUtils.loadAnimation(this,
                    R.anim.loading_animation);
    mLoadingBg.startAnimation(ImageRotateAnimation);

    理论知识:
    补间动画又可以分为四种形式,分别是 alpha(淡入淡出)translate(位移)scale(缩放大小)rotate(旋转)
    补间动画的实现,一般会采用xml 文件的形式;代码会更容易书写和阅读,同时也更容易复用。
    alpha(淡入淡出)
    <alpha xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="1000"
        android:fromAlpha="1.0"
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:toAlpha="0.0" />
    scale(缩放)
    <scale xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="1000"
        android:fromXScale="0.0"
        android:fromYScale="0.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="1.0"
        android:toYScale="1.0"/>
    也可以使用set标签将多个动画组合(代码源自Android SDK API)
    <set xmlns:android="http://schemas.android.com/apk/res/android"
        android:interpolator="@[package:]anim/interpolator_resource"
        android:shareInterpolator=["true" | "false"] >
        <alpha
            android:fromAlpha="float"
            android:toAlpha="float" />
        <scale
            android:fromXScale="float"
            android:toXScale="float"
            android:fromYScale="float"
            android:toYScale="float"
            android:pivotX="float"
            android:pivotY="float" />
        <translate
            android:fromXDelta="float"
            android:toXDelta="float"
            android:fromYDelta="float"
            android:toYDelta="float" />
        <rotate
            android:fromDegrees="float"
            android:toDegrees="float"
            android:pivotX="float"
            android:pivotY="float" />
        <set>
            ...
        </set>
    </set>
    interpolator:主要作用是可以控制动画的变化速率 ,就是动画进行的快慢节奏。
    pivot: 决定了当前动画执行的参考位置

  • AnimationDrawable-帧动画(Frame Animation)

    实例先行:



    activity.xml:
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    
            <ImageView
                android:id="@+id/seatel_wifi_bg"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_margin="50dp"
                android:scaleType="centerInside"
                android:src="@drawable/seatel_wifi_loading_bg" />
    
            <ImageView
                android:id="@+id/seatel_wifi_status"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerHorizontal="true"
                android:layout_margin="110dp"
                android:scaleType="centerInside"
                android:src="@mipmap/seatel_wifi_loading" />
        </RelativeLayout>

    res/drawable/seatel_wifi_loading_bg.xml:
    <?xml version="1.0" encoding="utf-8"?>
    <animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">
        <item android:drawable="@mipmap/seatel_wifi_round1" android:duration="350" />
        <item android:drawable="@mipmap/seatel_wifi_round2" android:duration="350" />
        <item android:drawable="@mipmap/seatel_wifi_round3" android:duration="350" />
        <item android:drawable="@mipmap/seatel_wifi_round4" android:duration="350" />
        <item android:drawable="@mipmap/seatel_wifi_round5" android:duration="350" />
        <item android:drawable="@mipmap/seatel_wifi_round6" android:duration="350" />
    </animation-list>
    


    activity:
    private void showLoading() {
            mStatus.setImageResource(R.mipmap.seatel_wifi_loading);
            mWifiBg.setImageResource(R.drawable.seatel_wifi_loading_bg);
            mTip.setText("连接中。。。");
            AnimationDrawable anim = (AnimationDrawable) mWifiBg.getDrawable();
            anim.start();
        }

    理论知识:

    帧动画是最容易实现的一种动画,这种动画更多的依赖于完善的UI资源,他的原理就是将一张张单独的图片连贯的进行播放,
    从而在视觉上产生一种动画的效果;有点类似于某些软件制作gif动画的方式。
    android:oneshot="false" ,这个oneshot的含义就是动画执行一次(true)还是循环执行多次。


版权声明:本文为qq_34020571原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。