Android动画之⾃定义Evaluator实现弹球效果前⾔
今天给⼤家带来的是⾃定义Evaluator实现弹球效果,我们先给⼤家来个效果图。
下⾯我们介绍具体代码流程
1. ⾃定义Point类
public class Point {
private int radius;
public Point(int radius) {
this.radius = radius;
}
public int getRadius() {
return radius;
}
public void setRadius(int radius) {
this.radius = radius;
}
}
2. ⾃定义PointEvaluator实现TypeEvaluator接⼝
class PointEvaluator implements TypeEvaluator<Point> {
/**
* @param fraction 动画变化中的浮点参数,0-1
* @param startValue 动画开始时的Point对象
* @param endValue 动画结束时的Point对象
* @return动画过程中通过计算获取半径并返回⼀个新的Point对象
*/
@Override
public Point evaluate(float fraction, Point startValue, Point endValue) {
int startRadius = Radius();
int endRadius = Radius();
int newRadius = (int) (startRadius + fraction * (endRadius - startRadius));
return new Point(newRadius);
}
}
3. ⾃定义PointView
定义弹球属性attrs
<declare-styleable name="PointView">
<attr name="point_color"format="color" />
</declare-styleable>
获取⾃定义属性,这⾥我们只定义了⼀个弹球颜⾊属性。
private void initAttrs(Context context, AttributeSet attrs) {
TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.PointView);
mColor = Color(R.styleable.PointView_point_color, DEFAULT_COLOR);
}
初始化画笔
private void initPaint() {
mPaint = new Paint();
mPaint.setAntiAlias(true);
mPaint.setStyle(Paint.Style.FILL);
mPaint.setColor(mColor);
}
重写onMeasure⽅法
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
int widthMode = Mode(widthMeasureSpec);
int widthSize = Size(widthMeasureSpec);
int heightMode = Mode(heightMeasureSpec);
int heightSize = Size(heightMeasureSpec);
/**
* 测量view的宽⾼
*/
if (widthMode == MeasureSpec.AT_MOST) {
widthSize = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, DEFAULT_WIDTH, getResources().getDisplayMetrics()) + getPad }
if (heightMode == MeasureSpec.AT_MOST) {
heightSize = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, DEFAULT_HEIGHT, getResources().getDisplayMetrics()) + getP }
/**
* 使⽤setMeasureDimension⽅法确定view的最终宽和⾼
*/
setMeasuredDimension(widthSize, heightSize);
}
在onSizeChanged中获取view的最终宽度和⾼度
这⾥minValue是取宽度和⾼度中的较⼩值
@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
/**
* 在onSizeChanged重载⽅法中获取view的最终宽度和⾼度
*/
canvas动画
width = w;
height = h;
/**
* 使⽤width减去左右的padding
* 使⽤height减去上下的padding
* 并取两者中的最⼩值⽤来确定最⼤弹球的半径
*/
minValue = Math.min(width - getPaddingLeft() - getPaddingRight(), height - getPaddingTop() - getPaddingBottom());
}
接下来是动画的实现,使⽤ValueAnimator的ofObject()实现弹球动画
public void startAnimation() {
/**
* 使⽤ValueAnimator.ofObject()⽅法并使⽤⾃定义的Evaluator实现动画
*/
ValueAnimator animator = ValueAnimator.ofObject(new PointEvaluator(), new Point(0), new Point(minValue * 2 / 5));
animator.setDuration(2000);
/**
* 设置插值器为BounceInterpolator,其效果为:动画结束的时候弹起
*/
animator.setInterpolator(new BounceInterpolator());
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
/**
* 通过getAnimatedValue获取我们变化中的Point对象
*/
mPoint = (Point) AnimatedValue();
postInvalidate();
}
});
animator.start();
}
最后是在onDraw函数中绘制弹球
@Override
protected void onDraw(Canvas canvas) {
if (mPoint != null) {
canvas.drawCircle(width / 2, height / 2, Radius(), mPaint);
}
}
4. xml中的引⽤
<com.asiatravel.atpointview.view.PointView
android:id="@+id/third_point_view"
android:layout_width="150dp"
android:layout_height="200dp"
android:layout_below="@id/second_point_view"
android:layout_centerHorizontal="true"
android:layout_marginTop="10dp"
android:background="@color/colorPrimary"
app:point_color="#0ff" />
5. 动画实现
在代码中获取PointView的实例然后调⽤startAnimation()⽅法实现弹球动画 MainActivity.java
public class MainActivity extends AppCompatActivity {
private PointView pointView;
private PointView secondPointView;
private PointView thirdPointView;
@Override
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.activity_main);
pointView = (PointView) findViewById(R.id.point_view);
secondPointView = (PointView) findViewById(R.id.second_point_view);
thirdPointView = (PointView) findViewById(R.id.third_point_view);
findViewById(R.id.animation_button).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
pointView.startAnimation();
secondPointView.startAnimation();
thirdPointView.startAnimation();
}
});
}
}
总结
以上就是关于今天⾃定义Evaluator的全部内容,不懂的童鞋可以留⾔或者发邮件,另外有需要源码的⼩伙伴可以去github下载,,希望⼤家多多star!
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论