カクカクな動きを改善する方法

Question

前回質問させていただいた花びらの落ちるプログラムをAndroidでも作ってみました。

コード
public class MainActivity extends Activity{


	/*変数・代数*/
	Handler handler = new Handler();		//Handlerのインスタンス化
	Thread thread;							//Threadの参照代数作成
	FrameLayout frameLayout;				//FrameLayoutの参照代数作成
	CanvasView canvasview;					//CanvasViewの参照代数作成
	
	int sakuraCount = 15;					//表示する桜の枚数
	Sakura sakura[] = new Sakura[sakuraCount];

	Random rnd = new Random();

	/*メインメソッッド*/
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);

		frameLayout = new FrameLayout(this);			//FrameLayoutのインスタンス化
		frameLayout.setBackgroundColor(Color.WHITE);	//レイアウトの背景色設定
        setContentView(frameLayout);					//アクティビティにframeLayout(View部品)を配置

        canvasview = new CanvasView(this);				//CanvasViewのインスタンス化
        frameLayout.addView(canvasview);				//frameLayoutにcanvasview追加

        for(int i = 0; i < sakuraCount; i++){
			sakura[i] =
				new Sakura(	(Math.random() * 800) - 100, 0,
							rnd.nextInt(11) + 5, rnd.nextInt(100)*100,
							Math.random() + 1);

			sakura[i].setCanvasView(canvasview);
			sakura[i].start();
		}

        //このクラスのsakuraCountとSakuraがCanvasViewクラスのものと同値であると示す
        canvasview.setSakuraCountAndSakura(sakuraCount, sakura);
    }

}

コード
public class Sakura extends Thread{

	/*変数・代数*/
	Handler handler = new Handler();		//Handlerクラスをインスタンスごとに管理
	Paint paint = new Paint();				//Paintクラスをインスタンスごとに管理
	CanvasView canvasview;

	int Vertex_data[][] = {	{  1,  1, 0},		//点P0
							{ -1, -1, 0}	};	//点P1
							//頂点データ
	float Screen_vData[][] = new float[2][3];	//表示頂点データ

	int Control_data[][] = {	{-1,  1, 0},	//点P0から点P1
								{ 1, -1, 0}	};	//点P1から点P0
							//曲線描くときのコントロールデータ
	float Screen_cData[][] = new float[2][3];	//表示コントロールデータ

	double pointX;			//表示位置のx座標
	double pointY;			//表示位置のy座標
	int scale;				//描画倍数
	int time;				//開始時間
	double distanceY;		//移動距離

	double phi;			//x軸周りの回転角
	double theta;			//y軸周りの回転角

	int select;				//左右判定

	Random rnd = new Random();

	/*Sakuraクラスのコンストラクタ*/
	public Sakura(	double pointX, double pointY,
					int scale, int time,
					double distanceY){
		this.pointX = pointX;
		this.pointY = pointY;
		this.scale = scale;
		this.time = time;
		this.distanceY = distanceY;

		phi = 0;
		theta = 0;

		//左右どちらに動くか判定
		select = rnd.nextInt(2) + 1;

		paint.setColor(Color.MAGENTA );	//色設定
		paint.setStrokeWidth(1);			//線の太さ設定
	    paint.setAntiAlias(true);			//滑らかに書く
	    paint.setStyle(Paint.Style.FILL);	//塗りつぶし
	}



	/*runメソッド*/
	public void run(){
		//開始時間設定
		try{
		Thread.sleep(time);
		}
		catch(InterruptedException e){
		}

		for(int i = 0; i < 1000; i++){
			try{
			Thread.sleep(5);
			}
			catch(InterruptedException e){
			}

			if(select == 1){
			pointX += (Math.random() * 1);
			}
			else{
			pointX -= (Math.random() * 1);
			}

			phi += Math.PI / (rnd.nextInt(101) + 30);	//角度変更処理
			theta += Math.PI / (rnd.nextInt(101) + 30);	//角度変更処理
			pointY += distanceY;						//落下処理

			setRotPosition();

			viewStart();
		}
	}



	/*回転後、座標を更新するメソッド*/
	public void setRotPosition(){
		//回転後の頂点座標
		for(int i = 0; i < Vertex_data.length; i++){
			double rvx = Vertex_data[i][0] * Math.cos(theta) +
						Vertex_data[i][2] * Math.sin(theta);
			double rvy = Vertex_data[i][0] * Math.sin(phi) * Math.sin(theta) +
						Vertex_data[i][1] * Math.cos(phi) -
							Vertex_data[i][2] * Math.cos(phi) * Math.cos(theta);
			double rvz = - Vertex_data[i][0] * Math.cos(phi) * Math.sin(theta) +
						Vertex_data[i][1] * Math.sin(phi) +
							Vertex_data[i][2] * Math.cos(phi) * Math.cos(theta);

			Screen_vData[i][0] = (float)(pointX + (rvx * scale));
			Screen_vData[i][1] = (float)(pointY - (rvy * scale));
			Screen_vData[i][2] = (float)(rvz * scale);
		}

		//回転後のコントロールデータ
		for(int i = 0; i < Control_data.length; i++){
			double rcx = Control_data[i][0] * Math.cos(theta) +
						Control_data[i][2] * Math.sin(theta);
			double rcy = Control_data[i][0] * Math.sin(phi) * Math.sin(theta) +
						Control_data[i][1] * Math.cos(phi) -
							Control_data[i][2] * Math.cos(phi) * Math.cos(theta);
			double rcz = - Control_data[i][0] * Math.cos(phi) * Math.sin(theta) +
						Control_data[i][1] * Math.sin(phi) +
							Control_data[i][2] * Math.cos(phi) * Math.cos(theta);

			Screen_cData[i][0] = (float)(pointX + (rcx * scale));
			Screen_cData[i][1] = (float)(pointY - (rcy * scale));
			Screen_cData[i][2] = (float)(rcz * scale);
		}
	}



	//描画開始メソッド
	public void viewStart(){
		handler.post(new Runnable() {
        	@Override
        	public void run(){
        		canvasview.invalidate();		//onDrawメソッド呼び出し
            }
        });
	}



	/*canvasview同値メソッド*/
	public void setCanvasView(CanvasView canvasview) {
		this.canvasview = canvasview;
	}

}

コード

public class CanvasView extends View{

	int sakuraCount;
	Sakura sakura[] = new Sakura[sakuraCount];

	/*CanvasViewクラスのコンストラクタ*/
	public CanvasView(Context context){
		super(context);
	}

	/*sakuraCountとsakura[]同値メソッド*/
	public void setSakuraCountAndSakura(int sakuraCount, Sakura sakura[]){
		this.sakuraCount = sakuraCount;
		this.sakura =sakura;
	}


	/*描画メソッド*/
	protected void onDraw(Canvas canvas){
		super.onDraw(canvas);

		canvas.drawColor(Color.WHITE);
		
		Path path = new Path();
	    
	    for(int i = 0; i < sakuraCount; i++){
	    	path.moveTo(sakura[i].Screen_vData[0][0], sakura[i].Screen_vData[0][1]);
	    	path.quadTo(sakura[i].Screen_cData[0][0], sakura[i].Screen_cData[0][1], sakura[i].Screen_vData[1][0], sakura[i].Screen_vData[1][1]);
	    	path.quadTo(sakura[i].Screen_cData[1][0], sakura[i].Screen_cData[1][1], sakura[i].Screen_vData[0][0], sakura[i].Screen_vData[0][1]);
	    	canvas.drawPath(path, sakura[i].paint);
	    }
	}
}

このプログラムで実機につないで実行すると動きはしたのですが、カクカクでした。
ちらつきがある場合はダブルバッファの処理でなおると思うのですがカクカクの場合はどうすればいいのでしょうか？
プログラムの処理が重たくてカクカクなのでしょうか？
よろしくお願いします。

Answer 1

CanvasViewのスーパークラスをViewからSurfaceViewに変更すると改善します。
参考：[Android 開発] グラフィックスの描画 ～ SurfaceView 編

SurfaceView クラスを使用した場合、アプリケーションとは別に描画処理のスレッドが独立しており、より高速に安定して再描画が行われます。そのため、ゲームや動画再生などの用途に向いているようです。

上記サイトを参考に試したコードは以下の通りです。

public class MainActivity extends Activity {
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        canvasview = new CanvasView(this);
        setContentView(canvasview);
        ...略
    }
}

public class CanvasView2 extends SurfaceView implements SurfaceHolder.Callback, Runnable {

    int sakuraCount;
    Sakura sakura[] = new Sakura[sakuraCount];

    /*CanvasViewクラスのコンストラクタ*/
    public CanvasView2(Context context){
        super(context);
        getHolder().addCallback(this);
    }

    /*sakuraCountとsakura[]同値メソッド*/
    public void setSakuraCountAndSakura(int sakuraCount, Sakura sakura[]){
        this.sakuraCount = sakuraCount;
        this.sakura =sakura;
    }

    private boolean mIsAttached;
    private Thread mThread;

    public void surfaceCreated(SurfaceHolder holder) {
        mIsAttached = true;
        mThread = new Thread(this);
    }

    private float mScreenWidth, mScreenHeight;

    public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {
        mScreenWidth = width;
        mScreenHeight = height;
        mThread.start();
    }

    public void surfaceDestroyed(SurfaceHolder holder) {
        mIsAttached = false;
        while( mThread != null && mThread.isAlive());
        mThread = null;
    }

    /*描画メソッド*/
    public void run(){
        while (mIsAttached) {
            SurfaceHolder holder = getHolder();
            Canvas canvas = holder.lockCanvas();
            if(canvas != null) {
                canvas.drawColor(Color.WHITE);

                Path path = new Path();
                for (int i = 0; i < sakuraCount; i++) {
                    path.moveTo(sakura[i].Screen_vData[0][0], sakura[i].Screen_vData[0][1]);
                    path.quadTo(sakura[i].Screen_cData[0][0], sakura[i].Screen_cData[0][1], sakura[i].Screen_vData[1][0], sakura[i].Screen_vData[1][1]);
                    path.quadTo(sakura[i].Screen_cData[1][0], sakura[i].Screen_cData[1][1], sakura[i].Screen_vData[0][0], sakura[i].Screen_vData[0][1]);
                    canvas.drawPath(path, sakura[i].paint);
                }
                holder.unlockCanvasAndPost(canvas);
            }
        }
    }
}

Comments

[nakamura-]

回答ありがとうございます！
プログラムもありがとうございます。

カクカクせずに動かすことが出来ました！
SurfaceViewクラスでダブルバッファリングという機能が使えるんですね。
ありがとうございました！

Answer 2

Sakuraが描画更新の依頼を出しているのが原因だと思います。

CanvasViewが定期的に描画更新をすべきだと思います。

Comments

[nakamura-]

回答ありがとうございます。

申し訳ないのですが、
なぜSakuraクラスからではなくCanvasViewクラスから描画更新をすべきなのでしょうか？