Once again I am working on my GUI framework. Most of it is starting to come together, however, I do still have one important design decision to make, and I was wondering what others have chosen. When creating a GUI, one can assume a certain resolution and create for that. If everything is indicated relative to the screen, then is the user has a different resolution all the elements would still be positioned correctly, but the may become a bit blurry, due to texture scaling. Another option is to give precise pixel coordinates for each element. This can easily achieve pixel-perfect reproduction. However, if the resolution is different, the GUI widgets will not scale, and the entire UI will either crunch up in one corner, or be split up into the corners (depending on how they have been defined). The pixel accuracy is still there, but all the widgets are smaller now because there are more pixels on screen. The first option is what I currently use. The base level of the GUI goes from (-1,-1) to (1,1), and everything is scaled. When using textures for entire elements, the scaling is easily done, and with some calculations, 1 pixel boundaries may still be achieved with either method. But what to do with fonts? If using bitmap fonts, the font can be scaled (however, due to magnification it wouldn't look as good as in the native resolution). So I'm thinking of preserving the pixel size of fonts (so as resolution increases, the size of text decreases), but having two or three sizes of font. For instance one font created for 640x480 which is also used up to 12??x1024 and then another one used for the higher resolutions. The size of the fonts will still change, but at least it will still be readable in the higher resolutions. edit: hmm, I posted this in the wrong forum. I meant to post in the Graphics forum. Could a moderator maybe move the thread please?

Moved, as per request

Anon: how did you do that? Did you create several similar widgets, each implementing one of the above, or did you only create one widget which could handle all the options?

Yeah. Provide all three options and let designers mix and match.

Michalson: and I assume the scaling of the textures can be done during load, so the higher res texture needn't be residing in memory if you're on a low resolution (and probably have limited videomemory as well).

CoffeeMug: would you create three version of the GUI framework, or have some kind of switch in the gui elements.

I'm currently using the visitor pattern to iterate through the widgets, so I might be able to do something with that instead of changing all the widgets to support the different possibilities. However, this can only affect a 'screen' of widgets, not individual ones.

I load my GUI from xml files, and take the same approach as Everquest did with thiers; just store seperate GUIs for each resolution. Each file specified the appropriate height, width, position, etc. for each GUI. In the UI directory, each screen piece will have a different file for each resolution, so you might see something like:

UI\Console640x480.xml
UI\Console800x600.xml
UI\Console1280x1024x.xml
UI\ConsoleDefault.xml
UI\Inventory640x480.xml
UI\InventoryDefault.xml

etc.

It's simple, effective, and produces very few bugs. Obviously having to manually adjust these can be a pain, but it's not a big deal, as you just move a few offsets and such, and I do allow for some relative positioning (such as making the height equal to the height of another element, and then set it's leftmost position to be equal to the leftmost position of the other element + the other element's width, which would position it next to it).

It also has the nice effect of giving users an easily customizable interface.