VARIABLE

<VARIABLE/> : Widget

The <VARIABLE/> or <VAR/> widget is used to hold constant, bound or calculated values of any type.

Restrictions:

• It is important to be cautious of the navigation stack as <VAR/> s are disposed with their template framework and hold values if the page is still open even if behind the current navigation.

Attributes

Name	Type	Default	Description	Req
value	int	null	The value of the variable, can be an eval that returns a value.	✔️
readonly	bool	false	Readonly variables are only set once and cannot be changed after the initial value is assigned
onchange	string	null	A string of events that will execute AFTER the value has changed.
encode	string	json/xml	When used, values are encoded (escaped) to avoid special characters that might otherwise impact on the application. This is especially true when posting data using the FORM widget.
return	string	null	When the current scope is popped (ex: on back()) this creates a VAR in the new scope with the same id as return

Examples

Example #1 : Using a variable to hold a selection state and a calculated value

<FML title="VAR (example1)" linkable="true">

    <VAR id="tab" value="" onchange="count.set({count} + 1)" />
    <VAR id="count" value="0" />

    <BOX center="true">
        <BOX layout="row" expand="false"  halign="between" color="{THEME.onprimary}" radius="20">
            <BTN type="={tab} == 1 ? elevated : outlined" label="Tab 1" onclick="tab.set(1)" />
            <BTN type="={tab} == 2 ? elevated : outlined" label="Tab 2" onclick="tab.set(2)" />
            <BTN type="={tab} == 3 ? elevated : outlined" label="Tab 3" onclick="tab.set(3)" />
        </BOX>
        <BOX width="200" height="100" center="true">
            <TEXT visible="=!noe({tab})" value="Selected Tab: **{tab}**" />
            <TEXT visible="=!noe({tab})" value="Swapped Tabs: **{count}**" />
        </BOX>
    </BOX>

</FML>

See it in Action

Other Widgets You May Find Useful:

• Databinding
• Events
• <CONST/>
• <BLOB/>
• <INTEGER/>
• <DOUBLE/>
• <BOOLEAN/>