Flash Builder: How to Add a Spark Group Background Color

Ideally, things would be a lot simpler if spark groups had a background color property that could be set.  But of course, that is not the case in Flex / Flash Builder.  However, there is a minor work around that one can follow to obtain background colors for spark groups.

<s:Group>
    <s:Rect width="100%" height="100%">
        <s:fill><s:SolidColor color="0x336699" /></s:fill>
    </s:Rect>
    <s:VGroup>
        <s:Label text="group content..." />
        <s:Label text="group content..." />
        <s:Label text="group content..." />
    </s:VGroup>
</s:Group>

Since vgroup doesn’t have a background color property, you can make a rectangle behind it to have desired background properties.  Flex also isn’t very functional with rectangles unless they are in a group of some kind. (i.e. in a scroller tag)  So that is why it’s best to wrap both the rectangle and the vgroup in a regular grouping segment. (same applies to hgroup, tilegroup, and other sparkgroups)

*NOTE: Put the rectangle first.  Otherwise the rectangle will be covering the spark group before it.  In flex, the last element being produced is placed in front of the previous item.

Last updated by on .

1 Comment so far »

  1. Game of War – Fire Age Hack & Cheats Tool said

    am May 23 2015 @ 6:16 pm

    My partner and I stumbled over here coming from a different web page and thought I might
    as well check things out. I like what I see so i am just following you.

    Look forward to looking over your web page for a second time.

    My weblog; Game of War – Fire Age Hack & Cheats Tool

Comment RSS

Leave a comment

Name: (Required)

eMail: (Required)

Website:

Comment: