安卓智能手表自定表盘-写一个属于自己的表盘

今天 给大家讲了如何去创建一个AndroidWear模拟器

参考这篇文章

AndroidWear开发创建模拟器

今天六一儿童节，如果你想做一款六一专属的表盘，怎么实现呢？

表盘如何切换

在android wear里，表盘是如何切换的？

用下来给大家表演一下

创建表盘

其实表盘是一个服务来的哦！

创建服务

第一步，我们创建一个类SOBhWatchFace，继承自CanvasWatchFaceService，看到Service，你应该知道这是一个服务了。

package com.sunofbeaches.simplewatchface;


public class SOBhWatchFace extends CanvasWatchFaceService {

}

覆写onCreateEngine方法

public class SOBhWatchFace extends CanvasWatchFaceService {


    @Override
    public CanvasWatchFaceService.Engine onCreateEngine() {
        return new SobWatchFaceEngine(this);
    }
}

这里我们返回一个我们自己定义的SobWatchFaceEngine

也不是接下来定义的SobWatchFaceEngine

定义一个Engine

 private class SobWatchFaceEngine extends CanvasWatchFaceService.Engine {
	....
｝

整个Engine的代码：

 private class SobWatchFaceEngine extends CanvasWatchFaceService.Engine {

        private static final String TAG = "SobWatchFaceEngine";
        private Context mContext;
        private int mInnerCircleRadius;


        public SobWatchFaceEngine(Context context) {
            this.mContext = context;
            mInnerCircleRadius = SizeUtils.dip2px(mContext,3);
        }

        private Calendar mCalendar;

        private Handler mHandler = new Handler();


        private boolean isUpdate = false;

        @Override
        public void onAmbientModeChanged(boolean inAmbientMode) {
            super.onAmbientModeChanged(inAmbientMode);
            //TODO:
        }

        @Override
        public void onCreate(SurfaceHolder holder) {
            super.onCreate(holder);
            //拿到日历实例
            mCalendar = Calendar.getInstance();
            //设置时区
            mCalendar.setTimeZone(TimeZone.getDefault());
            //做得好一点，需要去监听时区变化的广播
            //更新时区
            //创建画笔
            initPaints();
            isUpdate = true;
            mHandler.post(mTask);
        }

        private Runnable mTask = new Runnable() {
            @Override
            public void run() {
                if(isUpdate) {
                    invalidate();
                    mHandler.postDelayed(this,1000);
                }
            }
        };

        private Paint mSecondPaint;
        private Paint mMinPaint;
        private Paint mHourPaint;
        private Paint mScalePaint;

        /**
         * 创建相关画笔
         */
        private void initPaints() {
            //秒针
            mSecondPaint = new Paint();
            mSecondPaint.setColor(getColor(R.color.secondDefaultColor));
            mSecondPaint.setStyle(Paint.Style.STROKE);
            mSecondPaint.setStrokeCap(Paint.Cap.ROUND);
            mSecondPaint.setStrokeWidth(SizeUtils.dip2px(mContext,1));
            mSecondPaint.setAntiAlias(true);
            //分针
            mMinPaint = new Paint();
            mMinPaint.setColor(getColor(R.color.minDefaultColor));
            mMinPaint.setStyle(Paint.Style.STROKE);
            mMinPaint.setStrokeWidth(SizeUtils.dip2px(mContext,2));
            mMinPaint.setStrokeCap(Paint.Cap.ROUND);
            mMinPaint.setAntiAlias(true);
            //时针
            mHourPaint = new Paint();
            mHourPaint.setColor(getColor(R.color.hourDefaultColor));
            mHourPaint.setStyle(Paint.Style.STROKE);
            mHourPaint.setStrokeWidth(SizeUtils.dip2px(mContext,3));
            mHourPaint.setStrokeCap(Paint.Cap.ROUND);
            mHourPaint.setAntiAlias(true);
            //
            mScalePaint = new Paint();
            mScalePaint.setColor(getColor(R.color.scaleDefaultColor));
            mScalePaint.setStyle(Paint.Style.STROKE);
            mScalePaint.setStrokeCap(Paint.Cap.ROUND);
            mScalePaint.setStrokeWidth(SizeUtils.dip2px(mContext,2));
            mScalePaint.setAntiAlias(true);
        }

        @Override
        public void onDestroy() {
            super.onDestroy();
            isUpdate = false;
            mHandler.removeCallbacks(mTask);
            mTask = null;
            mHandler = null;
            mSecondPaint = null;
            mMinPaint = null;
            mHourPaint = null;
            mScalePaint = null;
        }

        @Override
        public void onDraw(Canvas canvas,Rect bounds) {
            long currentMillis = System.currentTimeMillis();
            mCalendar.setTimeInMillis(currentMillis);
            //绘制背景
            canvas.drawColor(Color.parseColor("#000000"));
            //绘制刻度
            drawScale(canvas,bounds);
            int secondValue = mCalendar.get(Calendar.SECOND);
            if(secondValue == 0) {
                //秒针
                drawSecondLine(canvas,bounds.centerX());
                //分针
                drawMinLine(canvas,bounds.centerX());
                //时针
                drawHourLine(canvas,bounds.centerX());
            } else {
                //时针
                drawHourLine(canvas,bounds.centerX());
                //分针
                drawMinLine(canvas,bounds.centerX());
                //秒针
                drawSecondLine(canvas,bounds.centerX());
            }
        }

        private void drawSecondLine(Canvas canvas,int radius) {
            canvas.save();
            //旋转
            int secondRadius = (int) (radius * 0.8f);
            int secondValue = mCalendar.get(Calendar.SECOND);
            float secondRotate = secondValue * 6f;
            canvas.rotate(secondRotate,radius,radius);
            canvas.drawLine(radius,radius - secondRadius,radius,
                    radius - mInnerCircleRadius - SizeUtils.dip2px(mContext,1),mSecondPaint);
            canvas.restore();
        }

        private void drawMinLine(Canvas canvas,int radius) {
            canvas.save();
            int miniRadius = (int) (radius * 0.75f);
            int minValue = mCalendar.get(Calendar.MINUTE);
            Log.d(TAG,"minValue  == > " + minValue);
            float minRotate = minValue * 6f;
            canvas.rotate(minRotate,radius,radius);
            canvas.drawLine(radius,radius - miniRadius,radius,
                    radius - mInnerCircleRadius - SizeUtils.dip2px(mContext,1),mMinPaint);
            canvas.restore();
        }

        private void drawHourLine(Canvas canvas,int radius) {
            //时针
            int hourRadius = (int) (radius * 0.8f);
            int hourValue = mCalendar.get(Calendar.HOUR);
            Log.d(TAG,"hourValue == > " + hourValue);
            float hourOffsetRotate = mCalendar.get(Calendar.MINUTE) / 2f;
            float hourRotate = hourValue * 30 + hourOffsetRotate;
            Log.d(TAG,"hourRotate ==> " + hourRotate);
            //求旋转角度
            canvas.save();
            canvas.rotate(hourRotate,radius,radius);
            canvas.drawLine(radius,radius - hourRadius,radius,
                    radius - mInnerCircleRadius - SizeUtils.dip2px(mContext,1),mHourPaint);
            canvas.restore();
        }


        private void drawScale(Canvas canvas,Rect bounds) {
            //半径
            int radius = bounds.centerX();
            //内环半径
            int innerC = (int) (bounds.centerX() * 0.85f);
            //外环半径
            int outerC = (int) (bounds.centerX() * 0.95f);
            //绘制刻度的方法一
            //for(int i = 0; i < 12; i++) {
            //    double th = i * Math.PI * 2 / 12;
            //    //内环
            //    int innerB = (int) (Math.cos(th) * innerC);
            //    int innerX = mHeight / 2 - innerB;
            //    int innerA = (int) (innerC * Math.sin(th));
            //    int innerY = mWidth / 2 + innerA;
            //    //外环
            //    int outerB = (int) (Math.cos(th) * outerC);
            //    int outerX = mHeight / 2 - outerB;
            //    int outerA = (int) (outerC * Math.sin(th));
            //    int outerY = mWidth / 2 + outerA;
            //    canvas.drawLine(innerX,innerY,outerX,outerY,mScalePaint);
            //}
            //绘制刻度的方法二
            canvas.drawCircle(radius,radius,mInnerCircleRadius,mScalePaint);
            canvas.save();
            for(int i = 0; i < 12; i++) {
                canvas.drawLine(radius,radius - outerC,radius,radius - innerC,mScalePaint);
                canvas.rotate(30,radius,radius);
            }
            canvas.restore();
        }
    }

相关资料

做一个表盘就是这么简单

同学们可以参考一下官方的文档

Android开发者