From the daily archives:

Tuesday, November 13, 2007

Styling individual FormItem labels using the labelStyleName style

by Peter deHaan on November 13, 2007

in Form, FormHeading, FormItem, Forms

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.

[click to continue…]

Tagged as:

{ 0 comments }

Changing default line colors in a Flex LineChart control

by Peter deHaan on November 13, 2007

in Charting, LineSeries, StyleManager

The following example shows how you can change the line colors in a LineChart in Flex by setting the lineStroke style in MXML or ActionScript, as seen in the following snippets:

MXML:

<mx:LineSeries id="closeSeries" yField="@close" form="curve" displayName="Close">
    <mx:lineStroke>
        <mx:Stroke color="haloGreen" weight="2" alpha="0.6" />
    </mx:lineStroke>
</mx:LineSeries>

ActionScript:

<mx:LineSeries id="closeSeries" yField="@close" form="curve" displayName="Close" />
...
closeSeries.setStyle("lineStroke", new Stroke(0xFF0000, 2, 0.4));

Full code after the jump.

[click to continue…]

Tagged as: , ,

{ 4 comments }

Removing the default drop shadow from a LineChart chart in Flex

by Peter deHaan on November 13, 2007

in Charting, LineSeries

The following example shows how you can remove the default drop shadow from a LineChart chart in Flex by setting the seriesFilters property, as seen in the following snippets:

<mx:LineChart id="lineChart"
        showDataTips="true"
        dataProvider="{dp}"
        width="100%"
        height="100%"
        seriesFilters="[]">

    <!-- . . . -->

</mx:LineChart>

<mx:LineChart id="lineChart"
        showDataTips="true"
        dataProvider="{dp}"
        width="100%"
        height="100%">

    <!-- series filters -->
    <mx:seriesFilters>
        <mx:Array />
    </mx:seriesFilters>

    <!-- . . . -->

</mx:LineChart>

Full code after the jump.

[click to continue…]

Tagged as:

{ 0 comments }