简体   繁体   English

如何在画布上绘制文字?

[英]How to draw text on canvas?

i'm trying to develop a simple pie chart class for android. 我正在尝试为android开发一个简单的饼图类。 For now, it can take a map of labels and values and draw the pie chart. 现在,它可以获取标签和值的映射并绘制饼图。 I'm yet to add the legends for the pie, which is where i need to place the texts near small rectangles on the screen corner. 我还没有添加馅饼的图例,这是我需要将文本放在屏幕角落的小矩形附近的地方。 Any help appreciated, since i'm new to Android dev. 任何帮助表示赞赏,因为我是Android开发人员的新手。

You will have to use the drawText method of the Canvas class. 您将不得不使用Canvas类的drawText方法。

Paint paint = new Paint(); 
canvas.drawPaint(paint); 
paint.setColor(Color.BLACK); 
paint.setTextSize(16); 
canvas.drawText("My Text", x, y, paint); 

Here's the relevant documentation about it: 这是关于它的相关文档:

http://developer.android.com/reference/android/graphics/Canvas.html#drawText(java.lang.String, float, float, android.graphics.Paint) http://developer.android.com/reference/android/graphics/Canvas.html#drawText(java.lang.String,float,flove,android.graphics.Paint)

There used to be another answer here that got deleted because it was a link only. 这里曾经有另一个答案被删除,因为它只是一个链接。 The original link is here . 原始链接在这里 The code is basically the same, but I took out the non text drawing portions and also scaled up the sizes to work better on modern screen densities. 代码基本相同,但我拿出了非文本绘图部分,并且还扩大了尺寸,以便在现代屏幕密度上更好地工作。

This just shows a few things you can do with text drawing. 这只是展示了一些你可以用文字绘制做的事情。

在此输入图像描述

Here is the updated code: 这是更新的代码:

public class MainActivity extends AppCompatActivity {

    DemoView demoview;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        demoview = new DemoView(this);
        setContentView(demoview);
    }

    private class DemoView extends View {
        public DemoView(Context context){
            super(context);
        }

        @Override protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);

            // custom drawing code here
            // remember: y increases from top to bottom
            // x increases from left to right
            int x = 0;
            int y = 0;
            Paint paint = new Paint();
            paint.setStyle(Paint.Style.FILL);

            canvas.save();
            canvas.translate(100, 200);

            // make the entire canvas white
            canvas.drawColor(Color.WHITE);

            // draw some text using STROKE style
            paint.setStyle(Paint.Style.STROKE);
            paint.setStrokeWidth(1);
            paint.setColor(Color.MAGENTA);
            paint.setTextSize(100);
            canvas.drawText("Style.STROKE", 0, 0, paint);

            canvas.translate(0, 200);

            // draw some text using FILL style
            paint.setStyle(Paint.Style.FILL);
            //turn antialiasing on
            paint.setAntiAlias(true);
            //paint.setTextSize(30);
            canvas.drawText("Style.FILL", 0, 0, paint);

            canvas.translate(0, 200);

            // draw some rotated text
            // get text width and height
            // set desired drawing location
            x = 75;
            y = 185;
            paint.setColor(Color.GRAY);
            //paint.setTextSize(25);
            String str2rotate = "Rotated!";

            // draw bounding rect before rotating text
            Rect rect = new Rect();
            paint.getTextBounds(str2rotate, 0, str2rotate.length(), rect);
            canvas.translate(x, y);
            paint.setStyle(Paint.Style.FILL);
            // draw unrotated text
            canvas.drawText("!Rotated", 0, 0, paint);
            paint.setStyle(Paint.Style.STROKE);
            canvas.drawRect(rect, paint);
            // undo the translate
            canvas.translate(-x, -y);

            // rotate the canvas on center of the text to draw
            canvas.rotate(-45, x + rect.exactCenterX(),
                    y + rect.exactCenterY());
            // draw the rotated text
            paint.setStyle(Paint.Style.FILL);
            canvas.drawText(str2rotate, x, y, paint);

            //undo the translation and rotation
            canvas.restore();
        }
    }
}

Something else that I want to try later is drawing text along a path . 我想稍后尝试的其他东西是沿着路径绘制文本

See also this fuller answer here that gives the following image. 另请参阅此处更全面的答案,其中给出了以下图像。

在此输入图像描述

Another (arguably better) way to draw text on a canvas is to use a StaticLayout . 在画布上绘制文本的另一种(可以说是更好的)方法是使用StaticLayout This handles multiline text when needed. 这在需要时处理多行文本。

String text = "This is some text.";

TextPaint textPaint = new TextPaint();
textPaint.setAntiAlias(true);
textPaint.setTextSize(16 * getResources().getDisplayMetrics().density);
textPaint.setColor(0xFF000000);

int width = (int) textPaint.measureText(text);
StaticLayout staticLayout = new StaticLayout(text, textPaint, (int) width, Layout.Alignment.ALIGN_NORMAL, 1.0f, 0, false);
staticLayout.draw(canvas);

The TextPaint and StaticLayout were instantiated right before being used here for the sake of illustration. 为了便于说明, TextPaintStaticLayout在被用于此处之前被实例化。 Doing so in onDraw would hurt performance, though. 但是,在onDraw这样做会损害性能。 Here is a better example showing them in the context of a custom view that draws it's own text. 这是一个更好的示例 ,在自定义视图的上下文中显示它们,并绘制自己的文本。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM