Working with UI Components

(Chapter 7)

Prof Rama Satish K.V.

RNSIT, Bangalore
UI Types
Creating Component Instances
Common UI Component Properties
x The x coordinate of the component relative to its
parent container.
y The y coordinate of the component relative to its
parent container.
width The width of the component in pixels.
height The height of the component in pixels
rotation The number of degrees of rotation of the
component relative to its original orientation.
alpha The opacity of the component.
visible The visibility of the component.
Enabled Whether a component is interactive.
parent A reference to the parent container for the
component.
Usage
Handling Events in MXML
Handling Events in Action Scripts
Standard Flex component events
 Buttons
Of the four types, Button and LinkButton
are the most similar in use. In fact, the
primary difference between Button and
LinkButton is purely cosmetic: buttons
have borders and backgrounds, and link
buttons do not.
 Value Selectors
Value selectors are components that allow the
user to select a value. This is a fairly diverse
category of components because the types of
values they allow the user to select and the
ways in which they allow the user to select the
values are quite different.
Text Components
List-Based Controls
Using Data Grids
Using Tree Controls
Working with Selected Values and Items
allowMultipleSelection By default, lists allow for one selected item at a
time. By setting allowMultipleSelection to true, a
user can select more than one item at a time.
value The value of the selected item.

selectedItem The element from the data provider

corresponding to the selected item in the
list. This
selectedItems An array of elements. This is the multiselect
equivalent to selectedItem.
selectedIndex The integer index of the selected item.

selectedIndices An array of the indices of the selected items.

List and Stepper Example
Using PopUpButton
 Navigators
Navigators are controls that allow users to
navigate from screen to screen, page to
page, section to section, or option to
option within a Flex application.
We can further categorize navigator
controls as follows: accordion, divided
boxes, option bars, and view stacks.