flex多列火花列表

Question

I have a list and I would like to move horizontally in a specific number of pixels. It would be a list that will display the first 3 items, but when you scroll, only would move one at a time.

This is my code:

<s:List id="list_recipes" width="100%" 
            pageScrollingEnabled="true" change="list_recipes_changeHandler(event)"
            verticalScrollPolicy="off" horizontalScrollPolicy="on" skinClass="skins.PagedListSkin"  contentBackgroundAlpha="0" itemRenderer="renderer.ItemRecipe">
        <s:layout>
            <s:TileLayout id="layout_recipe" columnWidth="200" useVirtualLayout=""
                          requestedRowCount="1" requestedColumnCount="-1" rowHeight="260"
                          horizontalGap="0" verticalGap="0" />

        </s:layout>
    </s:List>

Thank You

Answer 1

In the mousewheel event of the list you can set the delta which will move the list as per your requirement.

protected function list_recipes_mouseWheelHandler(event:MouseEvent):void
        {
            event.delta *= 10; 
            //It will multiply the delta 10 times
                            //you can use + for addition in place of *
                            //adjust the value that will suite your requirement

        }