Package | spark.components |
Class | public class IconItemRenderer |
Inheritance | IconItemRenderer ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() |
Implements | IGraphicElementContainer, ISharedDisplayObject |
Language Version: | ActionScript 3.0 |
Product Version: | Flex 4.5 |
Runtime Versions: | AIR 2.5 |
- An icon on the left defined by the
iconField
oriconFunction
property. - A single-line text label next to the icon defined by the
labelField
orlabelFunction
property. - A multi-line message below the text label defined by the
messageField
ormessageFunction
property. - A decorator icon on the right defined by the
decorator
property.
To apply CSS styles to the single-line text label, such as font size and color,
set the styles on the IconItemRenderer class.
To set styles on the multi-line message, use the messageStyleNameM
style property.
The following example sets the text styles for both the text label and message:
<fx:Style> .myFontStyle { fontSize: 15; color: #9933FF; } </fx:Style> <s:List id="myList" width="100%" height="100%" labelField="firstName"> <s:itemRenderer> <fx:Component> <s:IconItemRenderer messageStyleName="myFontStyle" fontSize="25" labelField="firstName" messageField="lastName" decorator="@Embed(source='assets/logo_small.jpg')"/> </fx:Component> </s:itemRenderer> <s:ArrayCollection> <fx:Object firstName="Dave" lastName="Duncam" company="Adobe" phone="413-555-1212"/> <fx:Object firstName="Sally" lastName="Smith" company="Acme" phone="617-555-1491"/> <fx:Object firstName="Jim" lastName="Jackson" company="Beta" phone="413-555-2345"/> <fx:Object firstName="Mary" lastName="Moore" company="Gamma" phone="617-555-1899"/> </s:ArrayCollection> </s:List>MXML Syntax

The <s:IconItemRenderer>
tag inherits all of the tag
attributes of its superclass and adds the following tag attributes:
<s:IconItemRenderer Properties decorator="" iconContentLoader="See property description" iconField="null" iconFillMode=""scale iconFunction="null" iconHeight="NaN" iconPlaceholder="null" iconScaleMode="stretch" iconWidth="NaN" label="" labelField="null" labelFunction="null" messageField="null" messageFunction="null" Common Styles horizontalGap="8" iconDelay="500" messageStyleName="iconItemRendererMessageStyle" verticalGap="6" >
More examples
Related API Elements
mx.core.IDataRenderer
spark.components.IItemRenderer
spark.components.supportClasses.ItemRenderer
spark.components.LabelItemRenderer
Property | Defined By | ||
---|---|---|---|
![]() | accessibilityImplementation : AccessibilityImplementation
The current accessibility implementation (AccessibilityImplementation)
for this InteractiveObject instance. | InteractiveObject | |
![]() | accessibilityProperties : AccessibilityProperties
The current accessibility options for this display object. | DisplayObject | |
![]() | alpha : Number
Indicates the alpha transparency value of the object specified. | DisplayObject | |
![]() | blendMode : String
A value from the BlendMode class that specifies which blend mode to use. | DisplayObject | |
![]() | blendShader : Shader [write-only]
Sets a shader that is used for blending the foreground and background. | DisplayObject | |
![]() | buttonMode : Boolean
Specifies the button mode of this sprite. | Sprite | |
![]() | cacheAsBitmap : Boolean
If set to true, Flash runtimes cache an internal bitmap representation of the
display object. | DisplayObject | |
![]() | cacheAsBitmapMatrix : Matrix
If non-null, this Matrix object defines how a display object is rendered when
cacheAsBitmap is set to true. | DisplayObject | |
![]() | constructor : Object
A reference to the class object or constructor function for a given object instance. | Object | |
![]() | contextMenu : NativeMenu
Specifies the context menu associated with this object. | InteractiveObject | |
![]() | dropTarget : DisplayObject [read-only]
Specifies the display object over which the sprite is being dragged, or on
which the sprite was dropped. | Sprite | |
![]() | filters : Array
An indexed array that contains each filter object currently associated with the display object. | DisplayObject | |
![]() | focusRect : Object
Specifies whether this object displays a focus rectangle. | InteractiveObject | |
![]() | graphics : Graphics [read-only]
Specifies the Graphics object that belongs to this sprite where vector
drawing commands can occur. | Sprite | |
![]() | hitArea : Sprite
Designates another sprite to serve as the hit area for a sprite. | Sprite | |
![]() | loaderInfo : LoaderInfo [read-only]
Returns a LoaderInfo object containing information about loading the file
to which this display object belongs. | DisplayObject | |
![]() | mask : DisplayObject
The calling display object is masked by the specified mask object. | DisplayObject | |
![]() | metaData : Object
Obtains the meta data object of the DisplayObject instance if meta data was stored alongside the
the instance of this DisplayObject in the SWF file through a PlaceObject4 tag. | DisplayObject | |
![]() | mouseChildren : Boolean
Determines whether or not the children of the object are mouse, or user input device, enabled. | DisplayObjectContainer | |
![]() | mouseEnabled : Boolean
Specifies whether this object receives mouse, or other user input, messages. | InteractiveObject | |
![]() | mouseX : Number [read-only]
Indicates the x coordinate of the mouse or user input device position, in pixels. | DisplayObject | |
![]() | mouseY : Number [read-only]
Indicates the y coordinate of the mouse or user input device position, in pixels. | DisplayObject | |
![]() | name : String
Indicates the instance name of the DisplayObject. | DisplayObject | |
![]() | needsSoftKeyboard : Boolean
Specifies whether a virtual keyboard (an on-screen, software keyboard) should display
when this InteractiveObject instance receives focus. | InteractiveObject | |
![]() | numChildren : int [read-only]
Returns the number of children of this object. | DisplayObjectContainer | |
![]() | opaqueBackground : Object
Specifies whether the display object is opaque with a certain background color. | DisplayObject | |
![]() | root : DisplayObject [read-only]
For a display object in a loaded SWF file, the root property is the
top-most display object in the portion of the display list's tree structure represented by that SWF file. | DisplayObject | |
![]() | scale9Grid : Rectangle
The current scaling grid that is in effect. | DisplayObject | |
![]() | scrollRect : Rectangle
The scroll rectangle bounds of the display object. | DisplayObject | |
![]() | softKeyboard : String
Controls the appearance of the soft keyboard. | InteractiveObject | |
![]() | softKeyboardInputAreaOfInterest : Rectangle
Defines the area that should remain on-screen when a soft keyboard is displayed (not available on iOS). | InteractiveObject | |
![]() | soundTransform : flash.media:SoundTransform
Controls sound within this sprite. | Sprite | |
![]() | stage : Stage [read-only]
The Stage of the display object. | DisplayObject | |
![]() | tabChildren : Boolean
Determines whether the children of the object are tab enabled. | DisplayObjectContainer | |
![]() | tabEnabled : Boolean
Specifies whether this object is in the tab order. | InteractiveObject | |
![]() | tabIndex : int
Specifies the tab ordering of objects in a SWF file. | InteractiveObject | |
![]() | textSnapshot : flash.text:TextSnapshot [read-only]
Returns a TextSnapshot object for this DisplayObjectContainer instance. | DisplayObjectContainer | |
![]() | useHandCursor : Boolean
A Boolean value that indicates whether the pointing hand (hand cursor) appears when the pointer rolls
over a sprite in which the buttonMode property is set to true. | Sprite |
Property | Defined By |
---|
Method | Defined By | ||
---|---|---|---|
![]() |
Adds a child DisplayObject instance to this DisplayObjectContainer instance. | DisplayObjectContainer | |
![]() |
Adds a child DisplayObject instance to this DisplayObjectContainer
instance. | DisplayObjectContainer | |
![]() | 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 instance that exists at the specified index. | DisplayObjectContainer | |
![]() |
Returns the child display object that exists with the specified name. | DisplayObjectContainer | |
![]() |
Returns the index position of a child DisplayObject instance. | 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 the specified child DisplayObject instance from the child list of the DisplayObjectContainer instance. | DisplayObjectContainer | |
![]() |
Removes a child DisplayObject from the specified index position in the child list of
the DisplayObjectContainer. | DisplayObjectContainer | |
![]() |
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 | |
![]() |
Changes the position of an existing child in the display object container. | DisplayObjectContainer | |
![]() |
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 | |
![]() |
Swaps the z-order (front-to-back order) of the two specified child objects. | DisplayObjectContainer | |
![]() |
Swaps the z-order (front-to-back order) of the child objects at the two specified index positions in the
child list. | DisplayObjectContainer | |
![]() |
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: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 The vertical distance in pixels from the top edge of the content area to the control's baseline position. | UIComponent | ||
![]() | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 The vertical distance, in pixels, from the bottom edge of the component to the bottom edge of its parent container's content area. | UIComponent | ||
![]() | Type: uint Format: Color CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Color of text in the component, including the component label. | LabelItemRenderer | ||
![]() | Type: uint Format: Color CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 Color of the component highlight when validation fails. | UIComponent | ||
![]() | Type: Class CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 Skin used to draw the focus rectangle. | UIComponent | ||
![]() | Type: String CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Name of the font to use. | LabelItemRenderer | ||
![]() | Type: Number Format: Length CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Height of the text, in pixels. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Determines whether the text is italic font. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Determines whether the text is boldface. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 The horizontal distance in pixels from the center of the component's content area to the center of the component. | UIComponent | ||
horizontalGap | Type: Number Format: Length CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Number of pixels between children in the horizontal direction. The default value depends on the component class; if not overridden for the class, the default value is 8. | IconItemRenderer | ||
iconDelay | Type: Number Format: Time CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, The delay value before attempting to load the icon's source if it has not been cached already. The reason a delay is useful is while scrolling around, you don't necessarily want the image to load up immediately. Instead, you should wait a certain delay period to make sure the user actually wants to see this item renderer. The default value is 500 . | IconItemRenderer | ||
![]() | Type: String CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: Flash10, AIR 2.5 The primary interaction mode for this component. | UIComponent | ||
![]() | Type: String CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.1 Runtime Versions: Flash10, AIR 1.5 Specifies the desired layout direction of a component. | UIComponent | ||
![]() | Type: Number Format: Length CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Additional vertical space between lines of text. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 The horizontal distance, in pixels, from the left edge of the component to the left edge of its parent container's content area. | UIComponent | ||
![]() | Type: Number CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, The number of additional pixels to appear between each character. | LabelItemRenderer | ||
messageStyleName | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Name of the CSS Style declaration to use for the styles for the message component. The default value is iconItemRendererMessageStyle . | IconItemRenderer | ||
![]() | Type: Number Format: Length CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Number of pixels between the bottom border and the text component of the item renderer. | LabelItemRenderer | ||
![]() | Type: Number Format: Length CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 Number of pixels between the component's left border and the left edge of its content area. | LabelItemRenderer | ||
![]() | Type: Number Format: Length CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 Number of pixels between the component's right border and the right edge of its content area. | LabelItemRenderer | ||
![]() | Type: Number Format: Length CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Number of pixels between the top border and the text component of the item renderer. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 The horizontal distance, in pixels, from the right edge of the component to the right edge of its parent container's content area. | UIComponent | ||
![]() | Type: uint Format: Color CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Color of the highlights when the mouse is over the component. | LabelItemRenderer | ||
![]() | Type: uint Format: Color CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, The color of the background of a renderer when the user selects it. | LabelItemRenderer | ||
![]() | Type: Boolean CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: Flash10, AIR 1.5 Show the error border or skin when this component is invalid | UIComponent | ||
![]() | Type: Boolean CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: Flash10, AIR 1.5 Show the error tip when this component is invalid and the user rolls over it | UIComponent | ||
![]() | Type: String CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Alignment of text within a container. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Determines whether the text is underlined. | LabelItemRenderer | ||
![]() | Type: Number Format: Length CSS Inheritance: Yes Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Offset of first line of text from the left side of the container, in pixels. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 The vertical distance, in pixels, from the top edge of the component to the top edge of its parent container's content area. | UIComponent | ||
![]() | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, The vertical alignment of the content when it does not have a one-to-one aspect ratio. | LabelItemRenderer | ||
![]() | Type: String CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 3 Runtime Versions: Flash9, AIR 1.1 The vertical distance in pixels from the center of the component's content area to the center of the component. | UIComponent | ||
verticalGap | Type: Number Format: Length CSS Inheritance: No Language Version: ActionScript 3.0 Product Version: Flex 4.5 Runtime Versions: AIR2.5, Number of pixels between children in the vertical direction. The default value depends on the component class; if not overridden for the class, the default value is 6. | IconItemRenderer |
<?xml version="1.0" encoding="utf-8"?> <!-- Simple example to demonstrate the spark IconItemRenderer component --> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> <s:List width="100%" height="100%" alternatingItemColors="0xE3E3E3" contentBackgroundColor="0xF9F9F9" downColor="0x70B2EE" selectionColor="0x70B2EE" labelField="productName"> <s:itemRenderer> <fx:Component> <s:IconItemRenderer decorator="@Embed('assets/decoratorImage.png')" iconPlaceholder="@Embed('assets/loadingImage.png')" iconField="productIcon" iconWidth="125" iconHeight="125" messageField="productDesc" /> </fx:Component> </s:itemRenderer> <s:dataProvider> <s:ArrayList> <fx:Object productIcon="assets/fx.jpg" productName="Flex SDK" productDesc="A highly productive, free, open source framework."/> <fx:Object productIcon="assets/fb.jpg" productName="Flash Builder" productDesc="Designed to help developers rapidly develop RIAs."/> <fx:Object productIcon="assets/fc.jpg" productName="Flash Catalyst" productDesc="An approachable new interaction design tool."/> </s:ArrayList> </s:dataProvider> </s:List> </s:Application>
Wed Nov 21 2018, 06:34 AM -08:00