Libwiisprite GUI/Menu Programming

I was wondering exactly how I could get a really good GUI/Menu running with libwiisprite. I tried using the textclass on the wiibrew libwiisprite page to use a diferent font. So far its not working out.

My goals are:
-Get a good background
-Get a good font to replace the default one that appears with printf

I can get the background working. I'm using the default font with the textclass. Any help would be appreciated.

This is for my app wii shooting gallery. Here's the menu code:

void Menu(){
	
	// This function initialises the attached controllers
	WPAD_Init();
	
	LayerManager manager(8);
	
	GameWindow gwd;
	gwd.InitVideo();
	
	TextField *text[8];
	
	text[0] = new TextField(30, 0, 30, 5, &manager, "Wii Shooting Gallery!", "data/fonts/font8.png");
	text[1] = new TextField(30, 20, 30, 5, &manager, "Wii Shooting Gallery!", "data/fonts/font8.png");
	text[2] = new TextField(30, 40, 30, 5, &manager, "Wii Shooting Gallery!", "data/fonts/font8.png");
	text[3] = new TextField(30, 60, 30, 5, &manager, "Wii Shooting Gallery!", "data/fonts/font8.png");
	text[4] = new TextField(30, 80, 30, 5, &manager, "Wii Shooting Gallery!", "data/fonts/font8.png");
	text[5] = new TextField(30, 100, 30, 5, &manager, "Wii Shooting Gallery!", "data/fonts/font8.png");
	text[6] = new TextField(30, 120, 30, 5, &manager, "Wii Shooting Gallery!", "data/fonts/font8.png");
	text[7] = new TextField(30, 140, 30, 5, &manager, "Score: %d", "data/fonts/font8.png");

	  
		    while(true){
			
			WPAD_ScanPads();
						
			switch(mode){
			
			  case 1:
			  text[1]->SetText("Still Targets");
			  break;
			  
			  case 2:
			  text[1]->SetText("Horizontal Moving Targets");
			  break;
			  
			  case 3:
			  text[1]->SetText("Vertical Moving Targets");
			  break;
			  
			  case 4:
			  text[1]->SetText("Crazy Targets");
			  break;
			  
			  case 5:
			  text[1]->SetText("Crisscross Targets");
			  break;
			  
			  case 6:
			  text[1]->SetText("Teleporting Targets");
			  break;
			  
			}
			
			switch(trans){
			
			case 0:
			text[2]->SetText("Crosshair 1");
			Aim->SetImage(crosshair1);
			Aim->SetTransparency(0xFF);
			break;
			
			case 1:
			text[2]->SetText("Crosshair 2");
			Aim->SetImage(crosshair2);
			break;
			
			case 2:
			text[2]->SetText("Crosshair 3");
			Aim->SetImage(crosshair3);
			break;
			
			case 3:
			text[2]->SetText("Crosshair 4");
			Aim->SetImage(crosshair4);
			break;
			
			case 4:
			text[2]->SetText("Crosshair 5");
			Aim->SetImage(crosshair5);
			Aim->SetTransparency(0xFF);
			break;
			
			case 5:
			text[2]->SetText("Invisible Crosshair");
			Aim->SetTransparency(0);
			break;
			
			}
			
			switch(backgroundchoice){
			
			case 1:
			Background->SetTransparency(0xFF);
			Background->SetImage(background1);
			text[3]->SetText("Background 1");
			break;
			
			case 2:
			Background->SetImage(background2);
			text[3]->SetText("Background 2");
			break;
			
			case 3:
			Background->SetTransparency(0xFF);
			Background->SetImage(background3);
			text[3]->SetText("Background 3");
			break;
			
			case 4:
			Background->SetTransparency(0);
			text[3]->SetText("No Background");
			break;
			}
						
			switch(anim){
			
			case 1:
			text[4]->SetText("Animation On");
			break;
			
			case 2:
			text[4]->SetText("Animation Off");
			break;
			}
			
			switch(rumble){
			
			case 0:
			text[5]->SetText("Rumble Off");
			break;
			
			case 1:
			text[5]->SetText("Rumble On");
			break;
			}
			
			switch(maxtime){
			
			case 0:
			text[6]->SetText("Unlimited Time");
			break;
			
			case 1000:
			text[6]->SetText("One minute");
			break;
			
			case 2000:
			text[6]->SetText("Two Minutes");
			break;
			
			case 3000:
			text[6]->SetText("Three Minutes");
			break;
			
			case 4000:
			text[6]->SetText("Four Minutes");
			break;
			
			case 5000:
			text[6]->SetText("Five Minutes");
			break;
			
			}
			
			
		    if((WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_RIGHT)||(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_NUNCHUK_BUTTON_Z))
			 mode++;
			 
			 if((WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_LEFT)||(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_NUNCHUK_BUTTON_C))
			 mode--;
			 
			 if(mode < 1)
			 mode = 6;
			 
			 if(mode > 6)
			 mode = 1;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_A)
			 trans++;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_DOWN)
			 trans--;
			 
			 if(trans > 5)
			 trans = 0;
			 
			 if(trans < 0)
			 trans = 5;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_2)
			 backgroundchoice++;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_1)
			 maxtime += 1000;
			 
			 if(backgroundchoice > 4)
			 backgroundchoice = 1;
			 
			 if(maxtime > 5000)
			 maxtime = 0;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_PLUS)
			 anim++;
			 
			 if(anim > 2)
			 anim = 1;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_MINUS)
			 rumble--;
			 
			 if(rumble < 0)
			 rumble = 1;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_B)
			 break;
			 
			 if(WPAD_ButtonsDown(WPAD_CHAN_0)&WPAD_BUTTON_HOME){
			 quit = 1;
			 break;
			 }
			 
			 Background->Draw();
			 manager.Draw(0, 0);
			 gwd.Flush();
			 
		  }
		 }

Also, it all compiles fine. I'll be rewriting the input code later once it works like this.



Edited 1 time(s). Last edit at 09/07/2008 12:18AM by Arikado.

If you want your own font, make and program if yourself. This can be as easy or complex as you like. I'm working on a game at the moment with libwiisprite, and to get a font I want I created my own "engine" for it. Basically it works like this:

I have an image that has all of the required characters I need in black with all the white deleted so it doesn't delete all the pixels behind it in the back buffer. Then, I create a TiledLayer object and pass it the image (used raw2c), then set the cell width to each character, easiest to make them image a straight line for navigating through cells, that way 1 is a, 2 is b etc. Then create a function that prints your text. For example the following would print abc

int letters[2];
letters[0] = 1;
letters[1] = 2;
letters[2] = 3;
print_letters(letters);

obviously requires a little more work than that in order to print them next to each other, in the correct position etc, but that's the basics anyways.

Or you could just use a more common character encoding, like the one all other computers uses, the ones based on the ascii encoding. Also note that what you are describing is a fixed width font. Now, they are not bad, but know how they differ from variable width fonts.

I found DM's freetype port to be a good way to draw text to libwiisprite images. Support for TTF fonts, kerning, and all those fancy features is always a good thing :)



Edited 1 time(s). Last edit at 09/07/2008 04:07PM by AerialX.

Maybe you should have linked to the port instead of the Wikipedia article about the library.

Thanks AerialX! I'll check it out later. Does anyone know of any example source that I could look at for this?

EDIT: This textclass really sucks. Couldn't get to work after about 3 hours of playing with it last night.



Edited 1 time(s). Last edit at 09/08/2008 12:12AM by Arikado.

Okay, help me out AerialX. How do I set up and then use freetype? I have a ton of headers and one .a file. Furthermore which is the main header that I need to include to my projects. And if it's not asking to much could you give me an example of how this all works?

henke37: I linked to the Wiibrew page which has a link to the download.

Arikado: Well, the download has a sample.txt file which explains the simple way to use it. But the problem is that the classes DM wrote seem to be for an older version of libwiisprite; I did have to modify them and libwiisprite a bit to get them working. I meant to mention that but somehow forgot >.>
(I'm going to send the creator of libwiisprite a message about making the library more extensible in future versions, but for now you'll have to use my -slightly- modified version of 0.3.0b that allows the Image class to be subclassed.

Anyway, I'll zip up what I have set up for my project. Just follow the sample.txt instructions (I might've changed the casing of some functions though, like getWidth() to GetWidth()), include the two headers from libfreesprite (what I called DM's text rendering classes), link to -lfreesprite and -lfreetype, and replace your libwiisprite.a with mine.

Just make sure you're linking to all the libraries and have your includes set up and you should be fine :)

Download