Search code examples
androidwear-oswatch-face-api

Problems Finding Center of Android Wear Watchface


Screenshot after my code was finished enter image description here

I have looked all over, but nothing has worked. Every time I try finding the center of the screen for my watch face, it always end up slightly higher than the center, and to the far right of the screen (This is different than the problem that the original template from Android Studio has, where the Watch face is slightly up and all the way to the far left of the screen). What could I be doing wrong?

(First screenshot on Left: My problem. Second screenshot: Original form of the Android Wear template from Android Studio)

@Override
    public void onDraw(Canvas canvas, Rect bounds) {
        if (isInAmbientMode()) {canvas.drawColor(Color.BLACK);
        }
        else {
            canvas.drawRect(0, 0, bounds.width(), bounds.height(), mBackgroundPaint);
        }

        // Draw H:MM in ambient mode or H:MM:SS in interactive mode.
        long now = System.currentTimeMillis();
        mCalendar.setTimeInMillis(now);
        int width = bounds.width();
        int height = bounds.height();
        float centerX = width / 2f;
        float centerY = height / 2f;

        String text = mAmbient
                ? String.format("%d:%02d", mCalendar.get(Calendar.HOUR),
                mCalendar.get(Calendar.MINUTE))
                : String.format("%d:%02d", mCalendar.get(Calendar.HOUR),
                mCalendar.get(Calendar.MINUTE));
        canvas.drawText(text, centerX, centerY, mTextPaint);
    }

Full code can be found here


Solution

  • As far as i can tell from a quick look on your sources you already calculate mTextXOffset and mTextYOffset but don't use it for your draw call, hence the texts origin is centered in your problematic screenshot instead of the texts center.

    adjusting your centerX and centerY by mTextXOffset and mTextYOffset should do the trick.