Запись текста с помощью canvas (в режиме onDraw)

#android #canvas #view

#Android #холст #Вид

Вопрос:

У меня есть этот вид (вид выбора цвета)

 public class ColorPickerOvalView extends View {

    private Paint paint;
    private Paint centerPaint;
    private Paint paintText;
    private final int[] colorsArray;
    private OnColorChangedListener changedListener;
    private String key;
    private boolean trackingCenter;
    private boolean highlightCenter;

    private RectF rectF;

    private static final int CENTER_X = 120;
    private static final int CENTER_Y = 120;
    private static final int CENTER_RADIUS = 39;
    private static final float PI = 3.1415926f;

    public ColorPickerOvalView(Context context) {
        super(context);
        colorsArray = new int[]{
                0xFFFF0000, 0xFFFF00FF, 0xFF0000FF, 0xFF00FFFF, 0xFF00FF00,
                0xFFFFFF00, 0xFFFF0000
        };
    }

    public ColorPickerOvalView(Context context, AttributeSet attrs) {
        super(context, attrs);
        colorsArray = new int[]{
                0xFFFF0000, 0xFFFF00FF, 0xFF0000FF, 0xFF00FFFF, 0xFF00FF00,
                0xFFFFFF00, 0xFFFF0000
        };
    }

    public ColorPickerOvalView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        colorsArray = new int[]{
                0xFFFF0000, 0xFFFF00FF, 0xFF0000FF, 0xFF00FFFF, 0xFF00FF00,
                0xFFFFFF00, 0xFFFF0000
        };
    }

    public void init(OnColorChangedListener listener, int color, String key) {
        //super(c);
        changedListener = listener;

        Shader shader = new SweepGradient(0, 0, colorsArray, null);

        paint = new Paint(Paint.ANTI_ALIAS_FLAG);
        paint.setShader(shader);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(50);

        centerPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        centerPaint.setColor(color);
        centerPaint.setStrokeWidth(10);

        paintText = new Paint();
        paintText.setColor(Color.WHITE);

        this.key = key;

        float raio = CENTER_X - paint.getStrokeWidth() * 0.5f;
        rectF = new RectF(-raio, -raio, raio, raio);
    }


    @Override
    protected void onDraw(Canvas canvas) {

        canvas.translate(CENTER_X, CENTER_X);

        canvas.drawOval(rectF, paint);
        canvas.drawCircle(0, 0, CENTER_RADIUS, centerPaint);

        //write the text
        canvas.drawText("OK", 0, 0, paintText);

        if (trackingCenter) {
            int color = centerPaint.getColor();
            centerPaint.setStyle(Paint.Style.STROKE);

            if (highlightCenter) {
                centerPaint.setAlpha(0xFF);
            } else {
                centerPaint.setAlpha(0x80);
            }

            canvas.drawCircle(0, 0, CENTER_RADIUS   centerPaint.getStrokeWidth(), centerPaint);

            centerPaint.setStyle(Paint.Style.FILL);
            centerPaint.setColor(color);
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        setMeasuredDimension(CENTER_X * 2, CENTER_Y * 2);
    }

    ...

}
  

и я хочу централизованно написать «OK» в circle, но мое ok остается неправильным (не централизовано).
Мне нужно, чтобы этот текст находился точно в центре круга.

введите описание изображения здесь

Как я могу централизовать этот текст? и как я изменяю его размер?

Спасибо

Ответ №1:

Вы должны переместить текст на половину его ширины влево. Это означает:

 float textWidth = paintText.measureText(timeText);
float xOffset = textWidth / 2;
canvas.drawText("OK", -xOffset, 0, paintText);
  

Ответ №2:

DrawText () начинает рисование в левом нижнем углу первого символа в строке. Если вы хотите, чтобы текст располагался по центру, сначала вам нужно вычислить размер всего блока текста, а затем сместить вашу начальную позицию.

Чтобы получить размер текста, вы можете использовать Paint.getTextBounds().

Комментарии:

1. @EmilyR помогло ли это?

2. Действительно помогло! Большое спасибо. И чтобы изменить размер, я нашел это: `float txtSize = TypedValue.applyDimension(типизированное значение. COMPLEX_UNIT_DIP, 20, getResources().getDisplayMetrics()); paintText.setTextSize(txtSize); @Peri Hartman Спасибо

3. Рад слышать. Вы могли бы внимательно взглянуть на Paint. В нем есть настройки для всех видов параметров, включая размер текста.