Android canvas 绘制多个等距的矩形

Question

我有 4 个Strings。我想在每个周围画一个矩形，并让它们彼此等距。我有 "works" 的代码，但我的最后一个矩形需要 3 个空格来使距离相等，我不明白为什么。我正在使用 LG G Watch R，以防相关。

private void drawDate(Canvas canvas, float centerX, float centerY)
    {
        float x = centerX + 75f;
        float y = centerY + 50f;
        String dayOfWeek = daysOfWeek[mTime.weekDay] + ",";
        String month = months[mTime.month];
        String monthDay = mTime.monthDay + ",";
        String year = Integer.toString(mTime.year);
        float height = outLinePaint.getTextSize();
        float totalWidth = outLinePaint.measureText(String.format("%s %s %s %s", dayOfWeek, month, monthDay, year));
        final float spaceWidth = outLinePaint.measureText(" ");
        x -= totalWidth/2f;
        outLinePaint.setStyle(Paint.Style.FILL);

        float halfWidth = outLinePaint.measureText(dayOfWeek)/2f;
        canvas.drawRect(x - halfWidth, y - height, x + halfWidth, y + height /2f , whitePaint);
        canvas.drawText(dayOfWeek, x, y, outLinePaint);

        x += (halfWidth*2f)+spaceWidth;
        halfWidth = outLinePaint.measureText(month)/2f;
        canvas.drawRect(x - halfWidth, y - height, x + halfWidth, y + height /2f , whitePaint);
        canvas.drawText(month, x, y, outLinePaint);

        x += (halfWidth*2f)+spaceWidth;
        halfWidth = outLinePaint.measureText(monthDay)/2f;
        canvas.drawRect(x - halfWidth, y - height, x + halfWidth, y + height /2f , whitePaint);
        canvas.drawText(monthDay, x, y, outLinePaint);

        //THIS LINE
        x += (halfWidth*2f)+spaceWidth+spaceWidth+spaceWidth;
        //it looks right on the canvas, but why can I not simply
        //x += (halfWidth*2f)+spaceWidth; like above?
        halfWidth = outLinePaint.measureText(year)/2f;
        canvas.drawRect(x - halfWidth, y - height, x + halfWidth, y + height /2f , whitePaint);
        canvas.drawText(year, x, y, outLinePaint);

        outLinePaint.setStyle(Paint.Style.STROKE);
    }

注意：此 "BUG" 仅影响最后一个字符串

这是我所期望的（以及我使用 x += (halfWidth*2f)+spaceWidth+spaceWidth+spaceWidth; 时得到的结果）：

但是，如果我像使用其他 3 个一样使用 x += (halfWidth*2f)+spaceWidth;，我会得到：

Answer 1

我已经解决了。我无法让@pskink 的示例为我的生活工作（它没有利用我的 canvas）。问题是我的居中对齐。

x 在我的中间 Rect 而不是左边。当我将 x 的宽度添加到 x.

时，我希望 x 成为我的 Rect 中最左边的点

我已将文本设置为左对齐（因此 x 是我最左边的点）并将我的 drawDate() 方法更改为：

来修复它

float spaceWidth;
private void drawDate(float centerX, float centerY)
{
    float x = centerX + centerX*DATE_AND_COMPASS_X_OFFSET;
    float y = centerY + centerY*DATE_AND_COMPASS_Y_OFFSET;
    String dayOfWeek = daysOfWeek[mTime.weekDay] + ",";
    String month = months[mTime.month];
    String monthDay = mTime.monthDay + ",";
    String year = Integer.toString(mTime.year);
    float height = outLinePaint.getTextSize();
    float totalWidth = outLinePaint.measureText(String.format("%s %s %s %s", dayOfWeek, monthnthDay, year));
    spaceWidth = outLinePaint.measureText(" ");
    outLinePaint.setStyle(Paint.Style.FILL);
    x-=totalWidth/2;
    x+=drawDateInline(dayOfWeek, x, y, height);
    x+=drawDateInline(month, x, y, height);
    x+=drawDateInline(monthDay, x, y, height);
    drawDateInline(year, x, y, height);
    outLinePaint.setStyle(Paint.Style.STROKE);
}

private float drawDateInline(String word, float x, float y, float height) {
    float width = outLinePaint.measureText(word);
    canvas.drawRect(x, y - height, x + width, y + height /2f, whitePaint);
    canvas.drawText(word, x, y, outLinePaint);
    return width+spaceWidth;
}

我也不知道这是怎么回事"bad approach"。

Android canvas 绘制多个等距的矩形

Android canvas draw multiple rectangles of equal distance

android

canvas

rect