Monday, January 19, 2009

FormItem label verticalAlign

As far as I've seen the label on FormItem's are always vertically aligned at the top. I have no idea why the Adobe guys didn't add the expected "verticalAlign" style to let the programmer choose where the label is positioned.

Anyways, I've extended the default mx.containers.FormItem control to add support for this style:
public class FormItemVerticalAlign extends FormItem 
    override protected function updateDisplayList(w:Number, h:Number):void {
        super.updateDisplayList(w, h);   
        // vertically align (top by default)
        var verticalAlign:String = getStyle("verticalAlign");
        if (verticalAlign == "middle") {   
            itemLabel.y = Math.max(0(h - itemLabel.height2);
        else if (verticalAlign == "bottom") {
            var padBottom:Number = getStyle("paddingBottom");
            itemLabel.y = Math.max(0, h - itemLabel.height - padBottom);



Anonymous said...

Thanks very much! This saved me a lot of time.

Paul said...

Wow, this is fantastic. Probably simple for experienced developers but it was exactly what I was looking for and gave me a great entrance into creating my own classes.

Aryan said...

Good one. Thanks Much.

Anonymous said...

Thanks, this is cool

shrutijakhete said...

Thanks this is what i was looking for!!!

Dan said...

Thanks mate! Saved me a lot of banging my head against the wall.

How retarded is that of Adobe to not implement that? - It was driving me nuts. I thought I was going mental. LOL

Thanks anyways!

Anonymous said...

this may be looong overdue, but adobe didnt actually left this out. set labelStyleName to some style selector say: formLabelStyle

then in the css declaration:
.formLabelStyle {

or middle .. or bottom

Anonymous said...

doesnt work :P

Anonymous said...

Works like a charm! I've been searching for hours for this, thank you!

Bionic1251 said...

You should have added
[Style(name="verticalAlign", type="String", enumeration="bottom,middle,top",
before the class