天天看點

Android動畫之屬性動畫

了解:指定一個開始的位置,再指定一個結束的位置,自動補充中間的變化過程

為了更好的示範,寫了一個Demo,xml界面如下(最後有源碼)

Android動畫之屬性動畫

要介紹的有:

1.透明動畫:alpha

2.位移動畫:translationX,translationY

3.旋轉動畫:rotation

4.縮放動畫:scaleX,scaleY

5.組合顯示:AnimatorSet(動畫集合容器)

1.透明動畫:alpha

Android動畫之屬性動畫

2.位移動畫:translationX,translationY

Android動畫之屬性動畫

3.旋轉動畫:rotation

Android動畫之屬性動畫

4…縮放動畫:scaleX,scaleY

Android動畫之屬性動畫

5.組合顯示:AnimatorSet(動畫集合容器)

Android動畫之屬性動畫

源碼如下:

activity_third.xml檔案:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ThirdActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:id="@+id/btn_alpha"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:text="透明動畫" />

        <Button
            android:id="@+id/btn_translate"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:text="位移動畫" />

        <Button
            android:id="@+id/btn_rotate"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:text="旋轉動畫" />

        <Button
            android:id="@+id/btn_scale"
            android:layout_width="0dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:text="縮放動畫" />
    </LinearLayout>

    <ImageView
        android:id="@+id/iv_show"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:src="@mipmap/ic_launcher" />

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:onClick="groupshow"
        android:text="組合顯示" />
</RelativeLayout>
           

ThirdActivity.java檔案:

//屬性動畫
public class ThirdActivity extends AppCompatActivity implements View.OnClickListener {

    private Button btn_alpha;
    private Button btn_translate;
    private Button btn_rotate;
    private Button btn_scale;
    private ImageView iv_show;
    ObjectAnimator objectAnimator;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_third);
        initView();
    }


    private void initView() {
        btn_alpha = (Button) findViewById(R.id.btn_alpha);
        btn_translate = (Button) findViewById(R.id.btn_translate);
        btn_rotate = (Button) findViewById(R.id.btn_rotate);
        btn_scale = (Button) findViewById(R.id.btn_scale);
        iv_show = (ImageView) findViewById(R.id.iv_show);

        btn_alpha.setOnClickListener(this);
        btn_translate.setOnClickListener(this);
        btn_rotate.setOnClickListener(this);
        btn_scale.setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        //ofFloat:三個參數 :1.受到動畫影響的對象(UI控件)2. 要執行的動畫類型 3. 一組動畫的屬性
        switch (v.getId()) {
            case R.id.btn_alpha://透明動畫
                objectAnimator = ObjectAnimator.ofFloat(iv_show, "alpha", 0.5f, 1f, 0.5f, 1f);
                break;
            case R.id.btn_translate://位移動畫
                //隻會執行一個
                objectAnimator = ObjectAnimator.ofFloat(iv_show, "translationX", 0, 200);
                //objectAnimator=ObjectAnimator.ofFloat(iv_show,"translationY",0,200);
                break;
            case R.id.btn_rotate://旋轉動畫
                objectAnimator = ObjectAnimator.ofFloat(iv_show, "rotation", 0, 90f, 180f, 90f, 45f, 100f);
                break;
            case R.id.btn_scale://縮放動畫
                //隻會執行一個
                objectAnimator = ObjectAnimator.ofFloat(iv_show, "scaleY", 1f, 2f, 3f, 4f);
                // objectAnimator=ObjectAnimator.ofFloat(iv_show,"scaleX",1f,2f,3f,4f);

                break;
        }
        //動畫持續時間
        objectAnimator.setDuration(3000);
        //啟動動畫
        objectAnimator.start();

    }

    public void groupshow(View view) {//組合

        ObjectAnimator objectAnimator1 = ObjectAnimator.ofFloat(iv_show, "scaleY", 1f, 2f, 1f, 2f);
        ObjectAnimator objectAnimator2 = ObjectAnimator.ofFloat(iv_show, "scaleX", 1f, 2f, 1f, 2f);
        ObjectAnimator objectAnimator3 = ObjectAnimator.ofFloat(iv_show, "rotation", 0, 90f, 180f, 90f, 45f, 100f);
        //建立屬性動畫的集合容器
        AnimatorSet animatorSet = new AnimatorSet();
        //同時播放
        animatorSet.play(objectAnimator1).with(objectAnimator2).with(objectAnimator3);
        //按照順序播放
        // animatorSet.play(objectAnimator1).after(objectAnimator2).after(objectAnimator3);

        /*
        * 另一種方式
        List<Animator> list=new ArrayList<>();
        list.add(objectAnimator1);
        list.add(objectAnimator2);
        list.add(objectAnimator3);
        animatorSet.playSequentially(list);//按照順序播放
        animatorSet.playTogether(list);//同時執行
        */
        //設定時長
        animatorSet.setDuration(3000);
        //啟動
        animatorSet.start();

    }
}
           

繼續閱讀