Using Buttons and Default Buttons

Buttons are fundamental entities that allow you to interact with devices, for example with mechanical buttons on a keyboard or a remote control, or graphical buttons on a touch sensitive computer display. This tutorial looks at how to use buttons to interact with a LiveCode application.

Start LiveCode and open a stack window by selecting New Mainstack from the File Menu. Then drag and drop a Push Button (1), a Default Button (2) and a Rectangle Button (3) onto the card. You can space these buttons out as you like. Then rename the buttons from left to right "Button 1", "Button 2" and "Button 3". You can rename the buttons by right clicking on a button and selecting Property Inspector (4). This opens a new dialog box. Make sure that Basic Properties is selected from the drop down list of the new dialog box. Then change the name in the "Name" field (5). You can also view the types of buttons that are available to you in the style drop down list (6). For this example it is not necessary to select any other button types from the drop down list.

Once you have created the button controls on the card and renamed them, you can add code to each button. Right click on each button and select Edit Script, this opens the script editor with two default lines of code:

on mouseUp

end mouseUp

mouseUp is a handler that is called each time a button receives a mouse event. You can populate the area between on mouseUp and end mouseUp, in order to provide functionality to the buttons.

Add the following code to "Button 1":

on mouseUp
    answer "Square Button" with "Okay"
end mouseUp

Add the following code to "Button 2":

on mouseUp
    answer "Default Button" with "Okay"
end mouseUp

Add the following code to "Button 3":

on mouseUp
    answer "Rounded Button" with "Okay"
end mouseUp

All of the button that were created in this tutorial can be selected with the mouse, but "Button 2" also acts as a default button, allowing it to be selected using the Enter or Return keys on a keyboard. This is a useful feature that is often used in installers or applications that lead you through a sequence of steps that have a default option. In this case the user would not have to select a particular button each time a new step was presented but could rapidly run through all pages by pressing the Enter or Return key for each screen or step. The LiveCode application you created operates in a similar way. Try pressing the Enter or Return key and see how "Button 2" is pressed, a dialog appears and "Okay" is pressed. This loop of pressing "Button 2" a dialog appearing and pressing "Okay" can continue indefinitely.

If you are interested in more information on using buttons, then have a look at tutorial Using Radio Buttons.