The Push Button component is a special digital value component.

In the Push Button Properties, you customize the position, size, and style of the object. You can do the following operations in particular:

• Changing size and position of an component

• Setting the style of text

Add a Push Button component

1. Select the Push Button component in the component pane.

2. Drag it to the Editor pane and release the mouse button.

3. To define the Push Button runtime behavior, click "..." at the right end of the row Mouse Mode in the push button properties pane.

   • Click: in web page, the status of push button changes by mouse click. Click mode supports the following block types: Q, M, V, VX.

   • Hold: in web page, the status of push button changes by holding mouse press. Hold mode supports the following block types: Q, M, V, VX, Cursor Key and Function Key.

4. Set the On Image or Off image for the push button component.

   • Click "..." at the right end of the row On Image or Off Image in the push button properties pane.

   • Select an image from the Graph Library and click OK.

5. Set the name for Push Button component.

   • Click "..." at the right end of the row Off Text or On Text in the push button properties pane.

   • Change the text as you want.

   • Save the change by clicking OK or quit the change by clicking Cancel.

     The text value will change to the default value when you select Reset to Default.

6. Set the variable.

Properties for Push Button

• Basic

  • Name: Push Button

  • Location: you can modify the location coordinate for the push button.

  • Size: you can modify the width and height information for the push button.

• Animation

  • Mouse Mode: select the mouse mode.

  • On Image: select the appropriate pictures for on-state in Graph Library.

  • Off Image: select the appropriate pictures for off-state in Graph Library.

  • On Text: enter the display content for on-state.

  • Off Text: enter the display content for off-state.

• Binding

  • Variable Name: select the Default Tag or variable from tag table depending on your need.

  • Block Type: select the type of variable.

  • Block Number: select the block number.

• Styles

  • Font: select Font, Font Style and Size information separately in the Font pane. Click the OK button to save the changes or click the Reset to Default button to reset to the default settings.

  • Text Color: click Text Color Swatches, select a swatch, and click OK button.

  • Text Align: align the text on left, center, or right.