actionscript 3 - FLEX 4 s: ¿Scroller, cómo traer componentes contenidos a la vista?

actionscript-3 flex4

Question

Tengo muchas entradas de texto para niños dentro de un Scroller de chispa. ¿Cómo puedo hacer que TextInput con id de "x" entre en foco si tengo a ...z id, también para que la barra de desplazamiento se desplace automáticamente a ese elemento secundario?

Puedo usar x.setFocus (), pero la barra de desplazamiento no se desplaza automáticamente a ese elemento? ¿por qué?

<s:Scroller id="scroller" width="100%" height="100">
        <s:Group id="group" width="100%" height="100" id="content">
            <s:TextInput id="a" text="" editable="true" width="100%" height="25" />
            <s:TextInput id="b" text="" editable="true" width="100%" height="25" />
            ....
        </s:Group>
</s:Scroller>

Gracias, Philip

Answer 1

El método getScrollPositionDeltaToElement no tiene en cuenta los elementos secundarios anidados. Para eso puedes usar el método mx_internal como se muestra a continuación:

/**
* Focus in handler to be used on form elements inside a Scroller. If the 
* widgets are inside a FormItem, this ensures that the entire FormItem is 
* scrolled into view. Also, if there are validations triggered on focusOut
* of the elements, the default behavior in Flex 4 is to display the error 
* messages at the top of the form. Because this affects the vertical position
* of each element, the logic to scroll the item into view must be delayed 
* until the next frame using callLater()
*
* NOTE: This uses a method, in the mx_internal namespace 
*/
    protected function widgetFocusInHandler(evt:FocusEvent):void {
        //we need to delay this because we may need to account 
        //for validation errors being display above the form.
        callLater(function(field:UIComponent) : void {
            //find the form item that wraps the input and scroll 
            //it into view

            var formItem:DisplayObjectContainer = field.parent;
            while (!(formItem is FormItem) && formItem) {
                 formItem = formItem.parent;
            }

            //if this item wasn''t in a form item, then just use the 
            //widget itself
            if (!formItem) {
                formItem = field;   
            }

            var pt:Point = formItem.localToGlobal(new Point(0, formItem.height));

            pt = scrollWrapper.globalToLocal(pt);
            var layout:LayoutBase = scrollWrapper.layout;           
            var delta:Point = layout.mx_internal::getScrollPositionDeltaToAnyElement(field);
            if (delta) {
                if(delta.y > 0) {
                    layout.verticalScrollPosition += delta.y + 20;
                } else if (delta.y < 0) {
                    layout.verticalScrollPosition += delta.y - 20;
                }
            }

        }, [UIComponent(evt.currentTarget)]);
   }

Answer 2

La razón es que setFocus simplemente hace que el objeto se active, en realidad no se mueve, cambia la posición de desplazamiento de la barra de desplazamiento. Con clases más complejas como una lista, es más sencillo pero Scroller es bastante básico, por lo que es un poco más difícil.

Para hacer lo que desea, debe obtener el índice del elemento dentro de su ventana gráfica (su grupo) y luego establecer manualmente la posición de desplazamiento. Para un diseño vertical, el código se vería así:

var index:Number = group.getElementIndex(g);
var offset:Number = group.getElementAt(index).height;
scroller.viewport.verticalScrollPosition = index * offset;

Donde ''g'' es la identificación del elemento al que desea mover en su Scroller.

= Ryan [email protected]

Answer 3

Solo echa un vistazo al Flex SDK, aquí hay un método spark.components.List, solo usa el mismo código para tu DataGroup:

public function ensureIndexIsVisible(index:int):void
{
    if (!layout)
        return;

    var spDelta:Point = dataGroup.layout.getScrollPositionDeltaToElement(index);

    if (spDelta)
    {
        dataGroup.horizontalScrollPosition += spDelta.x;
        dataGroup.verticalScrollPosition += spDelta.y;
    }
}

Answer 4

un par de consideraciones adicionales:

1. Los ítems de mi grupo de datos no tienen una altura constante, así que, si ese fuera el caso, una referencia más precisa para establecer el desplazamiento sería:

   var y: int = group.getElementAt (index) .y; scroller.viewport.verticalScrollPosition = y;

2. Asegúrese de que su grupo de datos no esté configurado para usar la virtualización. El mío fue y obtuve errores ya que los elementos se agregaron / eliminaron en tiempo de ejecución.