最近項目中需要做一個按鈕熟嫩,設(shè)計圖如下所示:
首先看到圖的第一反應(yīng)就是在xml中添加android:drawableLeft?屬性坤候,然而發(fā)現(xiàn)結(jié)果是這樣子的:
切圖暫時還未到位一切從簡。
那么當(dāng)我們需要Button的drawableLeft居中顯示時,Android屬性不能提供給我們相對應(yīng)的Api時候我們想到了自定義View服球。
思路很簡單,通過canvas平移字體跟drawable資源文件颠焦,平移距離:計算出drawable文件和text文字的寬度以及他們之間的padding距離有咨,通過view的長度減去這個計算的距離除于2。這樣的平移距離剛好居中:
下面上代碼:
@Override
protected voidonDraw(Canvas canvas) {
Drawable[] drawables = getCompoundDrawables();
if(drawables !=null) {
Drawable drawableLeft = drawables[0];
if(drawableLeft !=null) {
floattextWidth = getPaint().measureText(getText().toString());
intdrawablePadding = getCompoundDrawablePadding();
intdrawableWidth =0;
drawableWidth = drawableLeft.getIntrinsicWidth();
floatbodyWidth = textWidth + drawableWidth + drawablePadding;
canvas.translate((getWidth() - bodyWidth) /2,0);
}
}
super.onDraw(canvas);
}
主要是onDraw方法蒸健。
xml中引用:
android:layout_width="match_parent"
android:layout_height="@dimen/dp50"
android:layout_marginBottom="@dimen/dp20"
android:layout_marginLeft="@dimen/dp30"
android:layout_marginRight="@dimen/dp30"
android:layout_marginTop="@dimen/dp50"
android:background="@drawable/bg_btn_payment"
android:drawableLeft="@drawable/ic_clear"
android:drawablePadding="@dimen/dp5"
android:gravity="center_vertical"
android:text="Test Now"
android:textColor="@color/white"
android:textSize="@dimen/dp16"/>
加一個android:gravity="center_vertical"? 否則文字會垂直距離不居中。
最后我們的效果: