如何将文本放入可绘制对象中?

44

我正在尝试动态创建可绘制对象,以用作自定义线性布局的背景。它需要有刻度线等内容(没问题),还需要标记刻度线的数字(就像标尺一样)。我知道我可以创建文本元素并将其放置在线性布局内,并且只在可绘制对象中放置刻度线,但我希望它们也在可绘制对象内,这样我不必进行两次测量计算。


5
10年后,到达Android 11,这个问题和得票最高的答案仍然相关,太疯狂了!难以相信Google至今还没有添加TextDrawable。 - 0101100101
5个回答

103

这是一个简短的示例,展示了如何使用TextDrawable,它像普通的drawable一样工作,但允许你将文本作为唯一的构造函数变量进行指定:

public class TextDrawable extends Drawable {

    private final String text;
    private final Paint paint;

    public TextDrawable(String text) {

        this.text = text;

        this.paint = new Paint();
        paint.setColor(Color.WHITE);
        paint.setTextSize(22f);
        paint.setAntiAlias(true);
        paint.setFakeBoldText(true);
        paint.setShadowLayer(6f, 0, 0, Color.BLACK);
        paint.setStyle(Paint.Style.FILL);
        paint.setTextAlign(Paint.Align.LEFT);
    }

    @Override
    public void draw(Canvas canvas) {
        canvas.drawText(text, 0, 0, paint);
    }

    @Override
    public void setAlpha(int alpha) {
        paint.setAlpha(alpha);
    }

    @Override
    public void setColorFilter(ColorFilter cf) {
        paint.setColorFilter(cf);
    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }
}

如何将文本放置在可绘制对象的中心位置?我记得这是一个非常常见的问题。 - android developer
@android-developer 我相信你使用了 paint.setTextAlign(Paint.Align.CENTER); - plowman
@plowman 正如我所说,我记得这是有问题的,因为文本字体无法正确居中。也许我错了,这可能是类似的问题。不管怎样,谢谢。 - android developer
4
抱歉,但如何使用这个类在可绘制对象中绘制文本? - Leap Hawk
1
@Akash Rajput ImageView.setImageDrawable(myTextDrawable);@Akash Rajput的ImageView.setImageDrawable(myTextDrawable); - Shane Sepac
显示剩余9条评论

16
我已阅读《Professional Android 2 Application Development》这本书(作者是Reto Meier),其中包含一个示例项目,您可以创建一个简单的指南针应用程序,在该应用程序中,“绘制”文本、标记等。
简要说明是,您需要创建一个扩展了android.view.View类并重写onDraw(Canvas)方法的类。
该书中的所有源代码都可以在此处下载:http://www.wrox.com/WileyCDA/WroxTitle/Professional-Android-2-Application-Development.productCd-0470565527,descCd-DOWNLOAD.html。如果您下载了代码并查看名为“第4章指南针”的项目,我相信您会找到您要寻找的内容 :)

canvas.drawText(...) 正是我正在寻找的。谢谢! - atraudes

12

看了Plowman的答案并试图根据我的需求进行调整,我发现一个用于此链接中相机的类。

这是TextDrawable类的代码。它看起来与Plowman的代码非常相似,但对我来说效果更好:

import android.content.res.Resources;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.ColorFilter;
import android.graphics.Paint;
import android.graphics.Paint.Align;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;
import android.util.TypedValue;

public class TextDrawable extends Drawable {
    private static final int DEFAULT_COLOR = Color.WHITE;
    private static final int DEFAULT_TEXTSIZE = 15;
    private Paint mPaint;
    private CharSequence mText;
    private int mIntrinsicWidth;
    private int mIntrinsicHeight;

    public TextDrawable(Resources res, CharSequence text) {
        mText = text;
        mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        mPaint.setColor(DEFAULT_COLOR);
        mPaint.setTextAlign(Align.CENTER);
        float textSize = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP,
                DEFAULT_TEXTSIZE, res.getDisplayMetrics());
        mPaint.setTextSize(textSize);
        mIntrinsicWidth = (int) (mPaint.measureText(mText, 0, mText.length()) + .5);
        mIntrinsicHeight = mPaint.getFontMetricsInt(null);
    }
    @Override
    public void draw(Canvas canvas) {
        Rect bounds = getBounds();
        canvas.drawText(mText, 0, mText.length(),
                bounds.centerX(), bounds.centerY(), mPaint);
    }
    @Override
    public int getOpacity() {
        return mPaint.getAlpha();
    }
    @Override
    public int getIntrinsicWidth() {
        return mIntrinsicWidth;
    }
    @Override
    public int getIntrinsicHeight() {
        return mIntrinsicHeight;
    }
    @Override
    public void setAlpha(int alpha) {
        mPaint.setAlpha(alpha);
    }
    @Override
    public void setColorFilter(ColorFilter filter) {
        mPaint.setColorFilter(filter);
    }
}

这个看起来有点不对劲,似乎被切了一部分,而且没有居中对齐:https://i.stack.imgur.com/2xRyf.png。你能再检查一下代码吗? - android developer
太遗憾了。你的代码是我找到的唯一一个还不错的。 - android developer
没关系。如果您能尝试检查一下,我会很感激的。 - android developer
请参考用户2241362的答案。它适用于居中对齐。 - Clark Battle
也对我来说更有效。但是在顶部有一部分被切掉了。 - mathematics-and-caffeine
显示剩余3条评论

6

回答上面有关如何居中文本的评论:

mPaint.textAlign = Align.CENTER
...
// Centering for mixed case letters
canvas.drawText(mText, 0, mText.length,
        bounds.centerX().toFloat(), bounds.centerY().toFloat() - ((mPaint.descent() + mPaint.ascent()) / 2), mPaint)

// Centering for all uppercase letters
canvas.drawText(mText, 0, mText.length,
            bounds.centerX().toFloat(), bounds.centerY().toFloat() - mPaint.ascent() / 2, mPaint)

完美。这对我有用。在构造函数中测试所有大写字母,而不是在draw()函数中测试。 - Clark Battle
你好!这是在自定义视图上创建文本,而不是在Drawable上。 - Phạm Lam

4

这样可以让您将任何视图放入Drawable中,包括TextView。您甚至可以在XML布局中使用样式。

public class ViewDrawable extends Drawable {
    final View mView;

    public ViewDrawable(final Context context, final @LayoutRes int layoutId) {
        this(LayoutInflater.from(context).inflate(layoutId, null));
    }

    public ViewDrawable(final @NonNull View view) {
        mView = view;
    }

    public View getView() {
        return mView;
    }

    @Override
    public void setBounds(int left, int top, int right, int bottom) {
        super.setBounds(left, top, right, bottom);
        final int widthMeasureSpec = View.MeasureSpec.makeMeasureSpec(right - left, View.MeasureSpec.EXACTLY);
        final int heightMeasureSpec = View.MeasureSpec.makeMeasureSpec(bottom - top, View.MeasureSpec.EXACTLY);
        mView.measure(widthMeasureSpec, heightMeasureSpec);
        mView.layout(left, top, right, bottom);
    }

    @Override
    public void draw(@NonNull Canvas canvas) {
        mView.draw(canvas);
    }

    @Override
    public void setAlpha(int alpha) {
        mView.setAlpha(alpha/255f);
    }

    @Override
    public void setColorFilter(@Nullable ColorFilter colorFilter) {

    }

    @Override
    public int getOpacity() {
        return PixelFormat.UNKNOWN;
    }
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接