如何在运行时更改组合框的样式属性 - textInputStyleName?

时间:2011-03-18 12:02:37

标签: flex actionscript-3 flex3

我有一个提示字符串显示在我的组合框中 - 这需要显示在斜体中。当用户从列表中进行任何选择时 - 我需要更改显示内容的样式。

我的css文件:

.promptStyle
{
    fontStyle: italic;
}
ComboBox.withPrompt
{
    color: #FF0000;
    fontWeight: normal;
    textInputStyleName: promptStyle;
}
.regularStyle
{
    fontStyle: normal;
}
ComboBox.withoutPrompt
{
    color: black;
    fontWeight: normal;
    textInputStyleName: regularStyle;
}

我的MXML文件:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" 
            minWidth="955" minHeight="600" initialize="init()">

<mx:Script>
    <![CDATA[
        [Bindable]
        private var content:Array=new Array("Red", "Blue", "Green");

        private function init():void {
            StyleManager.loadStyleDeclarations("combos/combo_style.swf");
        }

        private function changeStyle():void {
            var index:int = promptBox.selectedIndex;
            if(index != -1)
                promptBox.setStyle("styleName","withoutPrompt");
        }
    ]]>
</mx:Script>

<mx:ComboBox id="promptBox" prompt="Select a color" dataProvider="{content}"
        styleName="withPrompt" change="changeStyle()"/>
</mx:Application>

我能够看到风格发生变化,因为颜色会发生变化;但是不会应用特定于textInputStyleName的更改。任何帮助将不胜感激。

2 个答案:

答案 0 :(得分:1)

您应该将样式分配给内部TextInput子组件,但为此您必须派生自己的PromptingComboBox来访问受保护的textInput属性。

我认为下面的课程基本上是你想要的,应该给你一个想法:

public class PromptingComboBox extends ComboBox implements IFactory
{
    private var _dropDown: List = null;

    public function PromptingComboBox()
    {
        super.dropdownFactory = this;
    }

    public function newInstance(): *
    {
        _dropDown = new List();
        _dropDown.addEventListener(ListEvent.CHANGE, onChangeDropDownList);
        return _dropDown;
    }

    override protected function createChildren():void
    {
        super.createChildren();
        this.textInput.setStyle("fontStyle", "italic");
    }

    private function onChangeDropDownList(event: Event): void
    {
        this.textInput.setStyle("fontStyle", "");
    }
}

答案 1 :(得分:0)

谢谢:)我能够按照您的建议通过对ComboBox进行子类化来使其工作。在我的css中更新textInputStyleName对我来说是一个更清洁的解决方案,因为这是一个庞大的现有应用程序,现在我必须进入几个MXML并更改控件以使用自定义控件 - 我猜这是flex中的错误?

无论如何,谢谢你的帮助!