通常情況下,Android實現自訂控制項無非三種方式。
Ⅰ、繼承現有控制項,對其控制項的功能進行拓展。
Ⅱ、將現有控制項進行組合,實現功能更加強大控制項。
Ⅲ、重寫View實現全新的控制項
本文重點討論繼承現有控制項進行拓展實現自訂控制項。這是一個非常重要的自訂控制項的方法,可以站在原生控制項這個巨人肩膀上,拓展自身的功能,一般來說,我們可以在ondraw方法中對原生控制項進行繪製。
本文將以拓展textView為例,看我們是如何繼承現有控制項,來自訂一個強大控制項。這個自訂控制項就是帶有邊框文字框,並且邊框與背景的顏色不一樣。大體效果圖是這樣的:
我們來分析一下如何?這樣的效果。我們此時應當盯上OnDraw方法,重寫OnDraw方法,在OnDraw方法中分別畫兩個有帶顏色背景矩形邊框就可以了。這樣,文字框就會有錯落有致的層次感了。
要有這種錯落有致的效果,我們第一步要做的是定義畫內邊框和外邊框的畫筆,定義的代碼如下:
private void initView() { mPaint1 = new Paint(); mPaint1.setColor(Color.BLUE); mPaint1.setStyle(Style.FILL); mPaint2 = new Paint(); mPaint2.setColor(Color.YELLOW); mPaint2.setStyle(Style.FILL); }
我們定義了第一種畫筆顏色為藍色,畫筆的填充模式為完全填充。第二種畫筆顏色為黃色,同樣填充模式為完全填充。
有了不同顏色畫筆之後,我們所需要做的是在OnDraw方法運用這兩隻畫筆畫不同矩形,這樣代碼又是這樣:
canvas.drawRect(0, 0, getMeasuredWidth(), getMeasuredHeight(), mPaint1); canvas.drawRect(10, 10, getMeasuredWidth() - 10, getMeasuredHeight() - 10, mPaint2); canvas.save(); canvas.translate(10, 0); super.onDraw(canvas); canvas.restore();
我們畫了兩個長寬不等的矩形,並且畫布平移了10個單位。這樣畫出來的自訂控制項為:
這個例子,非常簡單,可能大家對繼承原生控制項還是意猶未盡的話,我們百尺竿頭更進一步。做個稍微複雜點自訂TextView——帶有閃爍文字的TextView。
我們分析一下實現的思路:
①要實現這個效果,我們可以充分利用paint對象的shader(渲染器)對象。
②通過不斷改變linearGradient的位置,來形成這閃爍的效果。
有了這樣的思路以後,我們首先在onSizeChanged方法初始化LinearGradient對象,和進行圖形變換的矩陣對象。原始碼如下:
if (mWidth == 0) { mWidth = getMeasuredWidth(); if (mWidth > 0) { mPaint = getPaint(); mLinearGradient = new LinearGradient(0, 0, mWidth, 0, new int[] { Color.GRAY, Color.GREEN, Color.GRAY }, null, Shader.TileMode.CLAMP); mPaint.setShader(mLinearGradient); matrix = new Matrix(); } }
我們將LinearGradient對象顏色設定為灰綠相間的線性漸層對象,顏色的平鋪模式為平鋪。
然後在onDraw方法中,不斷變換線性漸層對象的位置,從而就有了文字左右閃爍的效果。原始碼如下:
if (matrix != null) { mTranslate = mTranslate + mWidth / 5; if (mTranslate > 2 * mWidth) { mTranslate = -mWidth; } matrix.setTranslate(mTranslate, 0); mLinearGradient.setLocalMatrix(matrix); postInvalidateDelayed(100); }
最終形成的效果為:
這就是自訂View三板斧之一——繼承現有控制項一點總結,希望對大家的學習有所協助。