Radio Buttons

SmartUI Radio-Button Behavior operation and ACEs.

Radio buttons provide a practical way to select a value from a list of multiple posibilities. Within the same operational context, you can select only a single radio-button at the time. SmartUI automatically assigns all the radio-buttons in the same context to the same group, without additional intervention.

Radio-Buttons inherit its features directly from a Checkbox, managing boolean values. Therefore, its state can be either checked or unchecked.

To create additional contexts, you must add all the desired radio-buttons to an object using the Smart UI Container Behavior, to enable navigation and interaction capabilities that propagate the events to all the children of the container.

Radio-button behavior handles the following animations for the Unchecked state:

Normal , Focused , Hover , Pressed , and Disabled .

Radio-buttonbehavior handles the following animations for the Checked state:

Normal , Focused , Hover , Pressed , and Disabled .

Download

https://store.pixelperfectstudio.mx/product/smart-ui-ncbeta/

📺Basic Setup - Tutorial Video

Properties

Property	Description
Enabled	Enables or Disables the radio-button.
Index	Index of the element within a container. Used for focusing the elements in the sequence order.
Invisible Component	Turns the component opacity to 0 while rendering it to allow invisible interactions.
Automatic-Color	Enables the component to darken a bit when its state is Disabled or when it's focused. Auto-Color is meant to provide a quick identification of the component state. For more specialized customizations, use the component events and disable this check.
Name	Unique name string for identifying the selected radiobutton
On Hover	Animations when hovering
Hover Time	Timelapse to complete the animation in seconds.
Hover Change Factor	Percentage to alter the object properties
On Press	Animations when pressing
Press Time	Timelapse to complete the animation in seconds.
Checked Value	Boolean value of the radio button. It can be either checked or unchecked.
Unchecked Normal Animation	Unchecked Normal animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Checked Normal Animation	Checked Normal animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Unchecked Disabled Animation	Unchecked Disabled animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Checked Disabled Animation	Checked Disabled animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Unchecked Press Animation	Unchecked Press animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Checked Press Animation	Checked Press animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Unchecked Hover Animation	Unchecked Hover animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Checked Hover Animation	Checked Hover animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Unchecked Focus Animation	Unchecked Focus animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Checked Focus Animation	Checked Focus animation Name. Case sensitive, must match the exact name of the animation. [Sprites only]
Press Change Factor	Percentage to alter the object properties
On Restore	Animations when restoring the radio button properties
Restore Time	Timelapse to complete the animation in seconds.
Focusable	Marks if the component can have the focus.
On Focus	Animations when focusing the radio button
Focus Time	Timelapse to complete the animation in seconds.
Focus Change Factor	Percentage to alter the object properties

Smart UI Radio Button ACEs

Smart UI Radio Button behavior. Controls the object like a radio button, with values: check, and unchecked. It handles ten diferent sprite animations to match all the states of the object, and can be animated with several built-in animations and easings.

Actions

---

Set Check

Toggles the value of the radio button.

Parameter	Description
Value	Set the value of the radio button

Set Checked Animation

Sets the animation when restoring the radio button to its normal checked state

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Check Disabled Animation

Sets the animation when disabling the radio button

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Checked Focus Animation

Sets the animation when focusing the radio button. Focus animation overrides the normal animation if the radio button has the focus.

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Checked Hover Animation

Sets the animation when hovering the radio button

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Checked Press Animation

Sets the animation when pressing the radio button

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Enabled

Disable/Enable the radio button

Parameter	Description
Enabled	Enabled/Disabled

Set Focus

Sets the focus on the component, removing the focus from all the components within the same container.

Set Focus Change Factor

Sets the animation when focusing the radio button

Parameter	Description
Change Factor	Percentage to alter the object properties. Eg. 0.5 is 50%, 0.1 is 10%.

Set Focus Function

Sets the animation when focusing the radio button

Parameter	Description
Animation Function	Establishes the animation function when focusing.

Set Focus Time

Sets the animation duration when focusing the radio button

Parameter	Description
Duration	Animation duration in seconds

Set Focusable

Disable/Enable the radio button

Parameter	Description
Focusable	Flag to allow the component to be focused.

Set Hover Change Factor

Sets the animation when hovering the radio button

Parameter	Description
Change Factor	Percentage to alter the object properties. Eg. 0.5 is 50%, 0.1 is 10%.

Set Hover Function

Sets the animation when hovering the radio button

Parameter	Description
Animation Function	Establishes the animation function when hovering.

Set Hover Time

Sets the animation duration when hovering the radio button

Parameter	Description
Duration	Animation duration in seconds

Set Invisible Component

Turns the component opacity to 0 while rendering it to allow invisible interactions.

Parameter	Description
Invisible Component	Set if the component processed even if it's invisible: True/False

Set Name

Sets the name of the radio button.

Parameter	Description
Name	Name of the component

Set Press Change Factor

Sets the animation when pressing the radio button

Parameter	Description
Change Factor	Percentage to alter the object properties. Eg. 0.5 is 50%, 0.1 is 10%.

Set Press Function

Sets the animation when pressing the radio button

Parameter	Description
Animation Function	Establishes the animation function when pressing.

Set Press Time

Sets the animation duration when pressing the radio button

Parameter	Description
Duration	Animation duration in seconds

Set Restore Function

Sets the animation when restoring the radio button

Parameter	Description
Animation Function	Establishes the animation function when restoring the radio button to its original state.

Set Restore Time

Sets the animation duration when restore the radio button to its original state

Parameter	Description
Duration	Animation duration in seconds

Set Index

Sets the sequence index to influence the selection of components.

Parameter	Description
Index	Sequence index value. E.g. Indexes values of 0 are processed before indexes values of 1 and 2.

Set Unchecked Animation

Sets the animation when restoring the radio button to its normal unchecked state

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Uncheck Disabled Animation

Sets the animation when disabling the radio button

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Unchecked Focus Animation

Sets the animation when focusing the radio button. Focus animation overrides the normal animation if the radio button has the focus.

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Unchecked Hover Animation

Sets the animation when hovering the radio button

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Set Unchecked Press Animation

Sets the animation when pressing the radio button

Parameter	Description
Animation name	Animation name. Only applicable for Sprite objects

Hover

Trigger the hover event of the plugin, simulating the interaction of the user.

Stop Hover

Stops simulating the hover state.

Conditions

---

Is Checked

Returns true if the radio button is checked

Compare Name

Returns true if the radio button components name equals the parameter

Parameter	Description
Name	Name to compare with the component picked.

Is Enabled

Returns true if the radio button is enabled

Is Focused

Returns true if the radio button has the focus

Is Hovered

Returns true if the radio button is hovering

Is Invisible Component

Returns true if the radio button is configured as an invisible component.

Is Pressed

Returns true if the radio button is being pressed

On Changed

Triggered when the radio-buton value changes. Use it together with Is-Checked condition to react to changes.

On Focus

Triggered when the radio button gets the focus

On Focus Lost

Triggered when the radio button loses focus

On Hover

Triggered when the radio button starts hovering

On Hover Lost

Triggered when the radio button ends hovering

On Pressed

Triggered when the radio button started pressing.

On Released

Triggered when the radio button is released.

On Selected

Triggered when the radio button is selected.

Expressions

---

Name

Component name

(c) Pixel Perfect Studio 2024