Interactive XML: buttons

Showing posts with label buttons. Show all posts

<button>

An individual button defined within <buttons> or within <input> (for a text input form).

Child of: <buttons>, <input>

Parent of: <text>, <font>, <font_size>, <text_color>, <word_wrap>, <x>, <y>, <height>, <width>, <button_color>, <bold>, <opacity>, <next_node>, <link>, <assign name="" expr=""/>, <full_screen>

If <assign name="" expr=""/> is used within <button>, the assign will be executed only if the user clicks the button.

Example:

<button>

<text>Button A</text>

<font>Arial</font>

<font_size>12</font_size>

<text_color>0x000000</text_color>

<word_wrap>OFF</word_wrap>

<button_color>0xDDDDDD</button_color>

<next_node>node_a</next_node>

</button>

Working example: Search for <button>...</button> in the file trivia_demo.xml.

The color for a button, represented by a hexadecimal code preceded by 0x.

To find the hexadecimal code for the color you want, use a color picker such as this one.

Note that Flash does not display the button color as a uniform color, but rather as a gradient based on that color. For full control over button color, create a custom button using an image (<image name="">), with XML to execute upon user click, or use a graphical button (<graphical_button name="">).

Child of: <button>, <button_defaults>

Parent of: Nothing

Example:

<button_color>0xDDDDDD</button_color>

Working example: Search for <button_color></button_color> in the file trivia_demo.xml.

<button_defaults>

Default settings for the appearance of clickable buttons on the screen.

Can be overridden as necessary.

Child of: <settings>

Parent of: <font>, <font_size>, <text_color>, <word_wrap>, <height>, <width>, <button_color>, <bold>, <opacity>

Example:

<button_defaults>

<font>Arial</font>

<font_size>16</font_size>

<text_color>0x000000</text_color>

<word_wrap>OFF</word_wrap>

<button_color>0xDDDDDD</button_color>

</button_defaults>

Working example: Search for <button_defaults>...</button_defaults> in the file trivia_demo.xml.

<button_on>

Controls whether a button defined in a text input form is displayed or not.

Accepted values are YES and NO.

Default value: YES

Child of: <input>

Parent of: Nothing

Examples:

<button_on>YES</button_on>

<button_on>NO</button_on>

<button_template name="">

An individual set of buttons defined within <button_templates>.

Child of: <button_templates>

Parent of: <buttons>

Examples:

<button_template name="abc">

<text>Button A</text>

<font>Arial</font>

<font_size>12</font_size>

<text_color>0x000000</text_color>

<word_wrap>OFF</word_wrap>

<button_color>0xDDDDDD</button_color>

<next_node>node_a</next_node>

</button>

<text>Button B</text>

<font>Arial</font>

<font_size>12</font_size>

<text_color>0x000000</text_color>

<word_wrap>OFF</word_wrap>

<button_color>0xDDDDDD</button_color>

<next_node>node_b</next_node>

</button>

<text>Button C</text>

<font>Arial</font>

<font_size>12</font_size>

<text_color>0x000000</text_color>

<word_wrap>OFF</word_wrap>

<button_color>0xDDDDDD</button_color>

<next_node>node_c</next_node>

</button>

</buttons>

</button_template>

To call a defined button template from a node:

<button_template name="abc"/>

Anything added or changed in the template call will override the template definition in <settings>. For example, to override the font size of a button template:

<button_template name="abc">

<font_size>16</font_size>

</button>

<font_size>16</font_size>

</button>

<font_size>16</font_size>

</button>

</buttons>

</button_template>

Working example: Search for <button_template name="">...</button_template> in the file trivia_demo.xml.

<button_templates>

Contains one or more templates for sets of buttons that can be defined once in settings and called from any node.

Child of: <settings>

Parent of: <button_template name=""/>

Example:

<button_templates>

<button_template name="abc">

…

</buttons>

</button_template>

<button_template name="true_or_false">

…

</buttons>

</button_template>

</button_templates>

Working example: Search for <button_templates>...</button_templates> in the file trivia_demo.xml.

<buttons>

Contains one or more <button> tags defined within a node or within <button_template name=""> in <settings>.

Buttons are automatically cleared at the beginning of each node. Previously defined buttons must be redefined in the new node in order to remain on the screen.

There should be no more than one set of <buttons> tags per node.

Child of: <node name="">, <button_template name="">

Parent of: <button>

Example:

<text>Button A</text>

<font>Arial</font>

<font_size>12</font_size>

<text_color>0x000000</text_color>

<word_wrap>NO</word_wrap>

<button_color>0xDDDDDD</button_color>

<next_node>node_a</next_node>

</button>

<text>Button B</text>

<font>Arial</font>

<font_size>12</font_size>

<text_color>0x000000</text_color>

<word_wrap>NO</word_wrap>

<button_color>0xDDDDDD</button_color>

<next_node>node_b</next_node>

</button>

</buttons>

Working example: Search for <buttons>...</buttons> in the file trivia_demo.xml.

<click>

Executes the specified actions upon mouse click and release over the button defined by the parent <graphical_button name=""> tag.

Child of: <graphical_button name="">

Parent of: Any child of <node name="">

Example:

<graphical_button name="my_graphical_button">

...

<click>

...

</click>

</graphical_button>

<down_image>

The image to display for a graphical button when the user clicks the button.

Child of: <graphical_button name="">

Parent of: Nothing

Example:

<down_image>down_image.png</down_image>

<down_image library="">

An image from a Flash media library (see <medialibrary_load name="">) to display for a graphical button when the user clicks the button.

Child of: <graphical_button name="">

Parent of: Nothing

Example:

<down_image library="my_media_library">library_image_1_.png</down_image>

<graphical_button name="">

A button defined by images that may have dynamic graphical properties depending on whether the cursor is over the button, away from the button, or clicking down on the button.

Several graphical buttons may be defined within <graphical_buttons> tags.

Child of: <graphical_buttons>

Parent of: <up_image>, <over_image>, <down_image>, <mouse_over>, <mouse_out>, <x>, <y>, <click>

Examples:

<graphical_button name="graphical_button_a">

<up_image>up_image.png</up_image>

<over_image>over_image.png</over_image>

<down_image>down_image.png</down_image>

<mouse_over>

…

</mouse_over>

<mouse_out>

…

</mouse_out>

<click>

<next_node>node_a</next_node>

</click>

</graphical_button>

To clear a graphical button from the screen, use CLEAR as follows:

<graphical_button name="gb_a">CLEAR</graphical_button>

To clear all graphical buttons at once:

<graphical_buttons>CLEARALL</graphical_buttons>

<graphical_buttons>

Several graphical buttons.

Child of: <node name="">

Parent of: <graphical_button name="">

Example:

<graphical_buttons>

<graphical_button name="graphical_button_a">

<up_image>up_image_a.png</up_image>

<over_image>over_image_b.png</over_image>

            <down_image>down_image_c.png</down_image>
      <x>45</x>
      <y>100</y>
      <click>

...
</click>

</graphical_button>

<graphical_button name="graphical_button_b">

<up_image>up_image_b.png</up_image>

<over_image>over_image_b.png</over_image>

            <down_image>down_image_b.png</down_image>
      <x>105</x>
      <y>100</y>
      <click>

...
</click>

</graphical_button>

</graphical_buttons>

To clear a graphical button from the screen, use CLEAR as follows:

<graphical_button name="gb_a">CLEAR</graphical_button>

To clear all graphical buttons at once:

<graphical_buttons>CLEARALL</graphical_buttons>

<input>

A text input form with an optional button.

The text input by the user is written to the variable defined in <variable_name>, which can be evaluated and used in the next node.

Child of: <click>, <drag_drop>, <drag_move>, <mouse_click>, <mouse_down>, <mouse_move>, <mouse_out>, <mouse_over>, <node name="">, <press>, <release>

Parent of: <text>, <font>, <font_size>, <text_color>, <x>, <y>, <height>, <width>, <opacity>, <transparent_background>, <variable_name>, <button_on>, <button>, <next_node>

Example:

<input>

<text>Enter email address here</text>

<font>Arial</font>

<font_size>14</font_size>

<text_color>#000000</text_color>

<transparent_background>YES</transparent_background>

<variable_name>user_email</variable_name>

<button_on>YES</button_on>

<text>Enter</text>

<font>Arial</font>

<font_size>12</font_size>

<text_color>0x000000</text_color>

<word_wrap>OFF</word_wrap>

<button_color>0xDDDDDD</button_color>

</button>

<next_node>send_email</next_node>

</input>

<opacity>

The opacity of an element such as a button.

The value must be between 0 (transparent) and 1 (opaque).

Child of: <button>, <button_defaults>, <dropdown>, <input>,

Parent of: Nothing

Example:

Working example: Search for <opacity></opacity> in the file trivia_demo.xml.

<over_image>

The image to display for a graphical button when the user's cursor is over the button.

Child of: <graphical_button name="">

Parent of: Nothing

Example:

<over_image>over_image.png</over_image>

<over_image library="">

An image from a Flash media library (see <medialibrary_load name="">) to display for a graphical button when the user's cursor is over the button.

Child of: <graphical_button name="">

Parent of: Nothing

Example:

<over_image library="my_media_library">library_image_1_.png</over_image>

<text>

The text for a button, input field or text banner.

HTML tags such as <b> (bold), <i> (italics) and underline <u> (underline) may be used within <text> tags defined within <input>, <text_banner name=""> and <title> tags but not those defined within <button> tags.

Child of: <button>, <input>, <text_banner name="">, <title>

Parent of: Nothing

Examples:

<text>Button A</text>

<text>Enter your name here!</text>

<text><b>Welcome to my interactive video!</b></text>

<text><p align="center">Hello world!</p></text>

Working example: Search for <text></text> in the file trivia_demo.xml.

<up_image>

The image to display for a graphical button when the user's cursor is off the button.

Child of: <graphical_button name="">

Parent of: Nothing

Example:

<up_image>up_image.png</up_image>

<up_image library="">

An image from a Flash media library (see <medialibrary_load name="">) to display for a graphical button when the user's cursor is off the button.

Child of: <graphical_button name="">

Parent of: Nothing

Example:

<up_image library="my_media_library">library_image_1_.png</up_image>

<word_wrap>

Allows text to be wrapped inside a button.

Accepted values are YES or NO.

Default: NO

Child of: <button>, <button_defaults>

Parent of: Nothing

Example:

<word_wrap>YES</word_wrap>

Working example: Search for <word_wrap></word_wrap> in the file trivia_demo.xml.