What's the best way to dynamically create rounded rectangles? (i.e. width/height of the rectangle adjusts to fit the content, accurately maintaining the correct radius of the rounded corners)

Preferably would like to use a combination of masking and D.rect/D.circle over using images, so I don't have to rely on the image itself for determining the radius of the corners, but if this is not possible (or if it's not possible to draw anti-aliased circles (i.e. blurred edges) using D.circle instead of aliased), then using images will do.

Any ideas?

The only one I can really think of would be using a 9-sliced image so-to-speak. Basically, create one rounded corner in Photoshop, draw it 4 times at each of the corners (rotating 90 degrees each time, of course), then draw 4 D.rect's connecting the corners (so that now you have the border of a rounded rectangle), before finally drawing the last D.rect in the middle, creating a seamless rounded rectangle.

I suppose this way will work and I've heard of people doing it this before -- just seems a bit inefficient, having to draw 9 different times to create 1 rounded rectangle but, I suppose, this is the easiest way (perhaps the only way?).

----------

Here's another possibility I just thought of:

Create the rounded corner in Photoshop and invert it (so the image is like a square with the corner cut out of it), then dynamically create an image through code - drawing the "inverted corner" 4 times where each corner should be (again, rotating 90 degrees each time), before finally drawing 1 D.rect covering the entire rectangle, using the previously created image (of the 4 "inverted corners") as a mask. That is, assuming you can draw a D.rect using a mask - I believe you can, but I'm not on my desktop at the moment to check.

I believe both ways are doable. The second one seems cleaner, in my opinion, but may actually take more processing power to compute (though would still be very little in the grand scheme of things).

I think your first idea is the most common way to handle something like this for a 2D image. I think you'll find that even the EE GUI does it like this for the controls. I know I have done it like this before.

As long as you keep all your image parts in a single source image, then EE should draw it all as a single batch, so performance shouldn't be a problem. You could draw a number of these on the screen and they should all be done as a single draw call. However, you probably need Esenthel to confirm if that is indeed the case. Unfortunately, EE doesn't expose this performance metric, so we can't check it ourselves, only FPS, which isn't too helpful.

you can use Image::drawButton with predefined texture,
gui object Button uses that function
also you can investigate the "engine.pak/gui/button.gfx" texture

Cool, I may try this out. I noticed the drawButton method when I was implementing the 9-sliced image technique, but I wasn't sure how to use it or how it worked exactly, so I decided to just ignore it.