自定义View，绘制自己的手表Demo

来源：互联网发布：js urlencode转码编辑：程序博客网时间：2024/04/30 13:48

直接上代码就一个类BoardView

public class BoardView extends View {    private final static String TAG = BoardView.class.getSimpleName();    private final int defValue = 500; //默认宽高 正方形 因为画一个圆盘    private int widthValue;    private Paint mPaint1 = new Paint();    private Paint mPaint2 = new Paint();    private Paint mPaint3 = new Paint();    private Path mPath1 = new Path();    private Path mPath2 = new Path();    private Path mPath3 = new Path();    private float y;    private float mDeg1 = 0f;    private float mDeg2 = 0f;    private float mDeg3 = 0f;    private float mC2r;    private String date = "00";  //默认日期显示    private Handler mHandler = new Handler();    private boolean isRun = false;    public BoardView(Context context) {        this(context, null);        init();    }    public BoardView(Context context, AttributeSet attrs) {        this(context, attrs, 0);        init();    }    public BoardView(Context context, AttributeSet attrs, int defStyleAttr) {        super(context, attrs, defStyleAttr);        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.boardView, defStyleAttr, 0);        widthValue = typedArray.getDimensionPixelSize(R.styleable.boardView_viewWidth, defValue);        typedArray.recycle();        init();    }    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        setMeasuredDimension(widthValue, widthValue); //宽高一样        Log.i(TAG, "onMeasure: widthValue===" + widthValue);    }    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        drawC1orC2(canvas);        drawLogo(canvas);        drawDate(canvas);        drawGraduation(canvas);        drawPointer(canvas);    }    /**     * 绘制logo     * @param canvas     */    private void drawLogo(Canvas canvas){        canvas.save();        String logo = new String("Gladster");        mPaint2.setTextAlign(Paint.Align.CENTER);        mPaint2.setTextSize(18f);        canvas.drawText(logo,getCenter(),getCenter()/2,mPaint2);        canvas.restore();    }    /**     * 绘制日期  日     * @param canvas     */    private void drawDate(Canvas canvas){        canvas.save();        mPaint1.setTextAlign(Paint.Align.CENTER);        mPaint1.setTextSize(18f);        canvas.drawText(date,getCenter()+getCenter()/2,getCenter(),mPaint1);        canvas.restore();    }    /**     * 绘制大外环 和 小内环     *     * @param canvas     */    private void drawC1orC2(Canvas canvas) {        canvas.save();        y = widthValue / 2 + widthValue / 4;        mC2r = getCenter() / 2 - 50;        canvas.drawCircle(getCenter(), getCenter(), getCenter() - 4, mPaint1);        canvas.drawCircle(getCenter(), y, mC2r, mPaint2);        canvas.restore();    }    /**     * 初始化画 外圈黑内圈的画笔     */    private void init() {        Log.i(TAG, "init: start");        mPaint1.setStyle(Paint.Style.STROKE);        mPaint1.setAntiAlias(true);        mPaint1.setDither(true);        mPaint1.setColor(Color.BLACK);        mPaint1.setStrokeWidth(4f);        mPaint2.setStyle(Paint.Style.STROKE);        mPaint2.setColor(Color.GRAY);        mPaint2.setAntiAlias(true);        mPaint2.setDither(true);        mPaint2.setStrokeWidth(2f);        mPaint3.setStyle(Paint.Style.FILL);        mPaint3.setColor(Color.YELLOW);        mPaint3.setAntiAlias(true);        mPaint3.setDither(true);        mPaint3.setStrokeWidth(4f);    }    /**     * 绘制时针 分针 秒针     *     * @param canvas     */    private void drawPointer(Canvas canvas) {        canvas.save();        canvas.rotate(mDeg3, getCenter(), y);        canvas.drawLine(getCenter(), y - mC2r + 10, getCenter(), y, mPaint3);        canvas.drawPath(mPath3, mPaint3);        canvas.drawPoint(getCenter(), y, mPaint1);        canvas.restore();        canvas.save();        mPath2.moveTo(getCenter(), getCenter());        mPath2.lineTo(getCenter() + 6, getCenter() + 6);        mPath2.lineTo(getCenter(), 80);        mPath2.lineTo(getCenter() - 6, getCenter() + 6);        mPath2.lineTo(getCenter(), getCenter());        mPath2.close();        canvas.rotate(mDeg2, getCenter(), getCenter());        canvas.drawPath(mPath2, mPaint3);        canvas.restore();        canvas.save();        mPath1.moveTo(getCenter(), getCenter());        mPath1.lineTo(getCenter() + 3, getCenter() + 3);        mPath1.lineTo(getCenter(), 20);        mPath1.lineTo(getCenter() - 3, getCenter() + 3);        mPath1.lineTo(getCenter(), getCenter());        mPath1.close();        canvas.rotate(mDeg1, getCenter(), getCenter());        canvas.drawPath(mPath1, mPaint3);        canvas.drawPoint(getCenter(), getCenter(), mPaint1);        canvas.restore();    }    /**     * 绘制外表盘的刻度和小表盘的刻度     *     * @param canvas     */    private void drawGraduation(Canvas canvas) {        canvas.save();        float shorLine = 7;        float longLine = 12;        for (int i = 0; i < 60; i++) {            if (i % 5 == 0) {                canvas.drawLine(getCenter(), shorLine, getCenter(), longLine + 3, mPaint1);            } else {                canvas.drawLine(getCenter(), shorLine, getCenter(), longLine, mPaint1);            }            canvas.rotate(6, getCenter(), getCenter());        }        for (int i = 0; i < 60; i++) {            if (i % 5 == 0) {                canvas.drawLine(getCenter(), y - (getCenter() / 2 - 53), getCenter(), y - (getCenter() / 2 - 58), mPaint2);            } else {                canvas.drawLine(getCenter(), y - (getCenter() / 2 - 53), getCenter(), y - (getCenter() / 2 - 55), mPaint2);            }            canvas.rotate(6, getCenter(), y);        }        canvas.restore();    }    /**     * 更新指针角度     */    private void runTime() {        mHandler.postDelayed(new Runnable() {            @Override            public void run() {                if(!isRun){                    return;                }                long time = System.currentTimeMillis();                Calendar calendar = Calendar.getInstance();                calendar.setTimeInMillis(time);                int hour = calendar.get(Calendar.HOUR);                int minute = calendar.get(Calendar.MINUTE);                int second = calendar.get(Calendar.SECOND);                date = calendar.get(Calendar.DAY_OF_MONTH)+"";                mDeg3 = second * 360f / 60;                mDeg1 = minute * 360 / 60;                mDeg2 = hour * 360 / 12;                invalidate();                runTime();            }        }, 1000);    }    //开始 启动 提供的接口    public void start() {        if(isRun){            return;        }        isRun = true;        runTime();    }    //停止    public void stop(){        isRun = false;    }    /**     * 获得中心原点     *     * @return     */    private float getCenter() {        return widthValue / 2;    }}

arrts.xml文件

<declare-styleable name="boardView">    <attr name="viewWidth" format="dimension"/></declare-styleable>
main.xml 文件
<com.android.zhiweizhu.mywatchdemo.BoardView    android:id="@+id/db"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_centerInParent="true"    db:viewWidth="300dp"    /><Button    android:id="@+id/btn1"    android:text="@string/start"    android:layout_alignParentBottom="true"    android:layout_width="wrap_content"    android:layout_height="wrap_content"/><Button    android:id="@+id/btn2"    android:text="@string/stop"    android:layout_alignParentBottom="true"    android:layout_alignParentRight="true"    android:layout_width="wrap_content"    android:layout_height="wrap_content"/>

最后MainActivity 
public class MainActivity extends AppCompatActivity implements View.OnClickListener {    private BoardView mBoardView;    private Button mButton1;    private Button mButton2;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        initViews();    }    private void initViews() {        mBoardView = (BoardView) findViewById(R.id.db);        mButton1 = (Button) findViewById(R.id.btn1);        mButton1.setOnClickListener(this);        mButton2 = (Button) findViewById(R.id.btn2);        mButton2.setOnClickListener(this);    }    @Override    public void onClick(View v) {        switch (v.getId()){            case R.id.btn1:                mBoardView.start();                break;            case R.id.btn2:                mBoardView.stop();                break;            default:                break;        }    }}
完成 收工！！！！

1 0