Android中快速便捷的實(shí)現(xiàn)圓角按鈕方法詳解
前言
大家應(yīng)該都知道,圓角按鈕是我們?cè)谧鼋缑鏁r(shí)常常遇到的UI樣式。通常的辦法,是做一個(gè)drawable,比如這樣:
<?xml version="1.0" encoding="UTF-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <!-- 填充的顏色 --> <solid android:color="#ffae00" /> <!-- 圓角的半徑 --> <corners android:radius="10dp" /> </shape>
在Layout文件里Button的background屬性設(shè)上這個(gè)drawable.xml,就可以了。
然而這樣做的話,每次弄個(gè)按鈕都得新做一個(gè)drawable文件,各種drawable多了看著就亂。
是不是可以把color和radius放到Button的屬性里去,這樣就不用每次再拖一個(gè)drawable.xml了是吧?
自定義RoundCornerButton
<widget.RoundCornerButton android:id="@+id/btn_commit" android:layout_width="100dp" android:layout_height="40dp" android:gravity="center" android:text="我的按鈕" app:rcb_backgroundColor="@color/yellow" app:rcb_backgroundColorDisabled="@color/light_grey" app:rcb_cornerRadius="20dp" />
如果可以這樣在Layout文件里直接設(shè)置背景色和圓角半徑,是不是很方便!雖然不如drawable靈活,但是已經(jīng)足以應(yīng)付設(shè)計(jì)同學(xué)給出的圓角按鈕的需求了。
我們就以定義自己的styleable屬性開(kāi)始吧
<declare-styleable name="RoundCornerButton"> <attr name="rcb_backgroundColor" format="color" /> <attr name="rcb_backgroundColorDisabled" format="color" /> <attr name="rcb_cornerRadius" format="dimension" /> </declare-styleable>
從Drawable擴(kuò)展一個(gè)自己的Drawable,很簡(jiǎn)單
- 從構(gòu)造方法傳入color和radius,并創(chuàng)建一個(gè)實(shí)習(xí)的畫(huà)筆;
- 覆寫(xiě)draw方法,有現(xiàn)成的畫(huà)圓角矩形的方法可以調(diào)用;
- 暴露一個(gè)setRect方法給外邊,用于設(shè)置繪制區(qū)域的寬高。
class RoundCornerDrawable extends Drawable { final int color; final float radius; final Paint paint; final RectF rectF; RoundCornerDrawable(int color, float radius) { this.color = color; this.radius = radius; // 實(shí)心的畫(huà)筆 this.paint = new Paint(); paint.setStyle(Paint.Style.FILL); paint.setAntiAlias(true); paint.setColor(color); this.rectF = new RectF(); } // 用于設(shè)置Drawable寬高 public void setRect(int width, int height) { this.rectF.left = 0; this.rectF.top = 0; this.rectF.right = width; this.rectF.bottom = height; } @Override public void draw(@NonNull Canvas canvas) { canvas.drawRoundRect(rectF, radius, radius, paint); // 畫(huà)圓角矩形,現(xiàn)成的方法 } // 其余方法略 }
定義自己的Button類(lèi),有這么幾個(gè)要點(diǎn):
- 與通常的自定義View一樣,覆寫(xiě)三個(gè)構(gòu)造方法;
- 從AttributeSet里讀取自定義的屬性backgroundColor和cornerRadius,這里暫時(shí)忽略backgroundColorDisabled;
- 每一種狀態(tài)(例如普通、禁用、按下)是一個(gè)RoundCornerDrawable,組合成一個(gè)StateListDrawable;
- onLayout的時(shí)候,記得改變每一個(gè)RoundCornerDrawable的尺寸。
public class RoundCornerButton extends AppCompatButton { private int colorNormal; private float cornerRadius; private RoundCornerDrawable bgDrawableNormal = null; // 省略三個(gè)構(gòu)造方法 // 構(gòu)造方法最后一定要調(diào)用initCornerBackground完成初始化 private void initCornerBackground(AttributeSet attrs, int defStyleAttr) { TypedArray a = getContext().obtainStyledAttributes(attrs, R.styleable.RoundCornerButton, defStyleAttr, 0); this.cornerRadius = a.getDimension(R.styleable.RoundCornerButton_rcb_cornerRadius, 0); this.colorNormal = a.getColor(R.styleable.RoundCornerButton_rcb_backgroundColor, 0); makeBackgroundDrawable(); a.recycle(); } private void makeBackgroundDrawable() { bgDrawableNormal = new RoundCornerDrawable(this.colorNormal, this.cornerRadius); bgDrawableNormal.setRect(getWidth(), getHeight()); // 設(shè)計(jì)通常會(huì)給出禁用時(shí)的樣式以及按下時(shí)的樣式 // 所以這里用使用StateListDrawable StateListDrawable bgDrawable = new StateListDrawable(); bgDrawable.addState(new int[]{android.R.attr.state_enabled, -android.R.attr.state_pressed}, bgDrawableNormal); // 每多一種狀態(tài),在這里多加一項(xiàng) setBackgroundDrawable(bgDrawable); } @Override protected void onLayout(boolean changed, int left, int top, int right, int bottom) { super.onLayout(changed, left, top, right, bottom); // layout之后必然會(huì)draw,所以在這里設(shè)置drawable的尺寸 if (bgDrawableNormal != null) { bgDrawableNormal.setRect(right - left, bottom - top); } // 每多一種狀態(tài),在這里多加一項(xiàng) } }
附上Demo源代碼:https://github.com/realxu/CodeSamples/tree/master/Android/RoundCornerButtonDemo
這就可以啦,我們看看效果:
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助,如果有疑問(wèn)大家可以留言交流,謝謝大家對(duì)腳本之家的支持。
相關(guān)文章
Android編程實(shí)現(xiàn)GPS位置獲取的方法
這篇文章主要介紹了Android編程實(shí)現(xiàn)GPS位置獲取的方法,結(jié)合具體實(shí)例形式分析了Android針對(duì)GPS定位的常見(jiàn)操作技巧,需要的朋友可以參考下2017-07-07Android 實(shí)現(xiàn)九宮格抽獎(jiǎng)功能
這篇文章主要介紹了Android 實(shí)現(xiàn)九宮格抽獎(jiǎng)功能,幫助大家更好的理解和學(xué)習(xí)使用Android,感興趣的朋友可以了解下2021-03-03Android利用MediaRecorder實(shí)現(xiàn)錄音功能
這篇文章主要為大家詳細(xì)介紹了Android利用MediaRecorder實(shí)現(xiàn)錄音功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-03-03android截圖事件監(jiān)聽(tīng)的原理與實(shí)現(xiàn)
本篇文章主要介紹了android截圖事件監(jiān)聽(tīng)的原理與實(shí)現(xiàn),小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07Android?PickerScrollView滑動(dòng)選擇控件使用方法詳解
這篇文章主要為大家詳細(xì)介紹了Android?PickerScrollView滑動(dòng)選擇控件,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04Android 監(jiān)聽(tīng)軟鍵盤(pán)狀態(tài)的實(shí)例詳解
這篇文章主要介紹了Android 監(jiān)聽(tīng)軟鍵盤(pán)狀態(tài)的實(shí)例詳解的相關(guān)資料,希望通過(guò)本文能掌握這樣的知識(shí),需要的朋友可以參考下2017-09-09基于Android CALL && SendMes Test的相關(guān)介紹
本篇文章小編為大家介紹,Android CALL && SendMes Test 需要的朋友參考下2013-04-04新版Android Studio3.6找不到R.java怎么處理
這篇文章主要介紹了新版Android Studio3.6找不到R.java怎么處理,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03