自定義view初學習（仿小米鬧鐘）

  我是第一次打自定義view相關代碼，說錯了大家請多多包涵

  首先前導知識是自定義view創建時候要重寫的方法onMeasure確定相當於父容器當前自定義view的位置

                          onDraw  用Canvas、曲線、直線來畫出自定義view，tips：其他地方通過invaliate再調用onDraw

                          onSizeChanged 用來定義View大小

  首先放一下效果

第一步做的肯定是初始化畫筆以及Canvas對象，在java中大家應該實踐了很多

 private Canvas mCanvas;//整個view畫布
    private Paint mTextPaint;//畫出錶盤上的數字畫筆
    private Rect mTextRect = new Rect();//測量表盤上文本寬高的矩形
    private Paint mCirclePaint;//畫出小時圓圈畫筆
    private  float mCircleStrokeWidth=4;//時鐘圓圈的線條寬度
    private RectF mCircleRectF = new RectF();

    private int mLightColor;//亮顏色，用於分鐘
    private int mDarkColor;//暗顏色，用於時針等等
    private int mBackgroundColor;//背景顏色
    /* 小時文本字體大小 */
    private float mTextSize;

    /* 時鐘半徑，不包括padding值 */
    private float mRadius;
    /* 刻度線長度 */
    private float mScaleLength;

    /* 時針角度 */
    private float mHourDegree;
    /* 分針角度 */
    private float mMinuteDegree;
    /* 秒針角度 */
    private float mSecondDegree;
    /* 時針畫筆 */
    private Paint mHourHandPaint;
    /* 分針畫筆 */
    private Paint mMinuteHandPaint;
    /* 秒針畫筆 */
    private Paint mSecondHandPaint;
    /* 時針路徑 */
    private Path mHourHandPath = new Path();
    /* 分針路徑 */
    private Path mMinuteHandPath = new Path();
    /* 秒針路徑 */
    private Path mSecondHandPath = new Path();

    /* 加一個默認的padding值，爲了防止用camera旋轉時鐘時造成四周超出view大小 */
    private float mDefaultPadding;
    private float mPaddingLeft;
    private float mPaddingTop;
    private float mPaddingRight;
    private float mPaddingBottom;

    /* 梯度掃描漸變 */
    private SweepGradient mSweepGradient;
    /* 漸變矩陣，作用在SweepGradient */
    private Matrix mGradientMatrix;

    /* 指針的在x軸的位移 */
    private float mCanvasTranslateX;
    /* 指針的在y軸的位移 */
    private float mCanvasTranslateY;
    /* 指針的最大位移 */
    private float mMaxCanvasTranslate;

    /* 刻度圓弧畫筆 */
    private Paint mScaleArcPaint;
    /* 刻度圓弧的外接矩形 */
    private RectF mScaleArcRectF = new RectF();
    /* 刻度線畫筆 */
    private Paint mScaleLinePaint;

第二步處理onMeasure，這裏onMeasure有三個參數，可以參考https://www.jianshu.com/p/c84693096e41

        int defaultSize  = 800;
        int model = MeasureSpec.getMode(measureSpec);
        int size = MeasureSpec.getSize(measureSpec);
        switch (model){
            case MeasureSpec.EXACTLY:
                return size;
            case MeasureSpec.AT_MOST:
                return Math.min(size,defaultSize);
            case MeasureSpec.UNSPECIFIED:
                return defaultSize;
            default:
                return defaultSize;
        }
    

第三步是畫出圖形，這裏大致思想是畫出刻度線、時針、分鐘、刻度盤上的數字以及轉過位置的漸變效果

這裏詳細的都是數學相關的曲線弧度的，可以看我的代碼https://github.com/whiteyen/ViewPractice

需要注意的地方以及知識點總結  一、參數在xml的使用  二、measure的方式