Flex 4.5 - Spark DropDownList - минимальная ширина DropDown - это ширина якоря - PullRequest
Новая
       37

Flex 4.5 - Spark DropDownList - минимальная ширина DropDown - это ширина якоря

2 голосов
/ 29 июля 2011

Я использую spark DropDownLists и не хочу видеть горизонтальные полосы прокрутки в раскрывающемся списке. Я в порядке с выпадающим списком, который шире, чем якорь, поэтому у меня есть собственный скин, который устанавливает popUpWidthMatchesAnchorWidth в false. Но я не хочу, чтобы выпадающий список был меньше якоря. Это моя дилемма.

Я придумал решение, которое иногда работает, но с ним что-то не так. Мой скин DropDownList выглядит следующим образом: 

<?xml version="1.0" encoding="utf-8"?>
<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabled=".5" minHeight="25"> 

    <fx:Metadata>
    <![CDATA[ 
        [HostComponent("spark.components.DropDownList")]
    ]]>
    </fx:Metadata>

    <fx:Script>
        <![CDATA[
            override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
            {
                // anchor width is the min width of the dropdown
                if (dropDown && openButton && popUp && dropDown.getExplicitOrMeasuredWidth() < openButton.getExplicitOrMeasuredWidth())
                    popUp.popUpWidthMatchesAnchorWidth = true;

                super.updateDisplayList(unscaledWidth, unscaledHeight);
            }
        ]]>
    </fx:Script>

    <s:states>
        <s:State name="normal" stateGroups="closed" />
        <s:State name="open" />
        <s:State name="disabled" stateGroups="closed" />
    </s:states>

    <s:PopUpAnchor id="popUp" displayPopUp.normal="false" displayPopUp.open="true" includeIn="open"
        left="0" right="0" top="0" bottom="0" itemDestructionPolicy="auto"
        popUpPosition="below" popUpWidthMatchesAnchorWidth="false">

        <s:Group id="dropDown" maxHeight="134" minHeight="22" >

            <s:RectangularDropShadow id="dropShadow" blurX="20" blurY="20" alpha="0.45" distance="7" 
                 angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/>

            <s:Rect id="border" left="0" right="0" top="0" bottom="0">
                <s:stroke>
                    <s:SolidColorStroke id="borderStroke" weight="1"/>
                </s:stroke>
            </s:Rect>

            <s:Rect id="background" left="1" right="1" top="1" bottom="1" >
                <s:fill>
                    <s:SolidColor color="#222222"/>
                </s:fill>
            </s:Rect>

            <s:Scroller id="scroller" left="0" top="0" right="0" bottom="0" hasFocusableChildren="false" minViewportInset="1">
                <s:DataGroup id="dataGroup" itemRenderer="spark.skins.spark.DefaultItemRenderer">
                    <s:layout>
                        <s:VerticalLayout gap="0" horizontalAlign="contentJustify"/>
                    </s:layout>
                </s:DataGroup> 
            </s:Scroller>
        </s:Group>
    </s:PopUpAnchor>

    <s:Button id="openButton" left="0" right="0" top="0" bottom="0" focusEnabled="false" alpha.disabled="0.5"
        skinClass.closed="assets.skins.dropDownList.dropDownListNormalButtonSkin"
        skinClass.open="assets.skins.dropDownList.dropDownListOpenButtonSkin"/>  

    <s:Label id="labelDisplay" verticalAlign="middle" maxDisplayedLines="1" 
        mouseEnabled="false" mouseChildren="false"
        left="7" right="30" top="2" bottom="2" width="75" verticalCenter="1" /> 

</s:SparkSkin>

Это работает, как и ожидалось, когда содержимое раскрывающегося списка либо шире, чем якорь, либо меньше, чем около 100 пикселей, но если я явно установил ширину в экземпляре DropDownList, равную примерно 200 пикселей, и содержимое раскрывающегося списка шириной около 150 пикселей раскрывающийся список меньше якоря.

По сути, похоже, что openButton.getExplicitOrMeasuredWidth() возвращает около 100, независимо от того, какую ширину DropDownList я установил.

Как я могу изменить это так, чтобы я мог иметь несколько DropDownLists различной ширины, но всегда следя за тем, чтобы ширина раскрывающегося списка была больше или равна ширине якоря?

Ответы [ 2 ]

3 голосов
/ 29 июля 2011

Вы сказали: «но если я явно установлю ширину в экземпляре DropDownList как что-то вроде 200px, а содержимое раскрывающегося списка будет иметь ширину около 150px, раскрывающийся список будет меньше якоря».

Так что если вы явно устанавливаете ширину, this.width всегда надежен.Просто замените button.getExplicitOrMeasuredWidth () на this.width, проблема решена. 

if (dropDown && openButton && popUp && dropDown.getExplicitOrMeasuredWidth() < this.width)
                popUp.popUpWidthMatchesAnchorWidth = true;
2 голосов
/ 29 июля 2011

Я предлагаю вам использовать openButton.width вместо openButton.getExplicitOrMeasuredWidth().

...