Как генерировать динамические линии вокруг круга в Android - PullRequest
Новая
       17

Как генерировать динамические линии вокруг круга в Android

1 голос
/ 10 июля 2019

Я хочу создать динамические линии вокруг круга, который является изображением шарика. Размер линий зависит от общего числа раундов, если общее количество раундов равно 10, то к глобу подходит 10 строк.

Я попробовал приведенный ниже код для цикла, динамически создаются линии, но они не имеют круглую форму. Пожалуйста, помогите мне решить эту проблему. Спасибо.

Вот изображение, на котором вы можете видеть красный. желтая и зеленая линия вокруг луны:

enter image description here

Вот код: 

int Stages = 10;
int circleCircumfarence = 785;
int spaceBetweenLine = 10;
int allspacesSize = 785 - (spaceBetweenLine * Stages);
int onelinesize = allspacesSize / 10; //250 is the width of circle
int x1 = (int) imgCatfill.getWidth() / 2;//image of globe 
int y1 = 10;
int x2 = (int) x1 + onelinesize;
int y2 = x2 / 10;
int curveRadius = 5;
int midX = x1 + ((x2 - x1) / 2);
int midY = y1 + ((y2 - y1) / 2);
float xDiff = midX - x1;
float yDiff = midY - y1;
double angle = (Math.atan2(yDiff, xDiff) * (180 / Math.PI)) - 45;
double angleRadians = Math.toRadians(angle);
float pointX = (float) (midX + curveRadius * Math.cos(angleRadians));
float pointY = (float) (midY + curveRadius * Math.sin(angleRadians));
path.moveTo(x1, y1);
path.cubicTo(x1, y1, pointX, pointY, x2, y2);
canvas.drawPath(path, paint);

1 Ответ

1 голос
/ 10 июля 2019

Это можно сделать, используя метод canvas.drawTextOnPath и изменяя положения x и y в зависимости от ширины текста

Ссылочный код 

private String QUOTE = "123456789123456789";
private Path circle;
private Paint mCirlcePaint;
private Paint tPaint;
private Rect textBounds;
private int mTextWidth, mTextHeight, centerX, centerY;

private float radius;

public GraphicsView(Context context) {
    super(context);
    circle = new Path();

    tPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
    tPaint.setStyle(Paint.Style.FILL_AND_STROKE);
    tPaint.setColor(Color.RED);
    tPaint.setTextSize(80f);
    textBounds = new Rect();

    tPaint.getTextBounds(QUOTE, 0, QUOTE.length(), textBounds);
    mTextWidth = Math.round(tPaint.measureText(QUOTE.toString())); // Use measureText to calculate width
    mTextHeight = textBounds.height(); // Use height from getTextBounds()

    mCirlcePaint = new Paint();
    mCirlcePaint.setStyle(Paint.Style.FILL);
    mCirlcePaint.setColor(Color.BLUE);

    radius = (float) ((mTextWidth) / (Math.PI));

}

@Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);
    centerX = w / 2;
    centerY = h / 2;

}

@Override
protected void onDraw(Canvas canvas) {

    canvas.rotate(180, getWidth() / 2, getHeight() / 2);
    canvas.drawCircle(centerX, centerY, radius, mCirlcePaint);
    circle.addCircle(centerX, centerY, radius, Path.Direction.CW);
    canvas.drawTextOnPath(QUOTE, circle, 0, 0, tPaint);

   }

}

Если длина текста больше, чем необходим вам холстчтобы уменьшить размер текста или использовать полный круг.replace radius = (float) ((mTextWidth) / (Math.PI)) с radius = (float) ((mTextWidth) / (2*(Math.PI)))

...