図形を動かすには、OS3.0から導入された"Property Animation"という方法と、以前からある"View Animation"という方法がある。
Property Animationの方が汎用性が高く推奨される方法とのこと。
(http://developer.android.com/intl/ja/guide/topics/graphics/animation.html)
現在の端末は2.xが主流であるため、あまり使用されていないようだが、この記事の内容はProperty Animationについてである。
Property Animationでは、動きの描写は、ValueAnimatorオブジェクト、および、このオブジェクトに関するリスナーを使って記述される。
ValueAnimatorオブジェクト(android.animation.ValueAnimator)は、単にタイマー的な計算機であり、
「値Aから値BまでをT秒かけて変化していく」
という動作を基本とする。
この値の変化について、一定のスピードで変化するのか、あるいは後半加速するのかといった補間の仕方(InterPoletor)や、この動作を一度でやめるのか繰り返すのかなどといった、様々な設定を施すことができる。
ValueAnimatorの値の変化はAnimatorUpdateListener(android.animation.ValueAnimator.AnimatorUpdateListener)で感知することができる。
このクラスのonAnimationUpdateメソッドをオーバーライドしてinvalidateメソッドを実行することで、ValueAnimatorに連動して、適時onDrawを呼び出すことができる。
最後に、図形を描画するCanvas側では、図形の位置や大きさなどのプロパティをValueAnimatorの計算値から取得するようにする。
以下のコードは、円が画面上部から下方へ並行移動する。
import android.animation.ValueAnimator;
import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;
import android.animation.ValueAnimator.AnimatorUpdateListener;
public class CanvasSampleActivity extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
((LinearLayout) findViewById(R.id.container)).addView(new MyView(this));
}
public class MyView extends View implements AnimatorUpdateListener {
ValueAnimator anim = null;
public MyView(Context context) {
super(context);
anim = ValueAnimator.ofFloat(100f, 500f);
anim.setDuration(3000);
anim.addUpdateListener(this);
anim.start();
}
@Override
public void onAnimationUpdate(ValueAnimator anim) {
invalidate();
}
@Override
public void onDraw(Canvas canvas) {
Paint paint = new Paint();
paint.setColor(0xff0000ff);
paint.setStyle(Paint.Style.STROKE);
canvas.drawCircle(200f, (Float) anim.getAnimatedValue(), 50f, paint);
}
}
}
なお、R.layout.mainは以下のようになっている。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@+id/container"
android:background="#ffffffff">
</LinearLayout>
android:id="@+id/container"を定義している以外は、特に何もしていない。
0 件のコメント:
コメントを投稿