uiToggleFrame

Required: Aspire UI Components Standard Edition

A uiToggleFrame is a uiFrame whose content can be toggled enabled/disabled by clicking on a check box title. The container embeds a uiCheckBox instance as its title. You cannot change this title, but you may reference the uiCheckBox instance and change its properties.

Using uiToggleFrame is the same as in uiFrame, except that you can define the check box title via the constructor:

import com.ghostwire.ui.containers.uiBox;
import com.ghostwire.ui.containers.uiToggleFrame;
import com.ghostwire.ui.containers.uiPane;
import com.ghostwire.ui.controls.uiCheckBox;
import com.ghostwire.ui.controls.uiText;
 
// ** create some content **
var fruit0:uiCheckBox = new uiCheckBox("Apple");
var fruit1:uiCheckBox = new uiCheckBox("Banana");
var fruit2:uiCheckBox = new uiCheckBox("Orange");
 
var fruitsBox:uiBox    = new uiBox();
fruitsBox.vertical    = true;
fruitsBox.spacing    = 4;
fruitsBox.addChild(new uiText("You can choose one or more fruits!"));
fruitsBox.addChild(fruit0);
fruitsBox.addChild(fruit1);
fruitsBox.addChild(fruit2);
 
var contentPane:uiPane = new uiPane();
contentPane.addChild(fruitsBox);
 
// ** create the frame **
var frm:uiToggleFrame = new uiToggleFrame("Fruits");
frm.content = contentPane; // ** note: use content property **
frm.move(10,10);
 
// ** add to display list **
addChild(frm);

When the check box title is clicked and unchecked:

By default, the uiToggleFrame will start with its content toggled/enabled, ie its check box title will be checked. To change this programmatically, use the toggled property:

var frm:uiToggleFrame = new uiToggleFrame("Fruits");
frm.toggled = false;

When the end-user clicks the check box title of the uiToggleFrame instance, a Event.CHANGE event will be dispatched. Listen for this event to if your application needs to be notified when the embedded content is enabled/disabled.

var frm:uiToggleFrame = new uiToggleFrame("Fruits");
frm.addEventListener(Event.CHANGE, on_frameToggle, false, 0, true);

• uiToggleFrame Example

For more information on the members of the com.ghostwire.ui.containers.uiToggelFrame class, please refer to the API Reference.