gbadev.org forum archive

This is a read-only mirror of the content originally found on forum.gbadev.org (now offline), salvaged from Wayback machine copies. A new forum can be found here.

Graphics > User interface graphics

#154027 - Lazy1 - Wed Apr 09, 2008 6:06 pm

For someone with no artistic talent, what is the best way to design and create a user interface?
I figure tile graphics are the way to go since they use less cpu time and memory but my artistic talents don't even compare to coder art.

What I may end up doing is writing a library of some kind to make simple user interfaces.
Something lightweight but supports things like dialogs, buttons, checkboxes, list views and tab pages.

This is coming about since I want to redo my Mini vMac port but I also want a nice user interface that is not a total hack and can look somewhat nice.

#154029 - tepples - Wed Apr 09, 2008 7:14 pm

If you're making a UI for Mini vMac, you'll probably want to use the Chicago font for consistency with the system font of the machine being emulated. And if you're using proportional fonts like Chicago, you'll probably want to make your UI in a bitmap or pseudo-bitmap mode. Pseudo-bitmap involves a 4-bit-per-pixel mode where each entry in the map points to a separate tile, and drawing involves editing the pixels within the tiles. I can explain further if you want, including code.
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.

#154033 - Lazy1 - Wed Apr 09, 2008 8:19 pm

Well, it would be for Mini vMac but I was thinking of making a general library as well in case I do other projects that could benefit from easily made UIs.
What I'm going for is a nice looking user interface that is powerful but not computationally expensive or memory hungry.

#154036 - tepples - Wed Apr 09, 2008 8:38 pm

Not computationally expensive: Check. My library was originally designed to run on GBA, so it's even faster on DS.

Not memory hungry: Check. Only 26 KiB of VRAM is needed for one background plane, and in theory, it would fit into VRAM H. So even programs that use A, B, C, and D for textures can use it.

To see it in action, download lj044.
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.

#154040 - Lazy1 - Wed Apr 09, 2008 10:43 pm

That looks really nice actually and gives me quite a few ideas.

#154208 - Lazy1 - Sat Apr 12, 2008 10:08 pm

tepples wrote:
Pseudo-bitmap involves a 4-bit-per-pixel mode where each entry in the map points to a separate tile, and drawing involves editing the pixels within the tiles. I can explain further if you want, including code.


Could you explain this further?

#154211 - tepples - Sat Apr 12, 2008 10:30 pm

Allocate 600 (GBA) or 768 (DS) tiles for a layer, then set each entry in the layer's map to a unique tile. To clear the screen, set all tiles to a constant pixel value. To draw pixels, first compute which tile the pixels fall in, then modify the pixels within the tile.
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.

#154212 - silent_code - Sat Apr 12, 2008 10:36 pm

it's as if you were drawing into a framebuffer, but you're actually drawing the tiles dynamically and the map stays the same.

#154217 - Lazy1 - Sat Apr 12, 2008 11:17 pm

How would the tile ram and map ram be laid out in this case?

#154227 - tepples - Sun Apr 13, 2008 1:33 am

The tunnel scene of the "fr018" GBA demo by Farbrausch arranged the tiles something like this:
Code:
000 020 040 060 ... 560 580
001 021 041 061 ... 561 581
002 022 042 062 ... 562 582
003 023 043 063 ... 563 583
004 024 044 064 ... 564 584
005 025 045 065 ... 565 585
006 026 046 066 ... 566 586
007 027 047 067 ... 567 587
 :   :   :   :  `.
 :   :   :   :    `
018 038 058 078 ... 578 598
019 039 059 079 ... 579 599

This way, each 8x160 pixel region is a contiguous mini-bitmap. To go down by 1 pixel, add 4 to your address (1 if using a u32 *). To go right by 1 tile (8 pixels), add 4*8*20 to your address (8*20 if using a u32 *).

I have written a working implementation of this pseudo-bitmap method as part of the "RAC wizard engine", which powers some of my DS tools, such as RAC and memtestARM. The pseudo-bitmap code is also used for menus in the GBA and DS ports of Lockjaw Tetromino Game.
_________________
-- Where is he?
-- Who?
-- You know, the human.
-- I think he moved to Tilwick.