Android動畫之Frame動畫實戰

來源:互聯網
上載者:User

    Android動畫分為Tween動畫和Frame動畫,Tween動畫主要包括圖片的放大縮小、旋轉、透明度變化、移動等等操作;Frame動畫則簡單得多了,就是把一張張的圖片連續播放產生動畫效果。

    本節主要介紹一下Frame動畫,Tween動畫會在後面的文章中介紹,敬請關注。

    Frame動畫主要是通過AnimationDrawable類來實現的,它有start()和stop()兩個重要的方法來啟動和停止動畫。Frame動畫一般通過XML檔案配置,在工程的res/anim目錄下建立一個XML設定檔,該設定檔有一個<animation-list>根項目和若干個<item>子項目。

    實現一個人跳舞的Frame動畫,6張圖片如下所示:

1、把這6張圖片放到res/drawable目錄下,分別取名為:p01.png,p02.png,p03.png,p04.png,p05.png,p06.png。

2、在res/anim目錄下建立一個XML設定檔,檔案名稱為:dance.xml,檔案內容:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:apk="http://schemas.android.com/apk/res/android" apk:oneshot="false">
<item apk:drawable="@drawable/p01" apk:duration="500" />
<item apk:drawable="@drawable/p02" apk:duration="500" />
<item apk:drawable="@drawable/p03" apk:duration="500" />
<item apk:drawable="@drawable/p04" apk:duration="500" />
<item apk:drawable="@drawable/p05" apk:duration="500" />
<item apk:drawable="@drawable/p06" apk:duration="500" />
</animation-list>

    apk:oneshot指示是否只運行一次,設定為false則意味著迴圈播放。

3、在res/layout目錄下建立layout設定檔dance.xml,檔案內容:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:apk="http://schemas.android.com/apk/res/android" apk:orientation="vertical" apk:layout_width="fill_parent" apk:layout_height="fill_parent">
<!-- Frame動畫圖片 -->
<ImageView apk:id="@+id/ImgDance" apk:layout_width="wrap_content" apk:layout_height="wrap_content" apk:background="@anim/dance" />

<!-- 動畫控制按鈕 -->
<LinearLayout apk:layout_width="fill_parent" apk:layout_height="wrap_content" apk:orientation="horizontal">
<Button apk:text="開始" apk:layout_width="wrap_content" apk:layout_height="wrap_content" apk:onClick="onStartDance" />
<Button apk:text="結束" apk:layout_width="wrap_content" apk:layout_height="wrap_content" apk:onClick="onStopDance" />
</LinearLayout>
</LinearLayout>

    apk:background使用上面的動畫作為背景,意味著要取得動畫,只要取得該View的背景即可,當然可以在代碼中通過設定背景的方式指定;

    apk:onClick指示按鈕的動作,當然可以在代碼中通過實現OnClickListener的方式實現。

4、Activity代碼:

/** * Copyright (c) 2004-2011 All Rights Reserved. */package com.aboy.android.study.animation;import android.app.Activity;import android.graphics.drawable.AnimationDrawable;import android.os.Bundle;import android.view.View;import android.widget.ImageView;import com.aboy.android.study.R;/** * Frame動畫 * * @author obullxl@gmail.com * @version $Id: FrameActivity.java, v 0.1 2011-6-10 下午12:49:46 oldbulla Exp $ */public class FrameActivity extends Activity {    public static final String TAG = "FrameActivity";        // 顯示動畫的組件    private ImageView imgDance;    // Frame動畫    private AnimationDrawable animDance;        /**      * @see android.app.Activity#onCreate(android.os.Bundle)     */    public void onCreate(Bundle cycle) {        super.onCreate(cycle);        super.setContentView(R.layout.dance);                // 執行個體化組件        this.imgDance = (ImageView) super.findViewById(R.id.ImgDance);                // 獲得背景(6個圖片形成的動畫)        this.animDance = (AnimationDrawable) this.imgDance.getBackground();    }        /**     * 按鈕:開始‘跳舞’動畫     */    public void onStartDance(View view) {        this.animDance.start();    }        /**     * 按鈕:停止‘跳舞’動畫     */    public void onStopDance(View view) {        this.animDance.stop();    }    }

    代碼就那麼的幾行,運行之後,點擊[開始] 按鈕後,動畫一直不停的播放,直到點擊“停止”為止。 

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.