自定义控件让TextView的drawableLeft与文本一起居中显示

最新推荐文章于 2022-03-18 10:09:40 发布

转载最新推荐文章于 2022-03-18 10:09:40 发布 · 408 阅读

文章标签：

#textview #控件

UI问题专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一种自定义TextView的方法，使drawableLeft图标能与文本垂直居中对齐，提供了简单的实现代码，并保持与普通TextView一致的使用方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

转载农民伯伯： http://www.cnblogs.com/over140/

TextView的drawableLeft、drawableRight和drawableTop是一个常用、好用的属性，可以在文本的上下左右放置一个图片，而不使用更加复杂布局就能达到，我也常常喜欢用RadioButton的这几个属性实现很多效果，但是苦于不支持让drawbleLeft与文本一起居中，设置gravity为center也无济于事，终于有空研究了一下，这里与大家一起分享。

正文

一、效果图

二、实现代码

自定义控件

/**
 * drawableLeft与文本一起居中显示
 * 
 * @author 农民伯伯
 * @see http://www.cnblogs.com/over140/p/3464348.html
 * 
 */
public class DrawableCenterTextView extends TextView {

    public DrawableCenterTextView(Context context, AttributeSet attrs,
            int defStyle) {
        super(context, attrs, defStyle);
    }

    public DrawableCenterTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public DrawableCenterTextView(Context context) {
        super(context);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        Drawable[] drawables = getCompoundDrawables();
        if (drawables != null) {
            Drawable drawableLeft = drawables[0];
            if (drawableLeft != null) {
                float textWidth = getPaint().measureText(getText().toString());
                int drawablePadding = getCompoundDrawablePadding();
                int drawableWidth = 0;
                drawableWidth = drawableLeft.getIntrinsicWidth();
                float bodyWidth = textWidth + drawableWidth + drawablePadding;
                canvas.translate((getWidth() - bodyWidth) / 2, 0);
            }
        }
        super.onDraw(canvas);
    }
}

和普通TextView用法一致，无需额外增加属性。

垂直居中设置自带的gravity="center_vertical"就可以了

2013-12-13 注意，drawableRight不管用！感谢网友提醒，后续有进展了再更新文章。

结束

那些让你难受的技术问题一定要找时间想办法摆平TA！