简介:
简单的使用 ValueAnimator, ObjectAnimator, and interpolators控制一个形状在屏幕上面移动。
视频 观看地址:https://www.youtube.com/watch?v=vCTcmPIKgpM
代码:
public class Bouncer extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bouncer);
}
/**
* A custom view is used to paint the green background and the shape.
*/
static class MyView extends View {
Bitmap mBitmap;
Paint paint = new Paint();
int mShapeX, mShapeY;
int mShapeW, mShapeH;
public MyView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
setupShape();
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
setupShape();
}
public MyView(Context context) {
super(context);
setupShape();
}
private void setupShape() {
mBitmap = BitmapFactory.decodeResource(getResources(),
R.drawable.electricsheep);
mShapeW = mBitmap.getWidth();
mShapeH = mBitmap.getHeight();
setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startAnimation();
}
});
}
/**
* Moving the shape in x or y causes an invalidation of the area it used to occupy
* plus the area it now occupies.
*/
public void setShapeX(int shapeX) {
int minX = mShapeX;
int maxX = mShapeX + mShapeW;
mShapeX = shapeX;
minX = Math.min(mShapeX, minX);
maxX = Math.max(mShapeX + mShapeW, maxX);
invalidate(minX, mShapeY, maxX, mShapeY + mShapeH);
}
/**
* Moving the shape in x or y causes an invalidation of the area it used to occupy
* plus the area it now occupies.
*/
public void setShapeY(int shapeY) {
int minY = mShapeY;
int maxY = mShapeY + mShapeH;
mShapeY = shapeY;
minY = Math.min(mShapeY, minY);
maxY = Math.max(mShapeY + mShapeH, maxY);
invalidate(mShapeX, minY, mShapeX + mShapeW, maxY);
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
mShapeX = (w - mBitmap.getWidth()) / 2;
mShapeY = 0;
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(mBitmap, mShapeX, mShapeY, paint);
System.out.println("setShapeY Bouncer1 "+mShapeX+" "+mShapeY);
}
void startAnimation() {
// This version uses ValueAnimator, which requires adding an update
// listener and manually updating the shape position on each frame.
ValueAnimator anim = getValueAnimator();
anim.start();
}
ValueAnimator getValueAnimator() {
ValueAnimator anim = ValueAnimator.ofFloat(0, 1);
anim.addUpdateListener(new AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
setShapeY((int) (animation.getAnimatedFraction() *
(getHeight() - mShapeH)));
}
});
return anim;
}
}
}
/**
* See the comments in Bouncer for the overall functionality of this app. Changes for this
* variation are down in the animation setup code.
*/
public class Bouncer1 extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bouncer1);
}
static class MyView extends View {
Bitmap mBitmap;
Paint paint = new Paint();
int mShapeX, mShapeY;
int mShapeW, mShapeH;
public MyView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
setupShape();
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
setupShape();
}
public MyView(Context context) {
super(context);
setupShape();
}
public void setShapeX(int shapeX) {
int minX = mShapeX;
int maxX = mShapeX + mShapeW;
mShapeX = shapeX;
minX = Math.min(mShapeX, minX);
maxX = Math.max(mShapeX + mShapeW, maxX);
invalidate(minX, mShapeY, maxX, mShapeY + mShapeH);
}
public void setShapeY(int shapeY) {
int minY = mShapeY;
int maxY = mShapeY + mShapeH;
mShapeY = shapeY;
minY = Math.min(mShapeY, minY);
maxY = Math.max(mShapeY + mShapeH, maxY);
invalidate(mShapeX, minY, mShapeX + mShapeW, maxY);
}
private void setupShape() {
mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.electricsheep);
mShapeW = mBitmap.getWidth();
mShapeH = mBitmap.getHeight();
setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startAnimation();
}
});
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
mShapeX = (w - mBitmap.getWidth()) / 2;
mShapeY = 0;
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(mBitmap, mShapeX, mShapeY, paint);
}
void startAnimation() {
ValueAnimator anim = getValueAnimator();
// In this variation, we put the shape into an infinite bounce, where it keeps moving
// up and down. Note that it's still not actually "bouncing" because it just uses
// default time interpolation.
anim.setRepeatCount(ValueAnimator.INFINITE);
anim.setRepeatMode(ValueAnimator.REVERSE);
anim.start();
}
ValueAnimator getValueAnimator() {
ValueAnimator anim = ValueAnimator.ofFloat(0, 1);
anim.addUpdateListener(new AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
setShapeY((int) (animation.getAnimatedFraction() * (getHeight() - mShapeH)));
}
});
return anim;
}
}
}
/**
* See the comments in Bouncer for the overall functionality of this app. Changes for this
* variation are down in the animation setup code.
*/
public class Bouncer2 extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bouncer2);
}
static class MyView extends View {
Bitmap mBitmap;
Paint paint = new Paint();
int mShapeX, mShapeY;
int mShapeW, mShapeH;
public MyView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
setupShape();
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
setupShape();
}
public MyView(Context context) {
super(context);
setupShape();
}
public void setShapeX(int shapeX) {
int minX = mShapeX;
int maxX = mShapeX + mShapeW;
mShapeX = shapeX;
minX = Math.min(mShapeX, minX);
maxX = Math.max(mShapeX + mShapeW, maxX);
invalidate(minX, mShapeY, maxX, mShapeY + mShapeH);
}
public void setShapeY(int shapeY) {
System.out.println("setShapeY Bouncer2 "+shapeY);
int minY = mShapeY;
int maxY = mShapeY + mShapeH;
mShapeY = shapeY;
minY = Math.min(mShapeY, minY);
maxY = Math.max(mShapeY + mShapeH, maxY);
invalidate(mShapeX, minY, mShapeX + mShapeW, maxY);
}
private void setupShape() {
mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.electricsheep);
mShapeW = mBitmap.getWidth();
mShapeH = mBitmap.getHeight();
setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startAnimation();
}
});
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
mShapeX = (w - mBitmap.getWidth()) / 2;
mShapeY = 0;
}
@Override
protected void onDraw(Canvas canvas) {
canvas.drawBitmap(mBitmap, mShapeX, mShapeY, paint);
}
void startAnimation() {
ValueAnimator anim = getValueAnimator();
anim.setRepeatCount(ValueAnimator.INFINITE);
anim.setRepeatMode(ValueAnimator.REVERSE);
// This variation finally has the shape bouncing, due to the use of an
// AccelerateInterpolator, which speeds up as the animation proceed. Note that
// when the animation reverses, the interpolator acts in reverse, decelerating
// movement.
anim.setInterpolator(new AccelerateInterpolator());
anim.start();
}
ValueAnimator getValueAnimator() {
ValueAnimator anim = ValueAnimator.ofFloat(0, 1);
anim.addUpdateListener(new AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
setShapeY((int) (animation.getAnimatedFraction() * (getHeight() - mShapeH)));
}
});
return anim;
}
}
}
/**
* See the comments in Bouncer for the overall functionality of this app. Changes for this
* variation are down in the animation setup code.
*/
public class Bouncer3 extends Activity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_bouncer3);
}
static class MyView extends View {
Bitmap mBitmap;
Paint paint = new Paint();
int mShapeX, mShapeY;
int mShapeW, mShapeH;
public MyView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
setupShape();
}
public MyView(Context context, AttributeSet attrs) {
super(context, attrs);
setupShape();
}
public MyView(Context context) {
super(context);
setupShape();
}
private void setupShape() {
mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.electricsheep);
mShapeW = mBitmap.getWidth();
mShapeH = mBitmap.getHeight();
setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startAnimation();
}
});
}
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
mShapeX = (w - mBitmap.getWidth()) / 2;
mShapeY = 0;
}
@Override
protected void onDraw(Canvas canvas) {
// System.out.println();
System.out.println("setShapeY Bouncer3 "+mShapeX+" "+mShapeY);
canvas.drawBitmap(mBitmap, mShapeX, mShapeY, paint);
}
void startAnimation() {
// This variation uses an ObjectAnimator. The functionality is exactly the same as
// in Bouncer2, but this time the boilerplate code is greatly reduced because we
// tell ObjectAnimator to automatically animate the target object for us, so we no
// longer need to listen for frame updates and do that work ourselves.
ObjectAnimator anim = getObjectAnimator();
anim.setRepeatCount(ValueAnimator.INFINITE);
anim.setRepeatMode(ValueAnimator.REVERSE);
anim.setInterpolator(new AccelerateInterpolator());
anim.start();
}
ObjectAnimator getObjectAnimator() {
return ObjectAnimator.ofInt(this, "shapeY", 0, (getHeight() - mShapeH));
}
}
}
Bouncer1 的截图:
参考:
http://blog.csdn.net/dblackde/article/details/12316817