2015-01-08 3 views
0

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

enter image description here

Здесь находятся решения, которые я имел в виду:

1 Черчение дуги с цвета заливки для большего круга и нарисуйте круг для малого круга. 2 проблемы с этим. Во-первых, внутренняя область круга больше не прозрачна, так как цвет берет больше. Вторая проблема заключается в том, что линии сегментирования внешнего круга идут до центра (не только по периметру внутреннего круга)

2) Нарисуйте дуги для большего внешнего круга и нарисуйте круг для внутреннего круга. Установите, чтобы цвет был заполнен, но не показывайте штрихи. Затем нарисуйте еще один внешний круг сверху, без заполнения, чтобы показывать штрихи. И затем нарисуйте линии между внутренним и внешним кругом, используя вычисления (угол и радиус), чтобы определить, где линии ... Очень запутанное решение, должен быть другой способ. Даже с этим решением все еще возникают проблемы с отображением цвета в центре, но, может быть, игра с градиентом может помочь.

Я так много читал на SO, но я не мог понять, правильный ответ, как много ответов устранило бы контроль параметров окружности

HEELP !!!

+0

Так вы пробовали https://stackoverflow.com/questions/9741300 включая https://github.com/PhilJay/MPAndroidChart и https://github.com/lecho/hellocharts-android библиотек? – shkschneider

+0

Спасибо, интересные ссылки. Но я предпочел бы сделать это сам в Canvas, а не использовать библиотеку или понять, как она работает (как они кажутся сложными). Плюс у меня есть другие вещи, которые мне нужно делать с прикосновениями, поэтому я хочу его создать – Snake

+0

Ow, в этом случае я недостаточно компетентен, чтобы помочь вам. Кроме того, некоторый код с вашей стороны был бы оценен другими, я полагаю. – shkschneider

ответ

3
@Override 
public void draw(Canvas canvas) { 
    float size = Math.min(getWidth(),getHeight()); 
    paint.setStrokeWidth(size/4); 
    paint.setStyle(Paint.Style.STROKE); 
    final RectF oval = new RectF(0, 0, getWidth(), getHeight()); 
    oval.inset(size/8,size/8); 

    paint.setColor(Color.RED); 
    Path redPath = new Path(); 
    redPath.arcTo(oval, 0, 120, true); 
    canvas.drawPath(redPath, paint); 

    paint.setColor(Color.GREEN); 
    Path greenPath = new Path(); 
    greenPath.arcTo(oval, 120, 120, true); 
    canvas.drawPath(greenPath, paint); 

    paint.setColor(Color.BLUE); 
    Path bluePath = new Path(); 
    bluePath.arcTo(oval, 240, 120, true); 
    canvas.drawPath(bluePath, paint); 

    paint.setStrokeWidth(2); 
    paint.setColor(0xff000000); 
    canvas.save(); 
    for(int i=0;i<360;i+=40){ 
     canvas.rotate(40,size/2,size/2); 
     canvas.drawLine(size*3/4,size/2,size,size/2,paint); 
    } 
    canvas.restore(); 

    final RectF ovalOuter = new RectF(0, 0, getWidth(), getHeight()); 
    ovalOuter.inset(1,1); 
    canvas.drawOval(ovalOuter,paint); 

    final RectF ovalInner = new RectF(size/4, size/4, size*3/4,size*3/4); 
    canvas.drawOval(ovalInner,paint); 
} 

Я рисую дуги, используя класс Path и штрихи. Style.STROKE дает дуги без заполнения. Ширина штриха установлена ​​в размере/4, что составляет четверть обзора. Половина этой ширины хода выходит за пределы, а вторая половина идет внутрь, как это:

XXXXXXXX внешняя граница дуги шириной 5

XXXXXXXX

----------- - инсульт

XXXXXXXX

XXXXXXXX внутренняя граница дуги

Вот почему я использую врезки - мне нужно, чтобы компенсировать инсультном немного в Орде чтобы соответствовать ему в представлении. Без вставки дуги разрезаются всеми четырьмя сторонами вида.

И почему вращение холста? Поскольку проще повернуть холст с помощью встроенных методов, чем вычислять строки вручную. Вращение использует тригонометрические функции и быстро становится довольно сложным, трудно читаемым и подверженным ошибкам. В основном я вращаю бумагу и рисую прямые линии.

enter image description here

+0

Вау, большое спасибо @Zielony за это. Я пытаюсь это понять, но у меня проблемы. Почему вы делаете вставку на овал? Почему вращение холста? Любое объяснение полезно – Snake

+1

Конечно, извините за это :) Я собираюсь добавить его в ответ – Zielony

+0

Большое вам спасибо за великолепное объяснение :) – Snake

Смежные вопросы