最近项目中需要做一个按钮，设计图如下所示：
首先看到图的第一反应就是在xml中添加android:drawableLeft 属性，然而发现结果是这样子的：
切图暂时还未到位一切从简。
那么当我们需要Button的drawableLeft居中显示时，Android属性不能提供给我们相对应的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" 否则文字会垂直距离不居中。
最后我们的效果：
