qnx.fuse.ui.buttons.ToggleSwitch

ToggleSwitch

Properties | Methods | Events | Examples


Packageqnx.fuse.ui.buttons
Classpublic class ToggleSwitch
InheritanceToggleSwitch Inheritance SliderBase Inheritance UIComponent Inheritance flash.display.MovieClip

The 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:

A toggle switch.



Class information:
PlayBook Tablet OS Version:   1.0.6

View the examples

See also

Button (toggle property)



Public Properties

 PropertyDefined By
  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
 InheritedexplicitHeight : Number
[read-only] Returns the explicit height (actual height, in pixels) of the UI component.
UIComponent
 InheritedexplicitWidth : Number
[read-only] Returns the explicit width (actual width, in pixels) of the UI component.
UIComponent
 InheritedincludeInLayout : Boolean
Specifies whether or not the component should be included in its parent container's layout.
UIComponent
 InheritedlayoutData : Object
Returns the layout data for the object.
UIComponent
 InheritedminHeight : Number
Gets or sets the minimum preferred height of the control.
UIComponent
 InheritedminWidth : Number
Gets or sets the minimum preferred width of the control.
UIComponent
  paddingHeight : Number
Preferred number of extra pixels added vertically between the text and the border of the button.
ToggleSwitch
  paddingWidth : Number
Preferred number of extra pixels added horizontally between the text and the border of the button.
ToggleSwitch
  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

Public Methods

 MethodDefined By
  
Creates a ToggleSwitch instance.
ToggleSwitch
 Inherited
childChanged(resizedChild:DisplayObject = null):Boolean
Notifies the UIComponent that one or more of its children has changed in a manner that may affect this object's layout.
UIComponent
 Inherited
destroy():void
Call this method when you want to have your object collected by the garbage collector.
UIComponent
 Inherited
Returns the size options for the given control.
UIComponent
  
getTextFormatForState(state:String):TextFormat
Returns the TextFormat object for a specified state.
ToggleSwitch
 Inherited
Calling this method results in a call to the components validateDisplayList() method before the display list is rendered.
UIComponent
 Inherited
Calling this method results in a call to the components validateProperties() method before the display list is rendered.
UIComponent
 Inherited
measure(availableWidth:Number, availableHeight:Number):LayoutMeasurement
This method calls doMeasure() in order to calculate the preferred size of the control.
UIComponent
 Inherited
setActualSize(w:Number, h:Number):void
Sets the width and height of the object without setting the explicitWidth and explicitHeight.
UIComponent
 Inherited
setFillSkin(skin:Object):void
Sets the fill skin for the slider.
SliderBase
 Inherited
setLayoutBounds(bounds:Rectangle):void
Sets the receiver's size and location to the rectangular area specified by the arguments.
UIComponent
 Inherited
setPosition(x:Number, y:Number):void
Sets the x and y position of the component.
UIComponent
  
setTextFormatForState(format:TextFormat, state:String):void
Sets the TextFormat object for the label for a given state.
ToggleSwitch
 Inherited
setThumbSkin(skin:Object):void
Sets the skin for the slider thumb button.
SliderBase
  
setTrackSkin(skin:Object):void
[override] Sets the skin for the track of the toggle switch.
ToggleSwitch
 Inherited
Validates the display list of the component by calling the updateDisplayList().
UIComponent
 Inherited
Validates the component immediately by calling validateProperties(), validateSizes(), and validateDisplayList() if necessary.
UIComponent
 Inherited
Validates the properties of the component by calling the commitProperties() method.
UIComponent

Protected Methods

 MethodDefined By
 Inherited
Process properties of the component.
UIComponent
 Inherited
Process the state of the component.
UIComponent
 Inherited
createFill(linkage:Object):void
SliderBase
 Inherited
createThumb(linkage:Object):void
SliderBase
 Inherited
createTrack(linkage:Object):void
SliderBase
 Inherited
doMeasure(availableWidth:Number, availableHeight:Number):LayoutMeasurement
[override] Measures the size of the component so that it can be reported to the layout framework for laying the component out properly.
SliderBase
 Inherited
drawFill():void
Draws the fill of the slider.
SliderBase
 Inherited
flushCache():void
Invoked as part of parentLayoutChanged.
UIComponent
 Inherited
onAdded():void
Called when the instance is added to the stage.
UIComponent
 Inherited
onRemoved():void
Called when the instance is removed from the stage.
UIComponent
 Inherited
Invalidates the parent's size and display list if includeInLayout property is set to true.
UIComponent
 Inherited
Called when the position of the thumb on the x axis has changed.
SliderBase
 Inherited
Called when the thumb has been pressed by the user.
SliderBase
 Inherited
Called when the thumb has been released by the user.
SliderBase
 Inherited
Called when the thumb has been pressed by the user.
SliderBase
 Inherited
updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
Sets the size and position of the children of the component.
UIComponent

Events

 Event Summary Defined By
  Dispatches a select event when the selection of the control changes.ToggleSwitch

Property Detail

defaultLabel


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".


Implementation

public function get defaultLabel():String
public function set defaultLabel(value:String):void

See also

selectedLabel

embedFonts


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.


Implementation

public function get embedFonts():Boolean
public function set embedFonts(value:Boolean):void

See also

setTextFormatForState()

paddingHeight


paddingHeight:Number

Preferred number of extra pixels added vertically between the text and the border of the button. This affects the preferred size of the button and may be overridden by the layout.


Implementation

public function get paddingHeight():Number
public function set paddingHeight(value:Number):void

paddingWidth


paddingWidth:Number

Preferred number of extra pixels added horizontally between the text and the border of the button. This affects the preferred size of the button and may be overridden by the layout.


Implementation

public function get paddingWidth():Number
public function set paddingWidth(value:Number):void

selected


selected:Boolean

Gets or sets the value of the switch (the position of the thumb).

true for ON, selected, false for OFF, unselected.


Implementation

public function get selected():Boolean
public function set selected(value:Boolean):void

selectedLabel


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.


Implementation

public function get selectedLabel():String
public function set selectedLabel(value:String):void

See also

defaultLabel

Constructor Detail

ToggleSwitch()


public function ToggleSwitch()

Creates a ToggleSwitch instance.

Method Detail

getTextFormatForState()


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.

Returns

TextFormat — The TextFormat object for the specified state.

See also

setTextFormatForState()
SkinStates

setTextFormatForState()


public function setTextFormatForState(format:TextFormat, state:String):void

Sets the TextFormat object for the label for a given state.

Valid state parameter values are:

  • selected
  • default

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

SkinStates
getTextFormatForState()

setTrackSkin()


override public function setTrackSkin(skin:Object):void

Sets the skin for the track of the toggle switch. The track forms the background of the toggle switch, and the thumb is the moveable foreground component.

Parameters

skin:Object — The skin to set.

See also

ToggleSwitchTrackSkinWhite
ToggleSwitchTrackSkinBlack

Event Detail

select


Event Object Type: flash.events.Event
Event.type property = flash.events.Event.SELECT

Dispatches a select event when the selection of the control changes.

Examples

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.fuse.ui.buttons.LabelButton;
    import qnx.fuse.ui.buttons.ToggleSwitch;
    import qnx.fuse.ui.skins.buttons.RoundedButtonSkinBlack;
    import qnx.fuse.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);
            }
        }

    }
}