You all seem pretty convinced that it will work but you don't seem to be able to see what gradient i am talking about. So i have made an image highlighting the gradients:

As you can see, the gradient runs from the top of the inner circle to the bottom of it. And as you can plainly see, it will be broken if i compress the image. Which is why (at least for my image) i can only stretch horizontally. I will, however, still scale the left & right sections but will keep it at a 1:1 aspect ratio.

Quote:Original post by lightbringer
Since it seems that you're stumped on actually coding the draw function

Not really stumped, just lazy [grin]. No, i have got it pretty much under control now, thanks.

I'm not trying to be a smartass or something, but why not make a separate bitmap for every button size? You can size/resize them in your photoshop or gimp and load them separately.
Instead of thinking up a complex GUI system you can do this resizing trick in your image editor in half an hour.
If you're worried about resizing your GUI: let OpenGL scale the texture for you. Pick an insane texture resolution so you won't get a pixelated effect when someone has a large screen resolution.

Just saying, it seems to be the path of the least resistance.

Ok, first of all, it's not that big of a problem. In fact, i thought i made myself clear on numerous occasions that it was no problem at all. I am going to use horizontal divisions only and that's final! I was merely trying to convince you that it was impossible to do it the suggested way.

Quote:Original post by lightbringer
We can't see what you're talking about if the image you're talking about is totally different from what you showed us :)

But it's not a different image!!! That's the whole point. I didn't think you could see the gradient properly in the original image since it's a subtle change in colour so i highlighted the feature by drawing the gradient with contrasting colours. The image above has the EXACT SAME gradient as the original. Take a close look :)

Quote:Original post by lightbringer
Even if you keep it at the same aspect ratio, there is only a finite amount of data there, this isn't a vector graphic - after a short while, it will start looking blocky

Yes, obviously. There is no way to avoid that in raster graphics. But it is no big problem, if you size a Windows button that big it will become pixelated too. There is no way i am using complex vector graphics to account for a problem that will probably never be noticable.

Quote:Original post by Structural
why not make a separate bitmap for every button size?

Because at this stage i don't really even know how many different sizes i will need. I know i will have slightly larger buttons for the main screen ("Start Game", "Quit", etc) but it's easier to code this now so i can more easily create buttons later.

Quote:Original post by lightbringer
So you didn't actually have any question or problem?

Not any more, i've figured out how to do it! [grin]
thanks

There's bilinear texture interpolation, like in HTML.
The vertical gradient can be reduced to 2 pixels or little more (9 image slices like in Programmer16's diagram) and stretched to any desired height, while the top and bottom rows keep their natural height.

You can also use 5 rows/columns: fixed size extremes (constrained by the size of fancy corners), uniform-color center (1x1 unless there is a gentle texture), and stretchable gradients in the middle that can be extended from the smallest size that looks like a gradient to a good-looking maximum, beyond which the middle monochromatic portion is stretched or tiled instead of drawing oversized gradients.

Quote:Original post by lightbringer
After zooming in until it filled my whole screen, seems like there really was a gradient in the original image ^_^; But you don't need to feel so defensive, the suggestions for nine divisions above are all about how it's normally done but don't apply to your current situation, that's all :)

See, i told you [grin]. I know that nine divisions is the norm and i will use that in cases where i need it, i was just trying to show you that in this particular case you can't.