0

Given a simple example:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
    <![CDATA[
        import com.example.Tab;

        private function addSecondTab(event:Event):void {
            tabs.addChild(new Tab("Second"));
        }
    ]]>
</mx:Script>
<mx:TabNavigator id="tabs" width="100%" height="100%">
    <mx:VBox horizontalAlign="center" verticalAlign="middle" label="#1">
        <mx:Label text="test"/>
    </mx:VBox>
</mx:TabNavigator>
<mx:Button label="Add Second Tab" click="addSecondTab(event)" />
</mx:Application>


package com.example {
import mx.containers.VBox;
import mx.controls.Label;
import mx.events.FlexEvent;

public class Tab extends VBox {
    public function Tab(name:String) {
        label = name;

        setStyle("horizontal-align", "center");
        setStyle("vertical-align", "middle"); 
    }

    override protected function createChildren():void {
        super.createChildren();

        var box:VBox = new VBox();
        box.setStyle("border-style", "solid");
        box.setStyle("border-thickness", 1);
        box.setStyle("border-color", 0xFF0000);

        var l1:Label = new Label();
        l1.text = "Hello!";
        box.addChild(l1);

        var l2:Label = new Label();
        l2.setStyle("fontWeight", "bold");
        l2.text = "This is a line of text...";
        box.addChild(l2);

        addChild(box);
    }
}
}

Why aren't styles (border and alignment) being applied inside the second tab?

4

1 回答 1

1

Flex only supports hyphenated style names in CSS. So in MXML or Actionscript statements you should use the camel case versions of the style names:

horizontalAlign, verticalAlign, borderStyle, etc.

You can read more about it in Adobe's documentation, in particular this section on CSS selector names.

于 2012-10-03T18:39:14.850 回答