自定義七天簽到View

github傳送車走你

https://github.com/guanhaoran/signin   

因為這個View 是我很早之前寫的,這些注釋也是我今天剛想往github上傳的時候 臨時加的  有的注釋可能不准確(畢竟寫了好長時間了)  但是我敢保證92%是對的  很尷尬   大家看的時候   不要全部相信注釋

首先這篇博客是為了讓對自定義View不是很熟悉的同學借鑒之用,希望路過的各位大佬勿噴,先看下GIF省着枯燥

 

 

首先這是一個純手寫的一個自定義View,包括動畫也全在里邊,代碼不是很復雜,可以去github下載下來看一眼,就一個繼承View的signin類

signin的4個屬性方法

1) setSignInEvent(List<String> data)  //添加數據

2) setsignInEvent()  //簽到自動加一天   ---帶動畫效果

3)setCurrent(int i)  //設置幾天是第一天簽到   如果是第一天  輸入 1  以此類推

4)setSignInClear   //清除簽到天數

 

 

 

說一下主要實現方法

1-控件大小發生改變調用如下方法

viewpadding 是將寫死的值 轉換成控件的padding值

textMarginTop 是將默認寫死的值轉換成  第一天,第二天......第七天. 轉換成距離六邊形的margin值

signInBallRaio 是根據控件高度 生成六邊形占據控件 的多少倍

signInRectHeight 在占據六邊形的 基礎上 在縮小多少倍   (其中的值 可以去代碼中看)

signInBgRectF 是填充屏幕的一天黑色矩形線

剩下的 都是一些計算值 可以去代碼中看  

 

@Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        viewPadding = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, DEF_PADDING, getResources().getDisplayMetrics());
        int textMarginTop = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, TEXT_MARGIN_TOP, getResources().getDisplayMetrics());

        viewWidth = w;
        viewHeight = h;

        signInBallRadio = (int) (viewHeight * SIGN_IN_BALL_SCALE / 2);
        signInRectHeight = (int) (signInBallRadio * SIGN_BG_RECT_SCALE);

        signInBgRectF = new RectF(0, viewHeight * SECTION_SCALE - signInBallRadio - signInRectHeight, viewWidth, viewHeight * SECTION_SCALE - signInBallRadio);

        circleY = (int) (signInBgRectF.top + signInRectHeight / 2);
        descY = (int) (viewHeight * SECTION_SCALE + textMarginTop);

        //計算各個點 圖形的位置
        calcucateCirclePoints(viewData);

    }

 

2-view的測量 

測量主要就是注意一下MeasureSpec.getMode()的這個方法,大家不要忘記寫了

具體用法可以百度一下  用法很簡單 ,下面代碼就屬於很通用的一個代碼

一定不要忘記還有個super,.onMeasure()這個方法

 @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int heightMode = MeasureSpec.getMode(heightMeasureSpec);
        int newHeight;
        //如果不是精准模式   就使用默認的高度      具體用法請百度 MeasureSpec.getMode()
        if (heightMode == MeasureSpec.AT_MOST || heightMode == MeasureSpec.UNSPECIFIED) {
            newHeight = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, DEF_HEIGHT, getResources().getDisplayMetrics());
            heightMeasureSpec = MeasureSpec.makeMeasureSpec(newHeight, MeasureSpec.EXACTLY);
        }

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

    }

 

3-一個字-畫

具體的用法全部中文注釋方便大家觀察 這里就不詳細介紹了 大家可以去代碼里看看(就幾行代碼  嘻嘻~~~)

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        //簽到橫線
        drawSignInBgRect(canvas);
        //black circle
//        drawSignInNormalCircle(canvas);
        //繪制正常的簽到六邊形
        drawSignInNormalSexangle(canvas);
        //選擇第幾天之前的矩形
        drawSignInPbRect(canvas);
        //繪制舊的矩形
        drawSignInPbOldRect(canvas);
        //select circle
//        drawSignInCheck(canvas);
        //選擇的六邊形
        drawSignInSexangle(canvas);
        //簽到之前的六邊形
        drawSignOldSignInSexangle(canvas);
        //繪制文字
        drawTextDesc(canvas);
        //繪制禮物圖標  如果不用  可以注釋掉
        drawBitmap(canvas);
    }

 

禮物圖標 部分方法塊

        //禮物圖標  使用方法 可以百度一下
        bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.img_signpage_gift);
//        bitmap = zoomImg(bitmap,CALCULATE_BITMAP_W_H,CALCULATE_BITMAP_W_H);
        srcBitmap = new Rect(0, 0, bitmap.getWidth(), bitmap.getHeight());

 

這個自定義簽到的View 最主要的代碼塊是在 onSizeChanged() 中的 calcucateCirclePoints(viewData) 這個方法

這個方法主要用於各個圖形和動畫的繪制路徑,這里邊才是最主要的 大家要自己看這個

感覺自己寫的亂遭的,初學view的同學不要向我學習,當時項目太緊  寫完我也就沒有整理 感覺很亂大家看一些自定義View的思路就好  我表示很痛苦  大家有哪里不懂得  歡迎來問我  妹子更歡迎  哈哈哈 

喜歡的給個喜歡唄 帥哥~~~