Text Center on Watch

Question

I am trying several ways to center 3 lines of text on a clock and seem to be unable to figure this out. New guard jewelry services require you to draw on canvas. I initialize the text offset by grabbing the length of the text of each line and dividing by 2.

mXDateOffset = mTextDateColorPaint.measureText("May 21, 2015") /2; mXTimeOffset = mTextTimeColorPaint.measureText("12:00:00")/2; mXBatteryOffset = mTextBatteryColorPaint.measureText("99%") /2 ; 

Then, when I set the text and drawing elements to the canvas, I find the center of the rectangle (screen) minus the screen to find the starting position of the text.

 canvas.drawText( timeText, bounds.centerX() - mXTimeOffset, 40.0f, mTextTimeColorPaint ); canvas.drawText( date, bounds.centerX() - mXDateOffset, 90.0f, mTextDateColorPaint); canvas.drawText( mBatteryLevel, bounds.centerX() - mXBatteryOffset, 130.0f, mTextBatteryColorPaint ); 

What I get is ...

Not sure what else to do.

Answer 1

There are many answers in this answer, here is what I got from accessing onDraw methods:

in onCreate () sets offsets

 mYTimeOffset = getResources().getDimension( R.dimen.y_offset ); mYDateOffset = getResources().getDimension( R.dimen.y_date_offset ); mYBatteryOffset = getResources().getDimension( R.dimen.y_battery_offset ); 

then call drawtime and set the canvas options

  private void drawTimeText(Canvas canvas, Rect bounds) { String timeText = getHourString() + ":" + String.format( "%02d", mDisplayTime.minute ); if( isInAmbientMode() || mIsInMuteMode ) { timeText += ( mDisplayTime.hour < 12 ) ? "AM" : "PM"; } else { timeText += String.format( ":%02d", mDisplayTime.second); } String date = new SimpleDateFormat(DATE_FORMAT_DISPLAYED).format(Calendar.getInstance().getTime()); canvas.drawText( timeText, bounds.centerX() - (mTextTimeColorPaint.measureText(timeText))/2, mYTimeOffset, mTextTimeColorPaint ); canvas.drawText( date, bounds.centerX() - (mTextDateColorPaint.measureText(date))/2, mYDateOffset, mTextDateColorPaint); if (mBatteryLevel != null) canvas.drawText( mBatteryLevel, bounds.centerX() - (mTextBatteryColorPaint.measureText(mBatteryLevel))/2, mYBatteryOffset, mTextBatteryColorPaint ); }