From the category archives:

Accordion

The following example shows how you can set the padding on a Spark NavigatorContent container in Flex 4 by setting the layout property and the paddingLeft, paddingRight, paddingTop, and paddingBottom properties

Full code after the jump.

[click to continue…]

{ 0 comments }

The following example shows how you can use a CFF embedded font with a Halo Accordion container by setting the textFieldClass style on the Halo Accordion container’s header to the mx.core.UITLFTextField class.

Full code after the jump.

[click to continue…]

{ 0 comments }

In a previous example, “Setting the base color on a Halo Accordion container in Flex 4″, we saw how you could set the base color on a Halo Accordion container in Flex 4 by setting the baseColor style.

The following example shows how you can set the content background color on a Halo Accordion container in Flex 4 by setting the contentBackgroundColor style.

Full code after the jump.

[click to continue…]

{ 0 comments }

The following example shows how you can set the base theme color on a Halo Accordion container in Flex 4 by setting the baseColor style.

Full code after the jump.

[click to continue…]

{ 3 comments }

The following example shows how you can set the base color on a Halo Accordion container in Flex 4 by setting the baseColor style.

Full code after the jump.

[click to continue…]

{ 0 comments }

The following example shows how you can create a custom, repeating image header background on a Halo Accordion container (with default Spark skin) in Flex 4 by setting the headerStyleName and skin styles.

Full code after the jump.

[click to continue…]

{ 0 comments }

The following example shows how you can style the Halo Accordion header (with default Spark skin) in Flex 4 by creating a new skin based on the default Spark skin and modifying the various skin parts.

The default Halo Accordion header Spark skin can be found at \frameworks\projects\sparkskins\src\mx\skins\spark\AccordionHeaderSkin.mxml.

Full code after the jump.

[click to continue…]

{ 7 comments }

In a previous example, “Adding icons to a Flex Accordion control”, we saw how you could add embedded icons to a Flex Accordion container by setting the icon style.

The following example shows how you can set a separate icon on an Accordion header when the header is selected by looping over each header using the getHeaderAt() method and setting the selectedUpIcon, selectedOverIcon, and selectedDownIcon styles.

Full code after the jump.

[click to continue…]

{ 7 comments }

Setting a creation complete effect on an Accordion container in Flex

by Peter deHaan June 22, 2008

The following example shows how you can set a creation complete effect on a Flex Accordion container by setting the creationCompleteEffect style.
Full code after the jump.

Read the full article →

Disabling keyboard navigation on the Accordion container in Flex

by Peter deHaan June 10, 2008

The following example shows how you can disable keyboard navigation on the Flex Accordion container by extending the Accordion class and overriding the protected keyDownHandler() method.
Full code after the jump.

Read the full article →

Using embedded fonts with the Accordion container in Flex

by Peter deHaan May 31, 2008

The following example shows you how you can use an embedded font with the Flex Accordion container by setting the headerStyleName style.
Full code after the jump.

Read the full article →

Preventing users from clicking on an Accordion container’s header in Flex

by Peter deHaan May 30, 2008

The following examples show how you can prevent a user from clicking a Flex Accordion container’s header by creating a custom Accordion header renderer.
Full code after the jump.

Read the full article →