教你怎麼十秒解決百張圖片幀動畫oom終極騷問題

原創 NingZhouXu 2018-08-29 22:03

在我們做動畫的時候，爲了絢麗的效果，這時候我們就要用上我們的幀動畫，通過快速播放多張圖片實現動畫的效果，可當我圖片放的太多的時候，這時候就會造成oom。爲了解決這個難題，我都老了0.005歲。好了，現在我們現在正題開始。先從怎麼寫幀動畫開始，這個很簡單，我們直接秒過。

首先我們在res 目錄下建立一個 anim文件夾，在裏面建立我們動畫xml。

<?xml version="1.0" encoding="utf-8"?>
<!--
    根標籤爲animation-list，其中oneshot代表着是否只展示一遍，設置爲false會不停的循環播放動畫  
    根標籤下，通過item標籤對動畫中的每一個圖片進行聲明  
    android:duration 表示展示所用的該圖片的時間長度  

-->
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="false" >
    <item android:drawable="@drawable/airship_001" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_002" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_003" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_004" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_005" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_006" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_007" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_008" android:duration="180"> </item>
     <item android:drawable="@drawable/airship_009" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0010" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0011" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0012" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0013" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0014" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0015" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0016" android:duration="180"> </item>
     <item android:drawable="@drawable/airship_0017" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0018" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0019" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0020" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0021" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0022" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0023" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0024" android:duration="180"> </item>
     <item android:drawable="@drawable/airship_0025" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0026" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0027" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0028" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0029" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0030" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0031" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0032" android:duration="180"> </item>
     <item android:drawable="@drawable/airship_0033" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0034" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0035" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0036" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0037" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0038" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0039" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0040" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0041" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0042" android:duration="180"> </item>
    <item android:drawable="@drawable/airship_0043" android:duration="180"> </item>
    

</animation-list>
然後我們直接在 佈局xml中開始引用了 

<!-- <?xml version="1.0" encoding="utf-8"?> -->

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" 
    
    >

    <ImageView
        android:id="@+id/animation_airship"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:scaleType="centerCrop"
        
        android:src="@drawable/animation_airship" />

    <TextView
        android:id="@+id/exit_airship"
        android:layout_width="100dp"
        android:layout_height="50dp"
        android:onClick="onClickBack"
        android:clickable="true"
        android:text="返回"
        android:layout_gravity="center_horizontal" />

</FrameLayout>
這個時候我們幀動畫的準備工作就完成了
這個時候 我們開始 進行我們的邏輯問題解決了，首先我們導入一個我們需要的   commons-io-1.4。jar  ，這個我們在百度上面一大堆，我也有這個，但是我就是不傳給你們，哎呀，（好氣呀）。

這個時候我們新建一個 工具類MyAnimationDrawable.java 他們進行復制這個工具類package com.example.demo;

package com.example.demo;
import java.io.IOException;  
import java.util.ArrayList;  
import java.util.List;  
import org.apache.commons.io.IOUtils;  
import org.xmlpull.v1.XmlPullParser;  
import org.xmlpull.v1.XmlPullParserException;  
import android.content.Context;  
import android.content.res.XmlResourceParser;  
import android.graphics.BitmapFactory;  
import android.graphics.drawable.AnimationDrawable;  
import android.graphics.drawable.BitmapDrawable;  
import android.graphics.drawable.Drawable;  
import android.os.Handler;  
import android.widget.ImageView;  

public class MyAnimationDrawable {
    public static class MyFrame {  
        byte[] bytes;  
        int duration;  
        Drawable drawable;  
        boolean isReady = false;  
    }  
  
    public interface OnDrawableLoadedListener {  
        public void onDrawableLoaded(List<MyFrame> myFrames);  
    }  
  
    
    public static void animateRawManuallyFromXML(int resourceId,  
            final ImageView imageView, final Runnable onStart,  
            final Runnable onComplete) {  
        loadRaw(resourceId, imageView.getContext(),  
                new OnDrawableLoadedListener() {  
                    @Override  
                    public void onDrawableLoaded(List<MyFrame> myFrames) {  
                        if (onStart != null) {  
                            onStart.run();  
                        }  
                        animateRawManually(myFrames, imageView, onComplete);  
                    }  
                });  
    }  
  
    //
    private static void loadRaw(final int resourceId, final Context context,  
            final OnDrawableLoadedListener onDrawableLoadedListener) {  
        loadFromXml(resourceId, context, onDrawableLoadedListener);  
    }  
  
    //
    private static void loadFromXml(final int resourceId,  
            final Context context,  
            final OnDrawableLoadedListener onDrawableLoadedListener) {  
        new Thread(new Runnable() {  
            @Override  
            public void run() {  
                final ArrayList<MyFrame> myFrames = new ArrayList<MyFrame>();  
  
                XmlResourceParser parser = context.getResources().getXml(  
                        resourceId);  
  
                try {  
                    int eventType = parser.getEventType();  
                    while (eventType != XmlPullParser.END_DOCUMENT) {  
                        if (eventType == XmlPullParser.START_DOCUMENT) {  
  
                        } else if (eventType == XmlPullParser.START_TAG) {  
  
                            if (parser.getName().equals("item")) {  
                                byte[] bytes = null;  
                                int duration = 1000;  
  
                                for (int i = 0; i < parser.getAttributeCount(); i++) {  
                                    if (parser.getAttributeName(i).equals(  
                                            "drawable")) {  
                                        int resId = Integer.parseInt(parser  
                                                .getAttributeValue(i)  
                                                .substring(1));  
                                        bytes = IOUtils.toByteArray(context  
                                                .getResources()  
                                                .openRawResource(resId));  
                                    } else if (parser.getAttributeName(i)  
                                            .equals("duration")) {  
                                        duration = parser.getAttributeIntValue(  
                                                i, 1000);  
                                    }  
                                }  
  
                                MyFrame myFrame = new MyFrame();  
                                myFrame.bytes = bytes;  
                                myFrame.duration = duration;  
                                myFrames.add(myFrame);  
                            }  
  
                        } else if (eventType == XmlPullParser.END_TAG) {  
  
                        } else if (eventType == XmlPullParser.TEXT) {  
  
                        }  
  
                        eventType = parser.next();  
                    }  
                } catch (IOException e) {  
                    e.printStackTrace();  
                } catch (XmlPullParserException e2) {  
                    // TODO: handle exception  
                    e2.printStackTrace();  
                }  
  
                // Run on UI Thread  
                new Handler(context.getMainLooper()).post(new Runnable() {  
                    @Override  
                    public void run() {  
                        if (onDrawableLoadedListener != null) {  
                            onDrawableLoadedListener.onDrawableLoaded(myFrames);  
                        }  
                    }  
                });  
            }  
        }).run();  
    }  
  
    //
    private static void animateRawManually(List<MyFrame> myFrames,  
            ImageView imageView, Runnable onComplete) {  
        animateRawManually(myFrames, imageView, onComplete, 0);  
    }  
  
    //
    private static void animateRawManually(final List<MyFrame> myFrames,  
            final ImageView imageView, final Runnable onComplete,  
            final int frameNumber) {  
        final MyFrame thisFrame = myFrames.get(frameNumber);  
  
        if (frameNumber == 0) {  
            thisFrame.drawable = new BitmapDrawable(imageView.getContext()  
                    .getResources(), BitmapFactory.decodeByteArray(  
                    thisFrame.bytes, 0, thisFrame.bytes.length));  
        } else {  
            MyFrame previousFrame = myFrames.get(frameNumber - 1);  
            ((BitmapDrawable) previousFrame.drawable).getBitmap().recycle();  
            previousFrame.drawable = null;  
            previousFrame.isReady = false;  
        }  
  
        imageView.setImageDrawable(thisFrame.drawable);  
        new Handler().postDelayed(new Runnable() {  
            @Override  
            public void run() {  
                // Make sure ImageView hasn't been changed to a different Image  
                // in this time  
                if (imageView.getDrawable() == thisFrame.drawable) {  
                    if (frameNumber + 1 < myFrames.size()) {  
                        MyFrame nextFrame = myFrames.get(frameNumber + 1);  
  
                        if (nextFrame.isReady) {  
                            // Animate next frame  
                            animateRawManually(myFrames, imageView, onComplete,  
                                    frameNumber + 1);  
                        } else {  
                            nextFrame.isReady = true;  
                        }  
                    } else {  
                        if (onComplete != null) {  
                            onComplete.run();  
                        }  
                    }  
                }  
            }  
        }, thisFrame.duration);  
  
        // Load next frame  
        if (frameNumber + 1 < myFrames.size()) {  
            new Thread(new Runnable() {  
                @Override  
                public void run() {  
                    MyFrame nextFrame = myFrames.get(frameNumber + 1);  
                    nextFrame.drawable = new BitmapDrawable(imageView  
                            .getContext().getResources(),  
                            BitmapFactory.decodeByteArray(nextFrame.bytes, 0,  
                                    nextFrame.bytes.length));  
                    if (nextFrame.isReady) {  
                        // Animate next frame  
                        animateRawManually(myFrames, imageView, onComplete,  
                                frameNumber + 1);  
                    } else {  
                        nextFrame.isReady = true;  
                    }  
  
                }  
            }).run();  
        }  
    }  
  
    //帶時間的方法 
    public static void animateManuallyFromRawResource(  
            int animationDrawableResourceId, ImageView imageView,  
            Runnable onStart, Runnable onComplete, int duration) throws IOException,  
            XmlPullParserException {  
        AnimationDrawable animationDrawable = new AnimationDrawable();  
  
        XmlResourceParser parser = imageView.getContext().getResources()  
                .getXml(animationDrawableResourceId);  
  
        int eventType = parser.getEventType();  
        while (eventType != XmlPullParser.END_DOCUMENT) {  
            if (eventType == XmlPullParser.START_DOCUMENT) {  
  
            } else if (eventType == XmlPullParser.START_TAG) {  
  
                if (parser.getName().equals("item")) {  
                    Drawable drawable = null;  
  
                    for (int i = 0; i < parser.getAttributeCount(); i++) {  
                        if (parser.getAttributeName(i).equals("drawable")) {  
                            int resId = Integer.parseInt(parser  
                                    .getAttributeValue(i).substring(1));  
                            byte[] bytes = IOUtils.toByteArray(imageView  
                                    .getContext().getResources()  
                                    .openRawResource(resId));//IOUtils.readBytes  
                            drawable = new BitmapDrawable(imageView  
                                    .getContext().getResources(),  
                                    BitmapFactory.decodeByteArray(bytes, 0,  
                                            bytes.length));  
                        } else if (parser.getAttributeName(i)  
                                .equals("duration")) {  
                            duration = parser.getAttributeIntValue(i, 66);  
                        }  
                    }  
  
                    animationDrawable.addFrame(drawable, duration);  
                }  
  
            } else if (eventType == XmlPullParser.END_TAG) {  
  
            } else if (eventType == XmlPullParser.TEXT) {  
  
            }  
  
            eventType = parser.next();  
        }  
  
        if (onStart != null) {  
            onStart.run();  
        }  
        animateDrawableManually(animationDrawable, imageView, onComplete, 0);  
    }  
  
    private static void animateDrawableManually(  
            final AnimationDrawable animationDrawable,  
            final ImageView imageView, final Runnable onComplete,  
            final int frameNumber) {  
        final Drawable frame = animationDrawable.getFrame(frameNumber);  
        imageView.setImageDrawable(frame);  
        new Handler().postDelayed(new Runnable() {  
            @Override  
            public void run() {  
                // Make sure ImageView hasn't been changed to a different Image  
                // in this time  
                if (imageView.getDrawable() == frame) {  
                    if (frameNumber + 1 < animationDrawable.getNumberOfFrames()) {  
                        // Animate next frame  
                        animateDrawableManually(animationDrawable, imageView,  
                                onComplete, frameNumber + 1);  
                    } else {  
                        // Animation complete  
                        if (onComplete != null) {  
                            onComplete.run();  
                        }  
                    }  
                }  
            }  
        }, animationDrawable.getDuration(frameNumber));  
    }  
}
這個時候 我們就開始用這個工具類做文章了。

寫個實現類；

package com.example.demo;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.ImageView;
public class AowerActivity  extends Activity {
	private ImageView animation_tower;
	protected void onCreate(Bundle savedInstanceState) {
		// TODO Auto-generated method stub
		super.onCreate(savedInstanceState);
		setContentView(R.layout.tower_activity);
		animation_tower=(ImageView) findViewById(R.id.animation_tower);
		run();
		
	}
	
    private void run() {
        // TODO Auto-generated method stub
        MyAnimationDrawable.animateRawManuallyFromXML(R.drawable.animation_tower,animation_tower,null,null);
    }

    public void onClickBack(View v) {
        finish();
    }

大家要demo的可以私信我，因爲demo裏面的資源設計到了我的項目。



發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章