| Package | qnx.ui.buttons |
| Class | public class ToggleSwitch |
| Inheritance | ToggleSwitch Slider UIComponent flash.display.MovieClip |
ToggleSwitch represents a button that has one of two states indicating an "ON" or "OFF" state.
You can touch and drag the toggle switch to change state, or you can tap the track or the background of the toggle switch to toggle between states.
A toggle switch is comprised of a track, thumb, fill, and two text labels:
See also
| Property | Defined By | ||
|---|---|---|---|
![]() | active : Boolean
Gets or sets the active property of the Slider. | Slider | |
![]() | containment : String
Gets or sets a property that determines how a component is contained within a parent container. | UIComponent | |
| defaultLabel : String
Gets or sets the String text for the default, or OFF, label. | ToggleSwitch | ||
| embedFonts : Boolean
Gets or sets the embedFonts property of the internal TextField of the ToggleSwitch. | ToggleSwitch | ||
![]() | maximum : Number
Gets or sets the maximum value of the slider. | Slider | |
![]() | minimum : Number
Gets or sets the minimum value of the slider. | Slider | |
| selected : Boolean
Gets or sets the value of the switch (the position of the thumb). | ToggleSwitch | ||
| selectedLabel : String
Gets or sets the String text for the selected, or ON, label. | ToggleSwitch | ||
![]() | size : Number
Gets or sets the size for this component (as a percentage of the
container's size, or in pixels). | UIComponent | |
![]() | sizeMode : String
Gets or sets the size mode for this component. | UIComponent | |
![]() | sizeUnit : String
Gets or sets the unit of measure for the size property. | UIComponent | |
![]() | value : Number
Gets or sets the current value of the slider. | Slider | |
| Method | Defined By | ||
|---|---|---|---|
Creates a ToggleSwitch instance. | ToggleSwitch | ||
![]() | destroy():void
Call this method when you want to have your object collected by the garbage collector. | UIComponent | |
![]() | drawNow():void
Calls the draw() method. | UIComponent | |
getTextFormatForState(state:String):TextFormat
Returns the TextFormat object for a specified state. | ToggleSwitch | ||
![]() | invalidate(property:String, invalidateNow:Boolean = false):void
Marks the property as invalid and the draw() method is called on the next frame or the next render, whichever comes first. | UIComponent | |
![]() | setFillSkin(skin:Object):void
Sets the fill skin for the slider. | Slider | |
![]() | setPosition(x:Number, y:Number):void
Sets the x and y position of the component. | UIComponent | |
![]() | setSize(w:Number, h:Number):void
Sets the width and height of the component. | UIComponent | |
setTextFormatForState(format:TextFormat, state:String):void
Sets the TextFormat object for the label for a given state. | ToggleSwitch | ||
![]() | setThumbSkin(skin:Object):void
Sets the skin for the slider thumb button. | Slider | |
![]() | setTrackSkin(skin:Object):void
Sets the skin for the track of the slider. | Slider | |
| Event | Summary | Defined By | ||
|---|---|---|---|---|
| Dispatches a select event when the selection of the control changes. | ToggleSwitch | |||
![]() | Dispatched when a drag event ends. | Slider | ||
![]() | Dispatched when a drag event starts. | Slider | ||
![]() | Dispatched when the slider is moved by the user. | Slider | ||
| defaultLabel | property |
defaultLabel:String
Gets or sets the String text for the default, or OFF, label.
By definition, a toggle switch has two states. By default, the ToggleSwitch states
are set to "Off" and "ON", however you can define your own states by setting the defaultLabel and
selectedLabel properties.
The default value is "OFF".
public function get defaultLabel():String public function set defaultLabel(value:String):voidSee also
| embedFonts | property |
embedFonts:Boolean
Gets or sets the embedFonts property of the internal TextField of the ToggleSwitch.
When set to false, fonts are rendered as device fonts.
When set to true, you must specify a font using the font property of a TextFormat object and
set it using the setTextFormatForState() method.
This font must be included in your application. If it is not included, the text will not be rendererd.
The default value is false.
public function get embedFonts():Boolean public function set embedFonts(value:Boolean):voidSee also
| selected | property |
selected:BooleanGets or sets the value of the switch (the position of the thumb).
true for ON, selected, false for OFF, unselected.
public function get selected():Boolean public function set selected(value:Boolean):void| selectedLabel | property |
selectedLabel:String
Gets or sets the String text for the selected, or ON, label.
By definition, a toggle switch has two states. By default, the ToggleSwitch states
are set to "Off" and "ON", however you can define your own states by setting the defaultLabel and
selectedLabel properties.
public function get selectedLabel():String public function set selectedLabel(value:String):voidSee also
| ToggleSwitch | () | Constructor |
public function ToggleSwitch()
Creates a ToggleSwitch instance.
| getTextFormatForState | () | method |
public function getTextFormatForState(state:String):TextFormat
Returns the TextFormat object for a specified state.
Parameters
state:String — The state for the TextFormat object to return.
|
TextFormat — The TextFormat object for the specified state.
|
See also
| setTextFormatForState | () | method |
public function setTextFormatForState(format:TextFormat, state:String):void
Sets the TextFormat object for the label for a given state.
Valid state parameter values are:
selecteddefault
In the following example, the a TextFormat object is applied to the selected state label:
var myFormat:TextFormat = new TextFormat();
myFormat.font = "BBAlpha Sans";
myFormat.size = 22;
myFormat.color = 0xFFFFFF;
myToggle = new ToggleSwitch();
myToggle.setPosition(200, 200);
myToggle.defaultLabel = "Light";
myToggle.selectedLabel = "Dark";
myToggle.selected = false;
myToggle.setTextFormatForState(myFormat, "selected");
Parameters
format:TextFormat — The TextFormat object to apply to the label.
| |
state:String — The state for which to apply the TextFormat object.
|
See also
| select | Event |
flash.events.Eventflash.events.Event.SELECTDispatches a select event when the selection of the control changes.
The following example creates a ToggleSwitch instance that you can use to change the skin of a LabelButton.
package
{
import flash.display.Sprite;
import flash.events.Event;
import qnx.ui.buttons.LabelButton;
import qnx.ui.buttons.ToggleSwitch;
import qnx.ui.skins.buttons.RoundedButtonSkinBlack;
import qnx.ui.skins.buttons.RoundedButtonSkinWhite;
[SWF(height="600", width="1024", frameRate="30",backgroundColor="#FFFFFF")]
public class toggleSample extends Sprite
{
private var myToggle:ToggleSwitch;
private var myButton:LabelButton;
public function toggleSample()
{
initializeUI();
}
private function initializeUI():void
{
myToggle = new ToggleSwitch();
myToggle.setPosition(200, 200);
myToggle.defaultLabel = "Light";
myToggle.selectedLabel = "Dark";
myToggle.selected = false;
// listen to the select event the toggle switch dispatches
myToggle.addEventListener(Event.SELECT, themeChange);
this.addChild(myToggle);
myButton = new LabelButton();
myButton.label = "myButton";
myButton.setPosition(200, 150);
this.addChild(myButton);
}
private function themeChange( e:Event ):void
{
// if the toggle is selected, set the button skin to black, else white
if ( myToggle.selected == true )
{
myButton.setSkin(RoundedButtonSkinBlack);
}
else
{
myButton.setSkin(RoundedButtonSkinWhite);
}
}
}
}