actionscript-3 - 選択できないセパレーターを含むコンボボックスを作成する

Question

コンボボックスをカスタムしたい。実際、私はそのような行で区切られた 2 つの配列を持つコンボックスを作成するのが好きです。

すべてと 40 以上の間の線は選択できません。

その方法を知っていますか？

助けてくれてありがとう

Answer 1

次のようなモデルを持つ ComboBox があるとします。

<s:ComboBox>
    <s:ArrayList>
        <fx:String>A</fx:String>
        <fx:Object />
        <fx:String>B</fx:String>
    </s:ArrayList>
</s:ComboBox>

Strings は通常の要素で、Object はセパレーターを表します。ここでは単純化していますが、これを特定の状況に翻訳できるはずです。

ここで、各タイプの要素に異なる ItemRenderer を割り当てたいと考えています。プロパティを使用してこれを行うことができitemRendererFunctionます。

<s:ComboBox itemRendererFunction="getItemRenderer">

private function getItemRenderer(item:*):IFactory {
    var renderer:Class = item is String ? DefaultItemRenderer : SeparatorItemRenderer
    return new ClassFactory(renderer);
}

SeparatorItemRenderer次に、水平線のみを含むものを作成し、そのenabledプロパティを に設定しfalseます。この最後の部分は、項目を選択できなくするので非常に重要です。

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                autoDrawBackground="false" enabled="false"
                height="10" disabledAlpha="1">

    <s:Line left="0" right="0" verticalCenter="0">
        <s:stroke>
            <s:SolidColorStroke color="0xdddddd" />
        </s:stroke>
    </s:Line>

</s:ItemRenderer>

そして、それはそれを行う必要があります。

Answer 2

あなたの助けを借りて、私は解決策を見つけました：

<?xml version="1.0" encoding="utf-8"?>

<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" 
                autoDrawBackground="{(data.separator==0)?true:false}"
                disabledAlpha="1"
                enabled="{(data.separator==0)?true:false}"
                mouseEnabled="{(data.separator==0)?true:false}"
                >

    <fx:Script>
        <![CDATA[
            import spark.components.supportClasses.ListBase;

        ]]>
    </fx:Script>
    <s:states>
        <s:State name="normal"/>
        <s:State name="down"/>
        <s:State name="hovered"/>
        <s:State name="selected"/>
        <s:State name="dragging"/>
        <s:State name="normalAndShowCaret"/>
        <s:State name="hoveredAndShowCaret"/>
        <s:State name="selectedAndShowCaret"/>
    </s:states>




    <s:Group top="2" left="2" right="2" bottom="2" width="100%" height="100%" >
        <s:Line width="100%" bottom="2" visible="{(data.separator==1)?true:false}" verticalCenter="0" >
            <s:stroke>
                <s:SolidColorStroke weight="2" caps="round"/>
            </s:stroke>
        </s:Line>

        <s:Label id="labelDisplay" verticalCenter="1" horizontalCenter="0" fontWeight="normal" color="#000000"
                 visible="{(data.separator==0)?true:false}" />
    </s:Group>

</s:ItemRenderer>

どうもありがとう

Answer 3

誰かがそれを必要とする場合に備えて、Flex なしで Flash で動作するソリューションを次に示します (私のように)。最初に、CellRenderer のカスタム拡張用の新しいクラス ファイルを作成します。

package { 
    import fl.controls.listClasses.CellRenderer; 
    public class MyCustomCellRenderer extends CellRenderer
    {
        // override the data setter to set the enabled flag
        override public function set data(value:Object):void
        {
            super.data = value;    
            this.enabled = !(value['disabled']);
        }
    } 
}

これを MyCustomCellRenderer.as (または任意の名前) として保存し、ComboBox を設定するときに次のようにします。

myComboBox.dropdown.setStyle("cellRenderer", MyCustomCellRenderer); 
myComboBox.dataProvider = new DataProvider();
myComboBox.dataProvider.addItem({label: "Normal Item"});
myComboBox.dataProvider.addItem({label: "Separator", disabled:true});