Drawing rings around rings...around other rings.
in
Programming Questions
•
2 years ago
Which may or may not have been drawn around several other rings. You get the point though, right?
I'm really new to this, fair warning, but I'm trying to build a class responsible for drawing a ring. My initial thought was to either simply draw an ellipse the color of the background and then do a thick stroke around the ellipse OR draw an ellipse and then draw a smaller one the color of the background inside it.
This, to me, had two problems. One, it's dependent upon the stacking order, so if I draw lots of them and want them nested within each other, I'd have to draw them in the order I wanted them in.
The second problem I saw is that it's dependent upon knowing the color of the background.
Now, I'm all for reusability and loose coupling and all that, so I though to try and essentially draw a ring using a series of smaller ellipses drawn very close to each other. Much like painting with a brush. Brilliant, I know.
Problem is, I'm not brilliant and I have no idea what I'm doing.
My current attempt looks something like this:
- void setup() {
- smooth();
- size(400, 400);
- }
- void draw() {
- background(0);
- Ring r = new Ring(width * 0.5, height * 0.5, 100.00, 50, #CCFF66);
- Ring r2 = new Ring(width * 0.5, height * 0.5, 180.00, 50, #CC2266);
- r.display();
- r2.display();
- fill(#33EECC);
- ellipse(width * 0.5, height * 0.5, 20, 20);
- }
- class Ring {
- float x, y, r, startx, starty;
- int thickness;
- color c;
- Ring(float x, float y, float r, int thickness, color c) {
- this.x = x;
- this.y = y;
- this.starty = (y - r) + (thickness * 0.5);
- this.thickness = thickness;
- this.c = c;
- }
- void display() {
- noStroke();
- fill(this.c);
- float bx = this.x;
- float by = this.starty;
- for(int i = 0; i < 360; i++) {
- pushMatrix();
- rotate(i);
- translate(bx, by);
- ellipse(0, 0, this.thickness, this.thickness);
- popMatrix();
- }
- }
- }
However, the code above gives me:
So obviously, it isn't drawing a circle in the direction I need it to, and also the rings are far too big, and they're overlapping.
My grand scheme for this is to actually draw a fading tail ring, sort of like a gradient to transparency where the ring connects back with itself, but one step at a time.
Has anyone done anything similar? I'm really stumped here.
1
