flex - metodología - ¿Cómo asegurarse de que la ventana emergente siempre se muestra arriba del PopUpButton? Con el caso de prueba y la captura de pantalla

tdd wikipedia

Question

Pocos usuarios de mi aplicación web Flex 4.6 se están quejando, el mx.controls.PopUpButton en la esquina inferior derecha a veces abre una lista debajo y por lo tanto no se puede usar (no puedo reproducirlo yo mismo, probablemente una mala combinación de sus Configuración de Flash Player y / o tamaño de fuente?)

¿Cómo puedo asegurarme de que el componente popUp (en mi caso es un spark.components.List) siempre abre por encima del PopUpButton?

Sospecho que debería crear un skin basado en mx.skins.halo.PopUpButtonSkin y asignarlo a mi PopUpButton? ¿Y probablemente debería usar la constante PopUpPosition.ABOVE junto con PopUpAnchor?

Pero no estoy seguro de cómo armarlo. ¿Alguien puede compartir algunas instrucciones?

He preparado una captura de pantalla y un simple Text.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    xmlns:mx="library://ns.adobe.com/flex/mx"
    creationComplete="init()">

    <fx:Script>
        <![CDATA[
            import mx.events.FlexEvent;
            import mx.collections.ArrayCollection;
            import spark.components.List;

            [Bindable]
            private var _data:ArrayCollection = new ArrayCollection();

            [Bindable]
            private var _list:List = new List();

            public function init():void {
                _data.addItem({label: "One"});
                _data.addItem({label: "Tow"});
                _data.addItem({label: "Three"});
                _data.addItem({label: "Four"});
                _data.addItem({label: "Five"});

                _list.dataProvider = _data;
                _list.setStyle(''fontSize'', 36);
            }
        ]]>
    </fx:Script>

    <mx:PopUpButton right="10" bottom="10" fontSize="24" popUp="{_list}"/>
</s:Application>

ACTUALIZAR:

He encontrado una solución de Simon Bailey MX ComboBox Error de dirección abierta - Solución alternativa y funciona, pero desafortunadamente no me permite enviar mi evento personalizado cuando se hace clic en el botón principal (no en la flecha).

También he observado el código fuente PopUpButton.as y me pregunto si tal vez la altura de la lista es 0 mientras se está marcando allí:

private function displayPopUp(show:Boolean):void
{
    ......
    // XXX I suspect the _popUp.height below is 0
    // XXX for the users having the trouble

    if (show)
    {          
       if (point.y + _popUp.height > screen.bottom && 
            point.y > (screen.top + height + _popUp.height))
        { 
            // PopUp will go below the bottom of the stage
            // and be clipped. Instead, have it grow up.
            point.y -= (unscaledHeight + _popUp.height + 2*popUpGap);
            initY = -_popUp.height;
        }

Todavía no puedo reproducir el error, mis usuarios no son muy útiles (en su mayoría personas mayores, jugando a mi juego de cartas ). He buscado en Adobe JIRA , pero no he podido encontrar ese error.

Me pregunto, si hay una manera de cortocircuitar ese método para forzar la apertura de la ventana emergente sobre PopUpButton.

O si debería poner la _list en algún contenedor ...

Answer 1

PopUpButton no usa un PopUpAnchor . Establece la posición de la displayPopUp() emergente internamente en la función privada llamada displayPopUp() .

¿Por qué no usar Spark DropDownList lugar? ¿No es eso lo que has creado efectivamente aquí?