Android Center Text On Canvas


Answer :

Try the following:

 Paint textPaint = new Paint();  textPaint.setTextAlign(Paint.Align.CENTER);   int xPos = (canvas.getWidth() / 2);  int yPos = (int) ((canvas.getHeight() / 2) - ((textPaint.descent() + textPaint.ascent()) / 2)) ;   //((textPaint.descent() + textPaint.ascent()) / 2) is the distance from the baseline to the center.   canvas.drawText("Hello", xPos, yPos, textPaint);

Center with Paint.getTextBounds():

enter image description here

private Rect r = new Rect();  private void drawCenter(Canvas canvas, Paint paint, String text) {     canvas.getClipBounds(r);     int cHeight = r.height();     int cWidth = r.width();     paint.setTextAlign(Paint.Align.LEFT);     paint.getTextBounds(text, 0, text.length(), r);     float x = cWidth / 2f - r.width() / 2f - r.left;     float y = cHeight / 2f + r.height() / 2f - r.bottom;     canvas.drawText(text, x, y, paint); }

  • Paint.Align.CENTER doesn't mean that the reference point of the text is vertically centered. The reference point is always on the baseline. So, why not use Paint.Align.LEFT? You have to calculate the reference point anyway.

  • Paint.descent() has the disadvantage, that it doesn't consider the real text. Paint.descent() retrieves the same value, regardless of whether the text contains letters with descents or not. That's why I use r.bottom instead.

  • I have had some problems with Canvas.getHeight() if API < 16. That's why I use Canvas.getClipBounds(Rect) instead. (Do not use Canvas.getClipBounds().getHeight() as it allocates memory for a Rect.)

  • For reasons of performance, you should allocate objects before they are used in onDraw(). As drawCenter() will be called within onDraw() the object Rect r is preallocated as a field here.

I tried to put the code of the two top answers into my own code (August 2015) and made a screenshot to compare the results:

text centered three versions

The text should be centered within the red filled rectangle. My code produces the white text, the other two codes produces altogether the gray text (they are actually the same, overlapping). The gray text is a little bit too low and two much on the right.

This is how I made the test:

import android.app.Activity; import android.content.Context; import android.content.pm.ActivityInfo; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Rect; import android.graphics.RectF; import android.graphics.Typeface; import android.os.Bundle; import android.view.View; import android.view.ViewGroup; import android.widget.FrameLayout;  class MyView extends View {      private static String LABEL = "long";     private static float TEXT_HEIGHT_RATIO = 0.82f;      private FrameLayout.LayoutParams params = new FrameLayout.LayoutParams(0, 0);     private Rect r = new Rect();     private Paint paint = new Paint();     private Paint rectPaint = new Paint();      public MyView(Context context) {         super(context);     }      private void drawTextBounds(Canvas canvas, Rect rect, int x, int y) {         rectPaint.setColor(Color.rgb(0, 0, 0));         rectPaint.setStyle(Paint.Style.STROKE);         rectPaint.setStrokeWidth(3f);         rect.offset(x, y);         canvas.drawRect(rect, rectPaint);     }      // andreas1724 (white color):     private void draw1(Canvas canvas, Paint paint, String text) {         paint.setTextAlign(Paint.Align.LEFT);         paint.setColor(Color.rgb(255, 255, 255));         canvas.getClipBounds(r);         int cHeight = r.height();         int cWidth = r.width();         paint.getTextBounds(text, 0, text.length(), r);         float x = cWidth / 2f - r.width() / 2f - r.left;         float y = cHeight / 2f + r.height() / 2f - r.bottom;         canvas.drawText(text, x, y, paint);         drawTextBounds(canvas, r, (int) x, (int) y);     }      // Arun George (light green color):     private void draw2(Canvas canvas, Paint textPaint, String text) {         textPaint.setTextAlign(Paint.Align.CENTER);         textPaint.setColor(Color.argb(100, 0, 255, 0));         int xPos = (canvas.getWidth() / 2);         int yPos = (int) ((canvas.getHeight() / 2) - ((textPaint.descent() + textPaint.ascent()) / 2));         canvas.drawText(text, xPos, yPos, textPaint);     }      // VinceStyling (light blue color):     private void draw3(Canvas yourCanvas, Paint mPaint, String pageTitle) {         mPaint.setTextAlign(Paint.Align.LEFT);         mPaint.setColor(Color.argb(100, 0, 0, 255));         r = yourCanvas.getClipBounds();         RectF bounds = new RectF(r);         bounds.right = mPaint.measureText(pageTitle, 0, pageTitle.length());         bounds.bottom = mPaint.descent() - mPaint.ascent();         bounds.left += (r.width() - bounds.right) / 2.0f;         bounds.top += (r.height() - bounds.bottom) / 2.0f;         yourCanvas.drawText(pageTitle, bounds.left, bounds.top - mPaint.ascent(), mPaint);     }      @Override     protected void onSizeChanged(int w, int h, int oldw, int oldh) {         super.onSizeChanged(w, h, oldw, oldh);         int margin = 10;         int width = w - 2 * margin;         int height = h - 2 * margin;         params.width = width;         params.height = height;         params.leftMargin = margin;         params.topMargin = margin;         setLayoutParams(params);         paint.setTextSize(height * TEXT_HEIGHT_RATIO);         paint.setAntiAlias(true);         paint.setTypeface(Typeface.create(Typeface.SERIF, Typeface.BOLD_ITALIC));     }      @Override     protected void onDraw(Canvas canvas) {         super.onDraw(canvas);         canvas.drawColor(Color.rgb(255, 0, 0));         draw1(canvas, paint, LABEL);         draw2(canvas, paint, LABEL);         draw3(canvas, paint, LABEL);     } }  public class MainActivity extends Activity {      @Override     protected void onCreate(Bundle savedInstanceState) {         super.onCreate(savedInstanceState);         setRequestedOrientation (ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);         FrameLayout container = new FrameLayout(this);         container.setLayoutParams(new ViewGroup.LayoutParams(                 ViewGroup.LayoutParams.MATCH_PARENT,                 ViewGroup.LayoutParams.MATCH_PARENT));         container.addView(new MyView(this));         setContentView(container);     } }

Align vertically is difficult because text descent and ascent happened, lots of guys used Paint.getTextBounds() to retrieve the TextWidth and TextHeight, but it doesn't make the text center very much. Here we can use Paint.measureText() to calculate the TextWidth, the TextHeight we simply do subtracting with descent and ascent, then we got the most approach TextSize, the following work is fairly easy for each other.

// the Paint instance(should be assign as a field of class). Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG); mPaint.setTextSize(getResources().getDimension(R.dimen.btn_textsize));  // the display area. Rect areaRect = new Rect(0, 0, 240, 60);  // draw the background style (pure color or image) mPaint.setColor(Color.BLACK); yourCanvas.drawRect(areaRect, mPaint);  String pageTitle = "文字小说";  RectF bounds = new RectF(areaRect); // measure text width bounds.right = mPaint.measureText(pageTitle, 0, pageTitle.length()); // measure text height bounds.bottom = mPaint.descent() - mPaint.ascent();  bounds.left += (areaRect.width() - bounds.right) / 2.0f; bounds.top += (areaRect.height() - bounds.bottom) / 2.0f;  mPaint.setColor(Color.WHITE); yourCanvas.drawText(pageTitle, bounds.left, bounds.top - mPaint.ascent(), mPaint);

screen shot by the code

By the way, we highly recommend use RectF rather than Rect because the positions need more accurate values, in my experience, RectF done the top&bottom deviation just one pixel on xhdpi device, Rect would be two more.


Comments

Post a Comment

Popular posts from this blog

Converting A String To Int In Groovy

Answer : Use the toInteger() method to convert a String to an Integer , e.g. int value = "99".toInteger() An alternative, which avoids using a deprecated method (see below) is int value = "66" as Integer If you need to check whether the String can be converted before performing the conversion, use String number = "66" if (number.isInteger()) { int value = number as Integer } Deprecation Update In recent versions of Groovy one of the toInteger() methods has been deprecated. The following is taken from org.codehaus.groovy.runtime.StringGroovyMethods in Groovy 2.4.4 /** * Parse a CharSequence into an Integer * * @param self a CharSequence * @return an Integer * @since 1.8.2 */ public static Integer toInteger(CharSequence self) { return Integer.valueOf(self.toString().trim()); } /** * @deprecated Use the CharSequence version * @see #toInteger(CharSequence) */ @Deprecated public static Integer toInteger(String self) { return toInteg
Read more

"Cannot Create Cache Directory /home//.composer/cache/repo/https---packagist.org/, Or Directory Is Not Writable. Proceeding Without Cache"

Answer : if anyone pass through here, this is shorter solution: sudo chown -R $USER $HOME/.composer it seems to me the group information is missing in your command sudo chown -R <user> /home/<user>/.composer/cache/repo/https---packagist.org Shoud be sudo chown -R <user>:<group> /home/<user>/.composer/cache/repo/https---packagist.org But to avoid other permission issues, I would rather advise: sudo chown -R <user>:<group> /home/<user>/.composer/cache (you'll need access to other folders in there) and sudo chown <user>:<group> /home/<user>/.composer To make sure your user has permissions enough on the global composer folder. Mind the missing recursion so the user don't own keys created by root. If you need to find out the group: groups <user>
Read more

Android How Can I Convert A String To A Editable

Answer : As you probably found out, Editable is an interface so you cannot call new Editable() . However an Editable is nothing more than a String with Spannables, so use SpannableStringBuilder: Editable editable = new SpannableStringBuilder("Pass a string here"); If you only want to change the Spannables, never the text itself, you can use a basic SpannableString. Use Editable.Factory.getInstance().newEditable(str) From the android documentation: Returns a new SpannedStringBuilder from the specified CharSequence. You can override this to provide a different kind of Spanned.
Read more