与multilined(自动换行)项目渲染器列表 - 如何滚动到底部? 随着测试案例和屏幕截图(

2019-08-31 08:24发布

在Flex 4 web应用程序,我试图用一个spark.components.List聊了一会(因各种原因-它很适合我已经是一个Flex移动应用程序),而是因为我使用的项目渲染器可以multilined(即包太长线),我有问题,我不能调用它的滚动列表,其底部ensureIndexIsVisible方法:

我已经准备了一个非常简单的测试。 这些都只是2个文件,这将立刻开始工作,当你把它们放到在Flash Builder一个新的Flex项目 -

myApp.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"
    applicationComplete="init()">

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayList;

            private static const MONTHS:ArrayList = new ArrayList([
                "1 January is a beautyful month", 
                "2 February is a very very very very very very very very very very very very very very very beautyful month", 
                "3 March is a beautyful month", 
                "4 April is a beautyful month", 
                "5 May is a beautyful month", 
                "6 June is a beautyful month", 
                "7 July is a beautyful month", 
                "8 August is a beautyful month", 
                "9 September is a beautyful month", 
                "10 October is a beautyful month", 
                "11 November is a beautyful month",
                "12 December is a beautyful month"
            ]);

            private function init():void {
                myList.ensureIndexIsVisible(MONTHS.length - 1); 
            }
        ]]>

    </fx:Script>

    <s:List id="myList"
            horizontalCenter="0"
            verticalCenter="0"
            width="100"
            height="300"
            dataProvider="{MONTHS}"
            itemRenderer="MyRenderer"
            horizontalScrollPolicy="off">

        <s:layout>
            <s:VerticalLayout variableRowHeight="true" 
                              horizontalAlign="justify"/>
        </s:layout>
    </s:List>
</s:Application>

MyRenderer.mxml:

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    xmlns:s="library://ns.adobe.com/flex/spark"
    autoDrawBackground="false">

    <fx:Script> 
        <![CDATA[    
            [Bindable]
            public var myColor:uint = 0xFFFFFF;

            override public function set data(value:Object):void {
                var label:String = value as String;
                labelDisplay.text = label; 

                if (label.indexOf("June") >= 0)
                    myColor = 0xFFEEEE;
                else if (label.indexOf("July") >= 0)
                    myColor = 0xEEFFEE;
                else if (label.indexOf("August") >= 0)
                    myColor = 0xEEEEFF;
                else 
                    myColor = 0xFFFFFF;
            } 
        ]]> 
    </fx:Script>

    <s:Rect width="100%" height="100%">
        <s:fill>
            <s:SolidColor color="{myColor}" />
        </s:fill>
    </s:Rect>

    <s:Label id="labelDisplay" 
             width="100%"
             left="4" 
             top="4" />
</s:ItemRenderer>

请看看,并告诉我,如何滚动列表以它的最底部。

我应该以某种方式使用myList.dataGroup是什么? 或者,也许layout.verticalScrollPosition

我也尝试callLater(myList.ensureIndexIsVisible, [MONTHS.length - 1])但没有帮助。

Answer 1:

找到自己的答案在Flexponential博客滚动到火花列表的底部 :

    public static function scrollToBottom(list:List):void {
        // update the verticalScrollPosition to the end of the List
        // virtual layout may require us to validate a few times
        var delta:Number = 0;
        var count:int = 0;

        while (count++ < 10) {
            list.validateNow();
            delta = list.layout.getVerticalScrollPositionDelta(NavigationUnit.END);
            list.layout.verticalScrollPosition += delta;

            if (delta == 0)
                break;
        }
    }           


文章来源: List with multilined (word wrapping) item renderer - how to scroll to the bottom? With test case and screenshots