自定义View的画圆加速减速

来源：互联网发布：离岸金融中心知乎编辑：程序博客网时间：2024/06/11 14:47

MainActivity

package com.bwei.cpm;

import android.graphics.Color;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    private Button change;
    private Button up;
    private Button down;
    private CustomView myview;
    private boolean isFly = true;
    private int index = 10;
    private Handler handler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);

            switch (msg.what) {

                case 0: {
                    myview.invalidate();
                }
                break;
                case 1: {
                    myview.invalidate();

                }
                break;
            }

        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        initView();
        //剪头开始移动
        startFly(isFly);
    }

    private void startFly(final boolean isFly) {

        new Thread(new Runnable() {
            @Override
            public void run() {

                try {
                    while (isFly) {
                        if (index > 0) {
                            Thread.sleep(index);
                            handler.sendEmptyMessage(0);
                        } else {
                            Thread.sleep(10);
                            handler.sendEmptyMessage(1);
                        }
                    }
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }

            }
        }).start();

    }

    private void initView() {
        change = (Button) findViewById(R.id.change);
        up = (Button) findViewById(R.id.up);
        down = (Button) findViewById(R.id.down);
        myview = (CustomView) findViewById(R.id.myview);

        change.setOnClickListener(this);
        up.setOnClickListener(this);
        down.setOnClickListener(this);
        myview.setColor(Color.BLACK);
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.change:
                myview.setColor(Color.RED);
                break;
            case R.id.up:
                index = index - 10;
                if (index <= 0) {

Toast.makeText(MainActivity.this, "闪电般：" + index, Toast.LENGTH_SHORT).show();

  //加速到一定程度进行跳转页面   Intent intent=new Intent(MainActivity.this,ShowActivity.class);    startActivity(intent);

                }
                break;
            case R.id.down:
                index = index + 10;
                break;
        }
    }
}

CustomView

package com.bwei.cpm;

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PathMeasure;
import android.util.AttributeSet;
import android.view.View;

/**
* 1. 类的用途
* 2. @author forever
* 3. @date 2017/9/4 13:52
*/

public class CustomView extends View {
    //定义几个必要的变量
    private float currentValue = 0;     // 用于纪录当前的位置,取值范围[0,1]映射Path的整个长度
    private float[] pos;                // 当前点的实际位置
    private float[] tan;                // 当前点的tangent值,用于计算图片所需旋转的角度
    private Bitmap mBitmap;             // 箭头图片
    private Matrix mMatrix;             // 矩阵,用于对图片进行一些操作

    private int color;
    private Paint paint;
    private Paint mPaint;

    public CustomView(Context context) {
        super(context);
        init(context);

    }

    public CustomView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context);

    }

    public CustomView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
        TypedArray typedArray = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CustomView, defStyleAttr, 0);

        int indexCount = typedArray.getIndexCount();

        for (int i = 0; i < indexCount; i++) {
            int attr = typedArray.getIndex(i);
            switch (attr) {

                case R.styleable.CustomView_viewColor:
                    // 默认颜色设置,黑色
                    color = typedArray.getColor(attr, Color.BLACK);
                    break;

            }
        }

        typedArray.recycle();

        mPaint = new Paint();
        mPaint.setColor(color);
    }

    // 初始化这些变量(在构造函数中调用这个方法):
    private void init(Context context) {
        pos = new float[2];
        tan = new float[2];
        BitmapFactory.Options options = new BitmapFactory.Options();
        options.inSampleSize = 6;       // 缩放图片
        mBitmap = BitmapFactory.decodeResource(context.getResources(), R.drawable.jiantou2, options);
        mMatrix = new Matrix();
    }
    //具体绘制:
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        paint = new Paint();
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(5);
        paint.setColor(color);

        canvas.translate(100, 100);      // 平移坐标系，改变坐标值，可改变位置大小
        Path path = new Path();                                 // 创建 Path
        path.addCircle(200, 200, 200, Path.Direction.CW);           // 添加一个圆形

        PathMeasure measure = new PathMeasure(path, false);     // 创建 PathMeasure
        currentValue += 0.005;                                  // 计算当前的位置在总长度上的比例[0,1]
        if (currentValue >= 1) {
            currentValue = 0;
        }
        //这个方法是用于得到路径上某一长度的位置以及该位置的正切值：
        measure.getPosTan(measure.getLength() * currentValue, pos, tan);        // 获取当前位置的坐标以及趋势

        mMatrix.reset();                                                        // 重置Matrix
        float degrees = (float) (Math.atan2(tan[1], tan[0]) * 180.0 / Math.PI); // 计算图片旋转角度

        mMatrix.postRotate(degrees, mBitmap.getWidth() / 2, mBitmap.getHeight() / 2);   // 旋转图片

        mMatrix.postTranslate(pos[0] - mBitmap.getWidth() / 2, pos[1] - mBitmap.getHeight() / 2);   // 将图片绘制中心调整到与当前点重合

        canvas.drawPath(path, paint);                                   // 绘制 Path
        canvas.drawBitmap(mBitmap, mMatrix, paint);                     // 绘制箭头
        invalidate();                                                           // 重绘页面
    }

    //改变颜色
    public void setColor(int red) {
        color = red;
    }
}

drawable里添加图片

jiantou

在Values中创建attrs.xml文件

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <declare-styleable name="CustomView">
        <attr name="viewColor" format="color" />

    </declare-styleable>

</resources>

Layout布局

activity—main.xml

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    >

    <Button
        android:id="@+id/change"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="改变颜色"
        />
    <Button
        android:id="@+id/up"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="加速"
        />

    <Button
        android:id="@+id/down"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="减速"
        tools:layout_editor_absoluteY="0dp"
        tools:layout_editor_absoluteX="8dp" />

    <com.bwei.cpm.CustomView
        android:id="@+id/myview"
        android:layout_width="400dp"
        android:layout_height="400dp"
        app:viewColor="@android:color/black"
        tools:layout_editor_absoluteY="0dp"
        tools:layout_editor_absoluteX="0dp" />
</LinearLayout>

阅读全文

0 0