Develop Reference

Canvas drawtext positioning

I am creating a drawing tool, where user add text to image. While making the text draw to bitmap via canvas position is not being set properly.
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setColor(Color.RED);
paint.setTypeface(tf);
paint.setTextAlign(Paint.Align.LEFT);
paint.setTextSize(30);
int xPos = layoutTextViewContainer.getLeft();
int yPos = layoutTextViewContainer.getTop();
canvas.drawText(text, xPos, yPos, paint);
Paint
Rect textRect = new Rect();
paint.getTextBounds(text, 0, text.length(), textRect);
textRect.offset(0, -textRect.top);
Canvas canvas = new Canvas(bm);
layoutTextViewContainer holds the edit text.
Screen shot for more clarification.
Black text is written and Red text is preview of embed in image

Got the solution. the values should be pixel independent
convert xPos and yPos as below before passing to drawText
xPos = (int) (xPos / getResources().getDisplayMetrics().density);
yPos = (int) (yPos / getResources().getDisplayMetrics().density);

Its even better to use Drawing cache and save that to any file location.
In this case we dont have to much bother about positioning.
Wrap all in one layout and get the
view.getDrawingCache()

Paint.getTextBounds() returns to big height

EDIT: The problem came from the emulator, the error did not appear on a real device :(
I'm trying to draw some text in a custom view and must there for measure it but the value of the Paint.getTextBounds() returns a height which is about 30% higher then the actual text which gives everything a quirky look.
I found this: Android Paint: .measureText() vs .getTextBounds() and tried to add the solution code to my own onDraw and saw that i the same measuring error as in my code. Here is a picture of the result:
Compare with:
The image is copied from Android Paint: .measureText() vs .getTextBounds()
Note the spacing above the text in the first picture. Any Ideas what might be causing this? Or are there alternative ways to measure height of a drawn string?
Here is the onDraw method:
#Override
public void onDraw(Canvas canvas){
// canvas.drawColor(color_Z1);
// r.set(0, 0, (int)(width*progress), height);
// paint.setColor(color_Z2);
//// canvas.drawRect(r, paint);
// textPaint.getTextBounds(text, 0, text.length(), r);
// canvas.drawRect(r, paint);
// canvas.drawText(text, 0, r.height(), textPaint);
final String s = "Hello. I'm some text!";
Paint p = new Paint();
Rect bounds = new Rect();
p.setTextSize(60);
p.getTextBounds(s, 0, s.length(), bounds);
float mt = p.measureText(s);
int bw = bounds.width();
Log.i("LCG", String.format(
"measureText %f, getTextBounds %d (%s)",
mt,
bw, bounds.toShortString())
);
bounds.offset(0, -bounds.top);
p.setStyle(Style.STROKE);
canvas.drawColor(0xff000080);
p.setColor(0xffff0000);
canvas.drawRect(bounds, p);
p.setColor(0xff00ff00);
canvas.drawText(s, 0, bounds.bottom, p);
}

i didnot test your code but i dont see any problems with Paint.getTextBounds():
public class TextBoundsTest extends View {
private Paint paint;
private Rect bounds;
public TextBoundsTest(Context context) {
super(context);
paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setTextSize(32);
bounds = new Rect();
}
#Override
protected void onDraw(Canvas canvas) {
String text = "this is my text";
paint.getTextBounds(text, 0, text.length(), bounds);
Log.d(TAG, "onDraw " + bounds);
int x = (getWidth() - bounds.width()) / 2;
int y = 70;
paint.setColor(0xff008800);
bounds.offset(x, y);
canvas.drawRect(bounds, paint);
paint.setColor(0xffeeeeee);
canvas.drawText(text, x, y, paint);
}
}
add this in Activity.onCreate:
TextBoundsTest view = new TextBoundsTest(this);
setContentView(view);
the result is:

canvas drawtext direction

how to make that text was written vertically? how to rotate text 90 degrees?
Write each letter individually is stupid, but now ,i don't know another way.
Paint paint = new Paint();
public DrawView(Context context, double arr[])
{
super(context);
paint.setColor(Color.BLACK);
}
#Override
public void onDraw(Canvas canvas)
{
canvas.drawText("Test",50, 50, paint);
}

Simply rotating text (or anything else) is easy: Use the rotate() method to rotate the canvas (afterwards it is rotated back, otherwise everything you draw becomes rotated):
canvas.save();
canvas.rotate(90f, 50, 50);
canvas.drawText("Text",50, 50, paint);
canvas.restore();
The save() and restore()methods respectively save the state of the canvas and restores it. So the rest of your drawn elements are not rotated. If you only want to paint the text these two methods are not necessary.
If you want to put the characters of the string under each other, you need to process each character separately. First you'd need to obtain the font height and when drawing each character you need to increase the y-coordinate with this height over and over again.
int y = 50;
int fontHeight = 12; // I am (currently) too lazy to properly request the fontHeight and it does not matter for this example :P
for(char c: "Text".toCharArray()) {
canvas.drawText(c, 50, y, paint);
y += fontHeight;
}

Correct version is :
Canvas canvas_front = new Canvas(bitmap_front);
Paint paint = new Paint();
paint.setColor(Color.rgb(140, 0, 0));
paint.setAlpha(80);
paint.setStrokeWidth(2);
canvas_front.drawLine(0, (float) (frontIV.getHeight() * 0.9),frontIV.getWidth(), (float) (frontIV.getHeight() * 0.9), paint);
canvas_front.save();
canvas_front.rotate((float) 90 , 50, 50);
canvas_front.drawText("Text",50, 50, paint);
canvas_front.restore();
frontIV.setImageBitmap(bitmap_front);

Getting rendered text height, which is equivalent to rendered text width using paint.measureText

I have the following code to draw text.
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint paint = new Paint();
paint.setTextSize(400);
paint.setColor(Color.WHITE);
paint.setAntiAlias(true);
paint.setTextAlign(Align.LEFT);
paint.setStyle(Style.FILL);
String text = "698";
Rect bounds = new Rect();
paint.getTextBounds(text, 0, text.length(), bounds);
int textWidth = bounds.width();
int textHeight = bounds.height();
Bitmap originalBitmap = Bitmap.createBitmap(textWidth,
textHeight, Bitmap.Config.ARGB_8888);
Canvas singleUseCanvas = new Canvas(originalBitmap);
singleUseCanvas.drawColor(Color.BLUE);
singleUseCanvas.drawText(text, 0, textHeight, paint);
canvas.drawBitmap(originalBitmap, 0, 0, null);
}
I am getting undesired outcome, which its right and bottom sides are being cropped.
I avoid right side cropping, by using
float textWidth = paint.measureText(text);
Bitmap originalBitmap = Bitmap.createBitmap((int)(textWidth + 0.5),
textHeight, Bitmap.Config.ARGB_8888);
I am getting the following improvement
Yet. My bottom still being cropped. May I know what is the correct way to obtained rendered text height, which is analogy to rendered text width using paint.measureText?

I think i would be helpful to have a look at this post:
Android Paint: .measureText() vs .getTextBounds()
It have a good survey about sizing of rendered text and also text height which is your concern.

measuring text on scaled canvas

I've been struggling with text measuring and scaled canvases.
When the canvas is unscaled, getTextBounds and measureText deliver accurate results. However, when the canvas is scaled both methods do not deliver results that match the actual size of a printed text.
For testing I've created a subclass of View with the following onDraw method:
final float scaling = 0.51f;
final int fontSize = 50;
canvas.scale(scaling, scaling);
font = Typeface.create("Arial", Typeface.NORMAL);
Paint paint = new Paint();
paint.setColor(0xff4444ff);
paint.setTypeface(font);
paint.setTextSize(fontSize);
paint.setAntiAlias(true);
int x = 10;
int y = 100;
final String text = "Lorem ipsum dolor sit amet, consectetur adipisici elit...";
canvas.drawText(text, x, y, paint);
// draw border using getTextBounds
paint.setColor(0xffff0000);
paint.setStyle(Paint.Style.STROKE);
paint.setTypeface(font);
paint.setTextSize(fontSize);
Rect bounds = new Rect();
paint.getTextBounds(text, 0, text.length(), bounds);
bounds.offset(x, y);
paint.setColor(0x80ffff00);
canvas.drawRect(bounds, paint);
// draw border using measureText
float w = paint.measureText(text);
bounds.left = x;
bounds.right = (int) Math.ceil(bounds.left + w);
bounds.top -= 10;
bounds.bottom += 10;
paint.setColor(0x8000ffff);
paint.setPathEffect(new DashPathEffect(new float[] { 10, 10 }, 0));
canvas.drawRect(bounds, paint);
for scaling = 0.5 I get the following output:
for scaling = 0.51 the following result is shown:
The yellow solid border marks the rect delivered from getTextBounds, the dashed cyan rect is rendered using the width delivered from measureText.
As you can see, the text with scaling = 0.5 is smaller than the measured dimensions and with scaling=0.51 the drawn text is way bigger than the measured dimension.
Any help is appreciated!

Ok, just found out how to circumvent the issue.
The problem is that the Paint does not know about the Canvas scaling. Therefore measureText and getTextBounds deliver the unscaled result. But since the font size does not scale linearly (however, the drawn rect does ), you have to make up for that effect manually.
So the solution would be:
// paint the text as usual
Paint paint = new Paint();
paint.setTypeface(font);
paint.setTextSize(fontSize);
canvas.drawText(text, x, y, paint);
// measure the text using scaled font size and correct the scaled value afterwards
Paint paint = new Paint();
paint.setTypeface(font);
paint.setTextSize(fontSize * scaling);
float w = paint.measureText(text) / scaling;

Using Mono for Android I had to use display metrics as shown here:
public override System.Drawing.SizeF MeasureString(MyFont f, string text)
{
Rect r = new Rect();
f.DrawingFont.GetTextBounds(text, 0, text.Length, r);
//Manual scaling using DisplayMetrics due to Android
//issues for compatibility with older versions
Android.Util.DisplayMetrics metrics = new Android.Util.DisplayMetrics();
GetDisplay.GetMetrics(metrics);
return new System.Drawing.SizeF(r.Width(), r.Height() * metrics.Density);
}
Where f.DrawingFont is an Androdid.Text.TextPaint GetDisplay is:
private Display GetDisplay()
{
return this.GetSystemService(Android.Content.Context.WindowService).JavaCast<Android.Views.IWindowManager>().DefaultDisplay;
}
And the same method in Java is:
private Display getDisplay() {
return ((WindowManager) getContext().getSystemService(
Context.WINDOW_SERVICE)).getDefaultDisplay();
}