Rounded rectangles [Finally Solved, see last post]

Programming, for all ages and all languages.
osmiumusa
Posts: 20
Joined: Sun Dec 12, 2010 5:47 pm

Rounded rectangles [Finally Solved, see last post]

Post by osmiumusa »

Hello everyone!

After countless attempts at, well, everything I've been able to come up with, I turn to you in hopes of someone helping me.

My problem seems simple - I can't figure out how to write a graphics routine that draws a rounded rectangle.

If anyone can help, please do, because I'm really stumped on this one.

Regards,

Osmiumusa :mrgreen:
Last edited by osmiumusa on Sun May 08, 2011 7:53 pm, edited 1 time in total.
User avatar
Karlosoft
Member
Member
Posts: 277
Joined: Thu Feb 14, 2008 10:46 am
Location: Italy
Contact:

Re: Rounded rectangles

Post by Karlosoft »

They are four lines plus 4 halves of a circle... so you should have a prototype like

void drawRoundedBox(uint16 x0, uint16 y0, uint16 x1, uint16 y1, uint16 ray);

So...

Code: Select all

void drawRoundedBox(uint16 x0, uint16 y0, uint16 x1, uint16 y1, uint16 ray){
if(x0>x1)ROTATE(uint16, x0, x1);    //This is a macro.. 
if(y0>y1)ROTATE(uint16, y0, y1);
//You should also make controls on the length of the ray
uint16 x0v=x0+ray;
uint16 x1v=x1-ray;
drawLine(x0v,y0,x1v,y0);  //Upper line
drawLine(x0v,y1,x1v,y1);  //Bottom line

uint16 y0v=y0+ray;
uint16 y1v=y1-ray;
drawLine(x0,y0v,x1,y0);  //Upper line
drawLine(x0,y1v,x1,y1);  //Bottom line

//And now the circles....
circle(x0v,y0v,180,90); //Center x, center y, from angle to angle
circle(x1v,y0v,90,0);
circle(x0v,y1v,270,180);
circle(x1v,y1v,360,270);
}
User avatar
xvedejas
Member
Member
Posts: 168
Joined: Thu Jun 04, 2009 5:01 pm

Re: Rounded rectangles

Post by xvedejas »

given:

Code: Select all

width
height
radius
xpos
ypos
note that (0, 0) represents the upper-left of the screen and (xpos, ypos) is the upper-left of the rectangle.

fill in all pixels that meet all the following:

Code: Select all

x >= xpos
y >= ypos
x < xpos + width
y < ypos + width
if x < xpos + radius and y < ypos + radius, then distance((x, y), (xpos + radius, ypos + radius)) < radius
if x > xpos + width - radius and y < ypos + radius, then distance((x, y), (xpos + width - radius, ypos + radius)) < radius
if x < xpos + radius and y < ypos + height - radius, then distance((x, y), (xpos + radius, ypos + height - radius)) < radius
if x < xpos + width - radius and y < ypos + height - radius, then distance((x, y), (xpos + width - radius, ypos + height - radius)) < radius
Obviously it wouldn't be wise to go through every pixel and see if it meets all these conditions, but at least this should show you the logic behind things.
osmiumusa
Posts: 20
Joined: Sun Dec 12, 2010 5:47 pm

Re: Rounded rectangles

Post by osmiumusa »

Karlosoft,

Thank you very much. What would be on the rotate macro? Or is is built into C?
Again - how would I go about making the arc. That's my main issue. Bezier curves crash the system.

Thank you so much

Osmiumusa :mrgreen: :mrgreen:
User avatar
Karlosoft
Member
Member
Posts: 277
Joined: Thu Feb 14, 2008 10:46 am
Location: Italy
Contact:

Re: Rounded rectangles

Post by Karlosoft »

ROTATE is a macro I wrote in my code, it is something like this
#define ROTATE(a,b,c) {(a) x=(b);(b)=(c);(c)=x;}
Bezier curves? The bezier curves aren't able to generate a circle without a change in the original formula. You can simply use sinus and cosinus math functions.
User avatar
VolTeK
Member
Member
Posts: 815
Joined: Sat Nov 15, 2008 2:37 pm
Location: The Fire Nation

Re: Rounded rectangles

Post by VolTeK »

Karlosoft wrote:sinus and cosinus
Who taught you your Math an English.


If you are using a 2d interface, id suggest Polar Coordinates. In this case you will use it 4 times. Each for every angle. You will only need 90 degrees of top right, top left, bottom right, bottom left angles for each part of the circle. Id also suggest making this a function to post coordinates where and how big of an angle using polar coordinates.


Polar coordinates will help you make alot of "cool" curves and shapes, as well as its main purpose (a circle). Cosine and Sine will be the only trigonometry you will use for this however.
User avatar
Combuster
Member
Member
Posts: 9301
Joined: Wed Oct 18, 2006 3:45 am
Libera.chat IRC: [com]buster
Location: On the balcony, where I can actually keep 1½m distance
Contact:

Re: Rounded rectangles

Post by Combuster »

You can draw a circle without sin/cos/sqrt or even a division - just remember the pythagorean equality a²+b²=c² and that in the case of discretisation you want to have adjoining pixels while minimising the error |a²+b²-c²|. It's a lot faster too.
"Certainly avoid yourself. He is a newbie and might not realize it. You'll hate his code deeply a few years down the road." - Sortie
[ My OS ] [ VDisk/SFS ]
User avatar
gravaera
Member
Member
Posts: 737
Joined: Tue Jun 02, 2009 4:35 pm
Location: Supporting the cause: Use \tabs to indent code. NOT \x20 spaces.

Re: Rounded rectangles

Post by gravaera »

GhostXoPCorp wrote:
Karlosoft wrote:sinus and cosinus
Who taught you your Math an English. (Where is the question mark?)


If you are using a 2d interface, id suggest Polar Coordinates. In this case you will use it 4 times. Each for every angle. You will only need 90 degrees of top right, top left, bottom right, bottom left angles for each part of the circle. Id also suggest making this a function to post coordinates where and how big of an angle using polar coordinates.


Polar coordinates will help you make alot of "cool" curves and shapes, as well as its main purpose (a circle). Cosine and Sine will be the only trigonometry you will use for this however.
Apparently the same person who taught you :)

--Don't try to look down, unless you're standing in a better place,
gravaera
17:56 < sortie> Paging is called paging because you need to draw it on pages in your notebook to succeed at it.
User avatar
Karlosoft
Member
Member
Posts: 277
Joined: Thu Feb 14, 2008 10:46 am
Location: Italy
Contact:

Re: Rounded rectangles

Post by Karlosoft »

If English language uses the words in the wrong ways it isn't my fault. Sine and cosine derive from sinus and cosinus latin words. As you say cactus, data, momentum- perhaps making the plurals cactuses or momentums instead of cacti or momenta- I think that I'm allowed to use the original latin words. It's easy to attack people for their mistakes, why don't you study a bit of Latin before?
I know that my English is full of mistakes, It's my fault? If the Italian instruction system gives us only 4 hours a week, 1 of grammar and 3 of English literature what should I do? Why don't you think before attacking people....
pcmattman
Member
Member
Posts: 2566
Joined: Sun Jan 14, 2007 9:15 pm
Libera.chat IRC: miselin
Location: Sydney, Australia (I come from a land down under!)
Contact:

Re: Rounded rectangles

Post by pcmattman »

A quick Google search shows "sinus" and "cosinus" being valid (albeit "unusual" for many here) terms for "sine" and "cosine" (synonyms) - "sine, From Latin sinus".

In my humble opinion it would be best that we avoid correcting each other's use of English or terminology (except where it is absolutely and provably incorrect) and focus on actually answering questions.
User avatar
VolTeK
Member
Member
Posts: 815
Joined: Sat Nov 15, 2008 2:37 pm
Location: The Fire Nation

Re: Rounded rectangles

Post by VolTeK »

Karlosoft wrote:It's my fault? If the Italian instruction system gives us only 4 hours a week, 1 of grammar and 3 of English literature what should I do? Why don't you think before attacking people....
Lol calm down ?
Darwin
Member
Member
Posts: 43
Joined: Sun Jan 16, 2011 6:58 pm
Location: United States

Re: Rounded rectangles

Post by Darwin »

GhostXoPCorp wrote:
Karlosoft wrote:It's my fault? If the Italian instruction system gives us only 4 hours a week, 1 of grammar and 3 of English literature what should I do? Why don't you think before attacking people....
Lol calm down ?
You're the one who unjustly criticized him.
Last edited by Darwin on Mon Jun 25, 2012 1:29 am, edited 1 time in total.
TylerH
Member
Member
Posts: 285
Joined: Tue Apr 13, 2010 8:00 pm
Contact:

Re: Rounded rectangles

Post by TylerH »

GhostXoPCorp wrote:If you are using a 2d interface, id suggest Polar Coordinates. In this case you will use it 4 times. Each for every angle. You will only need 90 degrees of top right, top left, bottom right, bottom left angles for each part of the circle. Id also suggest making this a function to post coordinates where and how big of an angle using polar coordinates.
Great idea! Now, how does he draw straight lines?
GhostXoPCorp wrote:Cosine and Sine will be the only trigonometry you will use for this however.
Not if he wants to draw straigt lines.
User avatar
VolTeK
Member
Member
Posts: 815
Joined: Sat Nov 15, 2008 2:37 pm
Location: The Fire Nation

Re: Rounded rectangles

Post by VolTeK »

These trigonometric functions should be used for the curves around the angles of the rectangle. Read again and you will know that the curves are all i am talking about, straight lines in this situation are the least of concern as they should be easier to draw. However i have given advice on the curves portion of the rectangle.

Your failing at being a smart @$$ towards my answer. Please try again in a different response later :)
User avatar
MDM
Member
Member
Posts: 57
Joined: Wed Jul 21, 2010 9:05 pm

Re: Rounded rectangles

Post by MDM »

GhostXoPCorp wrote:These trigonometric functions should be used for the curves around the angles of the rectangle. Read again and you will know that the curves are all i am talking about, straight lines in this situation are the least of concern as they should be easier to draw. However i have given advice on the curves portion of the rectangle.

Your failing at being a smart @$$ towards my answer. Please try again in a different response later :)
Your ideas work, however, they'd be inefficient, and I wouldn't recommend it for low level drawing code. You were rude, and you are still being rude. It doesn't make you look cool or intelligent, it makes you look obnoxious.
Last edited by MDM on Sun Apr 10, 2011 12:30 pm, edited 1 time in total.
Post Reply