Category Archives: Form

Styling individual FormItem labels using the labelStyleName style

The following example shows you how you can style individual labels in a FormItem container in Flex by setting the labelStyleName style, as seen in the following snippet:

<mx:Style>
    .requiredLabel {
        color: red;
        fontSize: 12;
        fontWeight: bold;
    }
</mx:Style>

<mx:Form>
    <mx:FormItem label="Field 1:"
            labelStyleName="requiredLabel"
            required="true">
        <mx:Label id="lbl1" text="{str}" />
    </mx:FormItem>
</mx:Form>

The labelStyleName style was added in Flex 3 build 186889 (Wed Nov 07 2007 or later). You may need to download a nightly build of the Flex 3 SDK from the Adobe Labs website.

Full code after the jump.

Continue reading Styling individual FormItem labels using the labelStyleName style

Building a simple tip calculator in Flex

The following example shows a very simple (and probably somewhat buggy) tip calculator which I put together in a few minutes using Flex. Nothing really new, but sometimes its fun to combine a few of the things we’ve covered over the past posts and build something a bit more interesting.

Full code after the jump.

Continue reading Building a simple tip calculator in Flex

Changing a form item’s background color when a child control has focus

I recently saw this on the Interwebs and thought I’d try to rebuild the effect in Flex. It is a pretty nice way to highlight the currently active form item.

The following example shows how you can use the focusIn and focusOut events to highlight the currently focused form item.

Full code after the jump.

Continue reading Changing a form item’s background color when a child control has focus