Difference between revisions of "Dialogs"

From Tales of Maj'Eyal
Jump to: navigation, search
(Created page with "<h1 id="toc29">Dialogs - Customizing your UI experience</h1> <h2 id="toc30">Drawing Dialogs</h2> <p>The draw code for dialogs can be customized by overriding the drawDialog(s...")
 
Line 188: Line 188:
 
     end,
 
     end,
 
}) </pre>
 
}) </pre>
 +
 +
Go back to [[T4modules-module-howto-guides]]

Revision as of 02:05, 29 May 2013

Dialogs - Customizing your UI experience

Drawing Dialogs

The draw code for dialogs can be customized by overriding the drawDialog(s) function in your custom dialog class. The passed 's' represents the passed sdl surface. Always use this to draw. Though the Dialog class has a Dialog.surface property, it is the whole dialog surface including the borders and title. The passed s is just the internal surface of the dialog.

To draw text, 3 functions are provided on the surface for drawing of text:

Function Use
drawString Draws uncolored strings.
drawColoredString Draws colored strings.
drawColoredStringCentered Draws centered colored strings.

To illustrate, here is code from ToME's CharacterSheet.lua:


 local h = 0
local w = 0
s:drawString(self.font, "Sex:   "..game.player.descriptor.sex, w, h, 0, 200, 255) h = h + self.font_h
s:drawString(self.font, "Race:  "..game.player.descriptor.subrace, w, h, 0, 200, 255) h = h + self.font_h
s:drawString(self.font, "Class: "..game.player.descriptor.subclass, w, h, 0, 200, 255) h = h + self.font_h
h = h + self.font_h
s:drawColorString(self.font, "Level: #00ff00#"..game.player.level, w, h, 255, 255, 255) h = h + self.font_h
s:drawColorString(self.font, ("Exp:  #00ff00#%2d%%"):format(100 * cur_exp / max_exp), w, h, 255, 255, 255) h = h + self.font_h
s:drawColorString(self.font, ("Gold: #00ff00#%0.2f"):format(game.player.money), w, h, 255, 255, 255) h = h + self.font_h 

The parameters for all 3 drawstring methods are identical, and are as follows:


Parameter Use
font Font object. Unless you want to draw different parts of your dialog with different fonts, this will always be self.font (the dialog's set font).
v Text. The ColorString variants recognise the replacement #xxxxxx#. This is a color code value, with 2 characters per r, g and b in hex(0-f). Lua text:format() method is advised to output numbers.
x x position coordinate of text. Unless its a monospaced font, every character can potentially have a different width.
y y position coordinate of text. self.font:lineSkip() can be used to get the font height.
r Red color value of text. (0-255)
g Green color value of text. (0-255)
b Blue color value of text. (0-255)


Drawing Images

To load an image the simpliest way is to do:

 local img = core.display.loadImage("/data/..../foo.png") 

Then you can draw it on an other surface with:

 dest:merge(img, x, y) 

You can also directly display a surface on screen:

 img:toScreen(x, y) 

If the surface wont change later you can make an opengl texture from it to speed up rendering:

 local tex = im:glTexture() 


and display it:

 tex:toScreen(x, y, w, h) 


You can actually update the texture if the surface changes (this is how dialogs work internally) this is faster than just drawing the surface.


Player Display

Player Displays is the quick summary of stats you get on the left side while playing. This is related to dialogs, but this class does not inherit from the dialog class.

ToME implements this by defining a display() function in the PlayerDisplay.lua class and calling it in game:display(), updating the surface whenever the player's changed property is true.


Registering and Displaying Dialogs

Displaying dialogs from code is simple:


 local d = CustomDialog.new()
game:registerDialog(d) 

To remove it(usually called from the dialog itself):


 game:unregisterDialog(self) 

This will set the dialog to open and display. If key or mousebindings are set for the dialog, these will also be made current. Note that dialogs do not automatically pause the game. In real-time games the action will continue, and even in turn-based games, animations and particles will continue in the background.

Most Dialogs will also need keyboard or mouse bindings. You use the following methods to define these in the dialog's init() function:


Method Purpose
keyCommands(KeyCommands, KeyBinds) Sets keyboard keys recognised by this dialog. KeyCommands and KeyBinds are tables containing keyboard binding functions.
mouseZones(zones) Sets a table of mouse zones recognised by the dialog. Note that the x and y coordinates are automatically offset by the dialog's extents.


Keyboard Input

Manually setting keyCommands are strongly unadvised. Use keyBindings whenever possible, since these can be remapped by the user. There are however some exceptions:


keyCommand Effect
_ _DEFAULT Matches any key press.
_ _TEXTINPUT Used to receive alphanumeric text from keyboard.

This example code is taken from ToME's DeathDialog.lua:


 self:keyCommands({
    __TEXTINPUT = function(c)
        if c == 'd' or c == 'D' then
            self:dump()
        end
    end,
}, {
    ACCEPT = "EXIT",
    EXIT = function()
        game:unregisterDialog(self)
    end,
}) 

Go back to T4modules-module-howto-guides