прокрутка определенного ребенка на вид

Question

У меня есть следующий код, который прокручивает определенный ребенок. Он отлично работает, за исключением случаев, когда прокручивается до последнего ребенка. Он работает нормально, но это не мое ожидание поведения. ПРОБЛЕМА - это когда прокручивается до последнего ребенка, я хочу, чтобы ребенок показывался в верхней части окна просмотра, как и другие. Некоторые диаграммы должны помочь этому немного лучше, чем слова.

Резюме вопрос:

1.when прокрутки последнего ребенка, можно поместить его в (0,0) в окне?

2. У меня 6 детей, каждый из которых имеет 200 высоты. ContentHeight равно 1200. Когда значение verticalScrollPosition равно 0, я вызываю viewport.getVerticalScrollPositionDelta (NavigationUnit.END), возвращаемое значение равно 900. Так как рассчитывается 900?

Ниже приведен код:

<?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 components.MockUI; 

      import mx.collections.ArrayList; 

      import spark.core.NavigationUnit; 

      private function init():void { 
       createElements(); 
      } 

      private function createElements():void { 
       for (var i:int = 0; i<6; i++) { 
        var ui:MockUI = new MockUI(); 
        ui.text = "I'm " + i + " !"; 
        ui.width = 300; 
        ui.height = 200; 
        viewport.addElement(ui); 
       } 
      } 

      //scroll to diffrent child, take attetion to the scrollRect 
      private function scrollToChild(index:int):void { 
       var delta:Number = returnSumHeight(index); 
       viewport.verticalScrollPosition = delta; 
       var scrollRect:Rectangle = viewport.scrollRect; 
       trace("viewport contentHeight: ", viewport.contentHeight); 
       trace("vp: ", viewport.verticalScrollPosition); 
       trace("scrollRect: ", scrollRect); 
      } 

      private function handleScroll(unit:uint):void { 
       trace("unit: ", unit); 
       var delta:Number = viewport.getVerticalScrollPositionDelta(unit); 
       trace("delta:", delta); 
      } 

      private function minus():void { 
       viewport.verticalScrollPosition -= 10; 
       trace("vp: ", viewport.verticalScrollPosition); 
      } 

      //return the sum height of children before index item 
      private function returnSumHeight(index:int):Number { 
       var sumHeight:Number = 0; 
       for(var i:int=0; i<index; i++) { 
        sumHeight += viewport.getElementAt(i).height; 
       } 
       return sumHeight; 
      } 
     ]]> 
    </fx:Script> 
    <s:layout> 
     <s:VerticalLayout horizontalAlign="center" paddingTop="100"/> 
    </s:layout> 
    <s:HGroup> 
     <s:Label text="Select Child: "/> 
     <s:ComboBox id="comboBox" 
        dataProvider="{new ArrayList([0,1,2,3,4,5])}" 
        selectedIndex="0" 
        change="scrollToChild(comboBox.selectedIndex)"/> 
    </s:HGroup> 
    <s:Scroller> 
     <s:VGroup id="viewport" width="350" height="300" gap="0"> 
     </s:VGroup> 
    </s:Scroller> 
    <s:Button label="MINUS" click="minus()"/> 
    <s:Button label="UP" click="handleScroll(NavigationUnit.UP)"/> 
    <s:Button label="DOWN" click="handleScroll(NavigationUnit.DOWN)"/> 
    <s:Button label="HOME" click="handleScroll(NavigationUnit.HOME)"/> 
    <s:Button label="END" click="handleScroll(NavigationUnit.END)"/> 
</s:Application> 

MOCKUI:

package components { 
    public class MockUI extends UIComponent { 
     private var label:Label; 

     private var _text:String; 
     private var textChanged:Boolean = false; 

     public function set text(value:String):void { 
      if(value == _text) { 
       return; 
      } 

      _text = value; 
      textChanged = true; 
      invalidateProperties(); 
     } 

     public function get text():String { 
      return _text; 
     } 

     override protected function createChildren():void { 
      super.createChildren(); 

      label = new Label(); 
      addChild(label); 
     } 

     override protected function commitProperties():void { 
      super.commitProperties(); 

      if(textChanged) { 
       textChanged = false; 
       label.text = _text; 
      } 
     } 


     override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void { 
      super.updateDisplayList(unscaledWidth, unscaledHeight); 

      label.width = unscaledWidth/2.0; 
      label.height = unscaledHeight/2.0; 
      label.x = unscaledWidth/2.0; 
      label.y = unscaledHeight/2.0; 

      graphics.clear(); 
      graphics.lineStyle(2, 0xffff00); 
      graphics.drawRect(0, 0, unscaledWidth, unscaledHeight); 
      graphics.beginFill(0xff0000, 1); 
      graphics.drawRect(0,0,unscaledWidth, unscaledHeight); 
      graphics.endFill(); 
     } 
    } 
} 

Answer 1

Когда прокрутка последнего ребенка, можно расположить его в точке (0, 0) в окне просмотра?

Нет, это невозможно с кодом по умолчанию в Flex SDK и из-за размера вашего видового экрана/элементов. Единственный способ сделать это с кодом по умолчанию - сделать ваш видоискатель равным размеру одного элемента (и все элементы имеют одинаковую высоту).

Scroller не позволит вам прокручивать содержимое конца (за исключением эффекта в мобильных приложениях). Вы можете расширить класс Scroller, чтобы это разрешить.

У меня есть 6 детей, каждый из которых имеет 200 высот. ContentHeight равно 1200. Когда verticalScrollPosition равно 0, я вызываю viewport.getVerticalScrollPositionDelta (NavigationUnit.END), возвращаемое значение равно 900. Так как рассчитывается 900?

Высота каждого ребенка составляет 200, но высота контейнера, они находятся в 300 пикселей. Поскольку скроллер не позволяет прокручивать содержимое конца содержимого, он ограничивает максимальное значение положения прокрутки до: contentHeight - viewportHeight (1200 - 300 = 900).

Подумайте о том, что область просмотра является чем-то, что перемещается (в данном случае) по вертикали над содержимым. Контент составляет 1200 пикселей, но, поскольку область просмотра составляет 300 пикселей, нам никогда не нужно устанавливать Y-позицию окна просмотра выше 900 пикселей, чтобы увидеть конец содержимого.