自定義View(3) -- 字母索引

效果圖:


字母索引

自定義view的流程,具體請(qǐng)點(diǎn)此查看:自定義view套路
我們先重寫構(gòu)造器,然后重寫onMeasure函數(shù)進(jìn)行測(cè)量設(shè)置寬高,在本例中,寬我是根據(jù)padding和測(cè)量一個(gè)字母w的寬度來設(shè)置的,高度就是默認(rèn)的,因?yàn)橐话闶窃O(shè)置為match_parent.

 public AlphabeticalIndexView(Context context) {
        this(context, null);
    }

    public AlphabeticalIndexView(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public AlphabeticalIndexView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int w = (int) (getPaddingLeft() + getPaddingRight() + DisplayUtil.getTextWidth("W", mPaint));
        int h = getMeasuredHeight();
        setMeasuredDimension(w, h);
    }


    private void init(Context context) {
        mPaint = new Paint();
        mPaint.setAntiAlias(true);
        mPaint.setTextSize(DisplayUtil.sp2px(context, 15));
    }

因?yàn)椴皇?code>viewGroup,所以不必重寫onLayout函數(shù),我們直接進(jìn)入onDraw

@Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        // 每個(gè)字母所占用的高度
        for (int i = 0; i < mLetters.length; i++) {
            String letter = mLetters[i];
            if (letter.equals(mCurrentTouchLetter))
                mPaint.setColor(Color.BLUE);
            else
                mPaint.setColor(Color.GRAY);

            // 獲取字體的寬度
            float measureTextWidth = mPaint.measureText(letter);
            // 獲取內(nèi)容的寬度
            int contentWidth = getWidth() - getPaddingLeft() - getPaddingRight();

            canvas.drawText(letter, getPaddingLeft() + (contentWidth - measureTextWidth) / 2, getPaddingTop()  + mSingLetterHeight * i + DisplayUtil.getTextBaseLine(mPaint), mPaint);
        }
    }

這里可能有點(diǎn)疑惑,為什么要用內(nèi)容的寬度減去字體的寬度然后除于2,這是因?yàn)槊總€(gè)字母的寬度都不一樣,如果不這樣做的畫,那么比如I就會(huì)和A W等字母左對(duì)齊,我們這樣做的目的就是為了都居中。
這樣我們就實(shí)現(xiàn)了一個(gè)靜態(tài)的頁(yè)面沒我們要讓他觸摸改變,我們就重寫onTouchEvent進(jìn)行操作,并且添加相應(yīng)的回調(diào)。

 @Override
    public boolean onTouchEvent(MotionEvent ev) {

        switch (ev.getAction()) {
            case MotionEvent.ACTION_DOWN:
            case MotionEvent.ACTION_MOVE:
                // 獲取當(dāng)前手指觸摸的Y位置
                float fingerY = ev.getY();
                int pos = (int) (fingerY / mSingLetterHeight);
                if (pos > -1 && pos < mLetters.length && !mLetters[pos].equals(mCurrentTouchLetter)) {
                    mCurrentTouchLetter = mLetters[pos];
                    triggerTouchListener(true);
                    invalidate();
                }
                break;
            case MotionEvent.ACTION_UP:
                triggerTouchListener(false);
                break;
        }

        return true;
    }

    private void triggerTouchListener(boolean isTouch) {
        if (mTouchListener != null)
            mTouchListener.onTouch(mCurrentTouchLetter, isTouch);
    }

    // 設(shè)置觸摸監(jiān)聽
    private SideBarTouchListener mTouchListener;

    public void setOnSideBarTouchListener(SideBarTouchListener touchListener) {
        this.mTouchListener = touchListener;
    }

    public interface SideBarTouchListener {
        void onTouch(String letter, boolean isTouch);
    }

這樣我們就可以實(shí)現(xiàn)了這個(gè)功能點(diǎn)。
優(yōu)化思路
一個(gè)view繪制出來我們還需要進(jìn)行優(yōu)化,這一步是非常重要的。在本例中,我們的優(yōu)化主要是在 onTouchEvent里面,因?yàn)槲覀冎溃?code>invalidate函數(shù)是一個(gè)一個(gè)做了很多事情的函數(shù),具體請(qǐng)看:Android invalidate流程分析 我們要減少它的調(diào)用,所以我們應(yīng)該先判斷一下,如果當(dāng)前的這個(gè)索引和觸摸的這個(gè)不一樣的話才調(diào)用invalidate,這樣的話就優(yōu)雅很多了。在本例中我沒有將需要改變的屬性,比如字體大小、選中顏色、默認(rèn)顏色等提取在attr里面,需要的請(qǐng)自行添加。
參考:Android字母索引列表

源碼github下載地址:
https://github.com/ChinaZeng/CustomView

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容