Package | spark.components |
Class | public class CheckBox |
Inheritance | CheckBox ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
Language Version: | ActionScript 3.0 |
Product Version: | Flex 4 |
Runtime Versions: | Flash Player 10, AIR 1.5 |
When a user clicks a CheckBox component or its associated text,
the CheckBox component sets its selected
property
to true
for checked, and to false
for unchecked.
To use this component in a list-based component, such as a List or DataGrid, create an item renderer. For information about creating an item renderer, see Custom Spark item renderers.
The CheckBox control has the following default characteristics:
Characteristic | Description |
---|---|
Default size | Wide enough to display the text label of the control |
Minimum size | 18 pixels wide and 18 pixels high |
Maximum size | 10000 pixels wide and 10000 pixels high |
Default skin class | spark.skins.spark.CheckBoxSkin |

The <s:CheckBox>
tag inherits all of the tag
attributes of its superclass and adds the following attributes:
<s:CheckBox Properties symbolColor="0x000000" />
Default MXML Propertylabel
More examples
Related API Elements
Method | Defined By | ||
---|---|---|---|
![]() | addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void
Registers an event listener object with an EventDispatcher object so that the listener
receives notification of an event. | EventDispatcher | |
![]() |
Indicates whether the security restrictions
would cause any display objects to be omitted from the list returned by calling
the DisplayObjectContainer.getObjectsUnderPoint() method
with the specified point point. | DisplayObjectContainer | |
![]() |
Determines whether the specified display object is a child of the DisplayObjectContainer instance or
the instance itself. | DisplayObjectContainer | |
![]() |
Returns a rectangle that defines the area of the display object relative to the coordinate system
of the targetCoordinateSpace object. | DisplayObject | |
![]() |
Returns the child display object that exists with the specified name. | DisplayObjectContainer | |
![]() |
Returns an array of objects that lie under the specified point and are children
(or grandchildren, and so on) of this DisplayObjectContainer instance. | DisplayObjectContainer | |
![]() |
Returns a rectangle that defines the boundary of the display object,
based on the coordinate system defined by the targetCoordinateSpace
parameter, excluding any strokes on shapes. | DisplayObject | |
![]() |
Converts the point object from the Stage (global) coordinates
to the display object's (local) coordinates. | DisplayObject | |
![]() |
Converts a two-dimensional point from the Stage (global) coordinates to a
three-dimensional display object's (local) coordinates. | DisplayObject | |
![]() |
Checks whether the EventDispatcher object has any listeners registered for a specific type
of event. | EventDispatcher | |
![]() |
Indicates whether an object has a specified property defined. | Object | |
![]() |
Evaluates the bounding box of the display object to see if it overlaps or intersects with the
bounding box of the obj display object. | DisplayObject | |
![]() |
Evaluates the display object to see if it overlaps or intersects with the
point specified by the x and y parameters. | DisplayObject | |
![]() |
Indicates whether an instance of the Object class is in the prototype chain of the object specified
as the parameter. | Object | |
![]() |
Converts a three-dimensional point of the three-dimensional display
object's (local) coordinates to a two-dimensional point in the Stage (global) coordinates. | DisplayObject | |
![]() |
Converts the point object from the display object's (local) coordinates to the
Stage (global) coordinates. | DisplayObject | |
![]() |
Indicates whether the specified property exists and is enumerable. | Object | |
![]() |
Removes all child DisplayObject instances from the child list of the DisplayObjectContainer instance. | DisplayObjectContainer | |
![]() |
Removes a listener from the EventDispatcher object. | EventDispatcher | |
![]() |
Raises a virtual keyboard. | InteractiveObject | |
![]() |
Sets the availability of a dynamic property for loop operations. | Object | |
![]() |
Lets the user drag the specified sprite. | Sprite | |
![]() |
Lets the user drag the specified sprite on a touch-enabled device. | Sprite | |
![]() |
Recursively stops the timeline execution of all MovieClips rooted at this object. | DisplayObjectContainer | |
![]() |
Ends the startDrag() method. | Sprite | |
![]() |
Ends the startTouchDrag() method, for use with touch-enabled devices. | Sprite | |
![]() |
Returns the string representation of this object, formatted according to locale-specific conventions. | Object | |
![]() |
Returns the primitive value of the specified object. | Object | |
![]() |
Checks whether an event listener is registered with this EventDispatcher object or any of
its ancestors for the specified event type. | EventDispatcher |
Styles are either common or associated with a specific theme. If the style is common, it can be used with any theme. If a style is associated with a specific theme, it can only be used if your application uses that theme.
Style | Description | Defined By | ||
---|---|---|---|---|
![]() | Type: uint Format: Color CSS Inheritance: Yes Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 The main color for a component. | SkinnableComponent | ||
![]() | Type: Number CSS Inheritance: No Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 The alpha of the focus ring for this component. | ButtonBase | ||
![]() | Type: uint Format: Color CSS Inheritance: Yes Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 Color of focus ring when the component is in focus. | ButtonBase | ||
symbolColor | Type: uint Format: Color CSS Inheritance: Yes Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 Color of any symbol of a component. Examples include the check mark of a CheckBox or the arrow of a scroll button. The default value is 0x000000 . | CheckBox |
Style | Description | Defined By | ||
---|---|---|---|---|
![]() | Type: uint Format: Color CSS Inheritance: Yes Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 The main color for a component. | SkinnableComponent | ||
![]() | Type: Number CSS Inheritance: No Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 The alpha of the focus ring for this component. | ButtonBase | ||
![]() | Type: uint Format: Color CSS Inheritance: Yes Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 Color of focus ring when the component is in focus. | ButtonBase | ||
iconPlacement | Type: String CSS Inheritance: No Theme: mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 Orientation of the icon in relation to the label. Valid MXML values are right , left ,
bottom , and top .
In ActionScript, you can use the following constants
to set this property:
IconPlacement.LEFT . | CheckBox | ||
![]() | Type: Number Format: Length CSS Inheritance: Yes Theme: mobile Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: Flash10.1, AIR 2.0 Additional vertical space between lines of text. | ButtonBase | ||
![]() | Type: Number CSS Inheritance: Yes Theme: mobile Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: Flash10.1, AIR 2.0 The number of additional pixels to appear between each character. | ButtonBase | ||
symbolColor | Type: uint Format: Color CSS Inheritance: Yes Theme: spark, mobile Language Version: ActionScript 3.0 Product Version: Flex 4 Runtime Versions: Flash10, AIR 1.5 Color of any symbol of a component. Examples include the check mark of a CheckBox or the arrow of a scroll button. The default value is 0x000000 . | CheckBox |
This component uses skins made up of skin parts. Do not set the skin parts directly. The component's skin sets the skin parts.
To skin the component, implement a skin that defines the following states. Although you must implement all skin states, a skin state can be empty. An empty skin state specifies no changes to the default skin state.
<?xml version="1.0"?> <!-- Simple example to demonstrate the Spark CheckBox control --> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx"> <fx:Script> <![CDATA[ [Bindable] public var totalCost:Number = 4.50; // This event handler adds/removes the cost of condiments to/from the total cost. private function modifyBurger(evt:MouseEvent):void { // Add 0.25 to the total cost for every condiment. Delete 0.25 for // every condiment removed. if(CheckBox(evt.target).selected) { totalCost += 0.25; } else { totalCost -= 0.25; } // Format the totalCost and then display it in a label. totalString.text = usdFormatter.format(totalCost); } ]]> </fx:Script> <fx:Declarations> <mx:CurrencyFormatter id="usdFormatter" precision="2" currencySymbol="$" decimalSeparatorFrom="." decimalSeparatorTo="." useNegativeSign="true" useThousandsSeparator="true" alignSymbol="left"/> </fx:Declarations> <s:Panel title="Spark CheckBox Control Example" width="75%" height="75%" horizontalCenter="0" verticalCenter="0"> <s:VGroup left="10" right="10" top="10" bottom="10"> <s:Label text="Hamburger Base Price: $4.50" /> <s:Label text="Select condiments for your hamburger (0.25 each):" /> <s:CheckBox id="lettuceCB" label="Pickles" click="modifyBurger(event);"/> <s:CheckBox id="tomatoCB" label="Tomato" click="modifyBurger(event);"/> <s:CheckBox id="pickleCB" label="Lettuce" click="modifyBurger(event);"/> <s:CheckBox id="mayoCB" label="Mayonnaise" click="modifyBurger(event);"/> <mx:Spacer height="20" /> <s:HGroup> <s:Label text="Total Price: " /> <s:Label id="totalString" text="$4.50"/> </s:HGroup> </s:VGroup> </s:Panel> </s:Application>
Wed Nov 21 2018, 06:34 AM -08:00