# is there a method to draw/fill a rounded rectangle?

• Funny, i would have thought Bresenham´s would be a lot faster. It seems to be (i just checked in the emulator, not on the real hardware), but only below a radius of about 12. Most of the code is straight from Wikipedia, no optimization at all:

function bRoundedRectangle (x1,y1,x2,y2,r) {
var f = 1 - r;
var ddF_x = 0;
var ddF_y = -2 * r;
var x = 0;
var y = r;
g.drawLine(x1+r,y1,x2-r,y1);
g.drawLine(x1+r,y2,x2-r,y2);
g.drawLine(x1,y1+r,x1,y2-r);
g.drawLine(x2,y1+r,x2,y2-r);
var cx1=x1+r;
var cx2=x2-r;
var cy1=y1+r;
var cy2=y2-r;
while(x < y)
{
if(f >= 0)
{
y--;
ddF_y += 2;
f += ddF_y;
}
x++;
ddF_x += 2;
f += ddF_x + 1;
g.setPixel(cx2 + x, cy2 + y);
g.setPixel(cx1 - x, cy2 + y);
g.setPixel(cx2 + x, cy1 - y);
g.setPixel(cx1 - x, cy1 - y);
g.setPixel(cx2 + y, cy2 + x);
g.setPixel(cx1 - y, cy2 + x);
g.setPixel(cx2 + y, cy1 - x);
g.setPixel(cx1 - y, cy1 - x);
}
}

• this code is more compact than mine and doesn't need Math.sin, at least - but I'd have to modify it in order to be able to draw and/or fill a rounded rectangle. Radii below 12 are certainly the most common ones.

Thanks a lot for this contribution!

• Here is a version for filled rectangles. Performance is roughly the same, faster for r<=12, slower for larger radii. Performance is an issue here, on my Bangle2, "bFillRoundedRectangle(10,10,160,160,13)­;" takes about 85ms. For UI use, i think a LUT for rounded corners would be the best approach. All coordinates needed for a circle covering the complete screen would take up just 52 bytes.

function bFillRoundedRectangle (x1,y1,x2,y2,r) {
var f = 1 - r;
var ddF_x = 0;
var ddF_y = -2 * r;
var x = 0;
var y = r;
g.fillRect(x1+r,y1,x2-r,y2);
var cx1=x1+r;
var cx2=x2-r;
var cy1=y1+r;
var cy2=y2-r;
while(x < y)
{
if(f >= 0)
{
y--;
ddF_y += 2;
f += ddF_y;
}
x++;
ddF_x += 2;
f += ddF_x + 1;
g.drawLine(cx1-x,cy1-y,cx1-x,cy2+y);
g.drawLine(cx1-y,cy1-x,cx1-y,cy2+x);
g.drawLine(cx2+x,cy1-y,cx2+x,cy2+y);
g.drawLine(cx2+y,cy1-x,cx2+y,cy2+x);
}
}