圆的变化（自定义动画，及自定义UI）

之前在面试的时候被问到过一个问题，如何实现一个圆沿着一条线由大到小

当时回答的含糊不清，现在已经明白怎么去实现

关键点：Paint，path，canvas

一种方法

在activity中去控制圆的x,y坐标点 还有圆的直径。

在activity中写一个Timer 定时器，定时去绘制这个圆view。

圆view继承自view ，将变化接口暴露出去即可，重写onDrow函数，根据x y 轴重绘

上代码吧

public class ChangedCirclerView extends View {
    private Paint mPaint;
    private int BALL_SIZE;

    //圆的坐标
    private int ballX;
    private int ballY;

    public ChangedCirclerView(Context context){
        super(context);
        initView();
    }

    public ChangedCirclerView (Context context,int mballX, int mballY){
        super(context);
        initView();
        ballX = mballX;
        ballY = mballY;
    }

    public ChangedCirclerView(Context context, AttributeSet attributeSet){
        super(context,attributeSet);
        initView();
    }

    private void initView(){
        mPaint = new Paint();
    }

    public void invalidateBall(int mBallX,int mBallY,int mBallRadiu) {
        ballX = mBallX;
        ballY = mBallY;
        BALL_SIZE = mBallRadiu;

        invalidate();
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
        super.onLayout(changed, left, top, right, bottom);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        mPaint.setColor(Color.rgb(255,215,0));
        mPaint.setAntiAlias(true);

        canvas.drawCircle(ballX,ballY,BALL_SIZE,mPaint);

    }
}

然后是acitivity  timer 控制代码

public class BallMoveActivity extends AppCompatActivity {
    private Context context;
    //小球初始的 X Y坐标点
    private int baseX = 20;
    private int baseY = 20;
    private int baseRadiu = 10;

    //定义球的两个方位速度
    private int xSpeed = 10;
    private int ySpeed = 30;
    private int radiuSpeed = 5;

    private int windowWidth ;
    private int windowHight ;

    private int ON_DRAW = 0;

    private ChangedCirclerView circlerView;

    private FrameLayout frameLayout;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        context = this;
        frameLayout = (FrameLayout) findViewById(R.id.activity_main);getWindowXY();
        getWindowXY();

        initTimer();
    }

    public void getWindowXY(){
        WindowManager windowManager = (WindowManager)getSystemService(Context.WINDOW_SERVICE);
        windowWidth = windowManager.getDefaultDisplay().getWidth();
        windowHight = windowManager.getDefaultDisplay().getHeight();
    }

    private void initTimer(){
        final Timer timer = new Timer();
        timer.schedule(new TimerTask() {
            @Override
            public void run() {
                baseX += xSpeed;
                baseY += ySpeed;
                baseRadiu += radiuSpeed;

                Log.v("xy==",String.valueOf(baseX)+"...."+baseY);

                Message message = new Message();
                message.what = ON_DRAW;
                handler.sendMessage(message);
            }
        },0,100);
    }

    public Handler handler = new Handler(){

        @Override
        public void handleMessage(Message msg) {
            if(msg.what == ON_DRAW){
                if(circlerView == null){
                    circlerView = new ChangedCirclerView(context,baseX,baseY);
                    frameLayout.addView(circlerView);
                }

                if(baseX > windowWidth || baseY >windowHight){
                    baseX = 20;
                    baseY = 20;
                    baseRadiu = 10;
                }

                circlerView.invalidateBall(baseX,baseY,baseRadiu);

            }
        }
    };

}

这样就能根据x y 轴控制圆的位置，还有直径控制圆的大小了

方法二

还有一种方法就是动画的方式

需要一个圆的图形，可以是自己的Drawable图片，也可以是自己绘制的

然后编写动画代码，translate动画，scale动画，这样就能定义一个圆从哪里到哪里，然后圆的大小怎么变化这样的需求