在使用鼠标滚轮与鼠标点击滚动后在星火列表Tilelayout滚动间隔超大星火、鼠标、间隔、滚轮

2023-09-08 15:28:14 作者：我们终究还是陌生了

我有一个火花列表项渲染器和一个瓷砖布局。如果我滚动通过用鼠标点击滚动条上，并试图与滚动后的鼠标滚轮，有一个问题：

I have a spark List with an item renderer and a tile layout. If I scroll by clicking with the mouse on the scroll bar and trying to scroll with the mouse wheel after that, there is a problem:

滚动的间隔，而不是滚动一个项目向下（或向上）列表滚动4项下降（或上升）过大。

The interval of the scrolling is oversized, instead of scrolling one item down (or up) the List scrolls 4 items down (or up).

<s:List
    dataProvider="{myDataProvider}"
    itemRenderer="MyRenderer"
    left="11" right="11"
    bottom="3" top="10"
    useVirtualLayout="false"
    >
        <s:layout>
            <s:TileLayout
                columnAlign="justifyUsingWidth"
                rowAlign="justifyUsingGap"
                orientation="rows"
                rowHeight="180"
                columnWidth="220"
                clipAndEnableScrolling="true"
                />
        </s:layout>
    </s:List>

的rowHeight = 180和columnWidth = 220是我的渲染器的尺寸。

rowHeight = 180 and columnWidth = 220 are the dimension of my renderer.

任何提示什么是错的或我怎么能解决这个问题？

Any hints what's wrong or how I could solve this problem?

更新：这是一个小例子：

主要应用：

<?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(event)">
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;

            [Bindable] public var items:ArrayCollection;

            protected function init(event:FlexEvent):void{
                items = new ArrayCollection();
                for(var i:int = 0; i<200; i++){
                    var obj:Object = new Object();
                    obj.name = "Item "+i;
                    items.addItem(obj);
                }
            }

                    protected function list1_mouseWheelHandler(event:MouseEvent):void{
                trace("delta ="+event.delta);
            }
        ]]>
    </fx:Script>
    <s:Group width="50%"
             height="50%">
        <s:List
            dataProvider="{items}"
            left="5" right="5"
            top="5" bottom="5"
            itemRenderer="MyRenderer"
            allowMultipleSelection="false"
            useVirtualLayout="false"
            mouseWheel="list1_mouseWheelHandler(event)"
            >
            <s:layout>
                <s:TileLayout
                    columnAlign="justifyUsingWidth"
                    rowAlign="justifyUsingGap"
                    orientation="rows"
                    rowHeight="180"
                    columnWidth="220"
                    clipAndEnableScrolling="true"
                    />
            </s:layout>
        </s:List>
    </s:Group>

和渲染：

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" 
                xmlns:spareparts="de.rotex.spareparts.*"
                width="220" height="180">

    <s:BorderContainer borderColor="#FFF9DE" >      
        <s:Label horizontalCenter="0" verticalCenter="0"
                 text="{data.name}" />
    </s:BorderContainer>
</s:ItemRenderer>

如果您现在尝试滚动，你会发现（有一个滚动），你会看到项目6和7的顶部（在Windows行滚动属性设置为3，这是正常的话）。但是，如果你现在点击滚动条上，再滚动（从顶部），你会发现项目12和13是在顶部。没有项目6和7的前...

If you now try to scroll you will notice that (with one scroll) you would see Item 6 and 7 at the top (setting the line-scroll property in windows to 3, which is alright then). But If you now click on the scroll bar and scroll again (from the top) you will see that Item 12 and 13 are at the top. Not Item 6 and 7 as before...

在使用鼠标滚轮与鼠标点击滚动后在星火列表Tilelayout滚动间隔超大星火、鼠标、间隔、滚轮

推荐答案