actionscript-3 - 在as3中创建自定义图块列表

我需要创建一个类似于下图的图块列表。它包含在图块列表末尾的按钮，并且应该在滚动条内。我尝试扩展现有的TileList时没有运气。

样例代码

public class CustomTileList extends TileList {

        public function CustomTileList()
        {
            super();

        }

        protected var _button : Button ;

        public function get button ( ) : Button {
            return this._button ;
        }

        public function set button ( value : Button ) : void {
            this._button = value;
        }

        override protected function createChildren():void
        {
            super.createChildren();
            _button = new Button ();
            _button .label = "More";

            this.addChildAt( _button , super.numChildren - 1 );

        }

    }

最佳答案

在遵循Christophe Herreman的方法时，如果需要在Flex 3中实现此目的，则必须使用Canvas作为容器并设置正确的滚动策略。见下面的例子

<mx:Canvas horizontalScrollPolicy="off" verticalScrollPolicy="auto" height="300">
    <mx:TileList id="tileList" horizontalScrollPolicy="off" verticalScrollPolicy="off" columnCount="2">
        <mx:itemRenderer>
            <mx:Component>
                <mx:VBox width="100" height="100" verticalAlign="middle" horizontalAlign="center">
                    <mx:Label text="{data}" />
                </mx:VBox>
            </mx:Component>
        </mx:itemRenderer>
        <mx:dataProvider>
            <mx:ArrayCollection>
                <mx:String>Tile 1</mx:String>
                <mx:String>Tile 2</mx:String>
                <mx:String>Tile 3</mx:String>
                <mx:String>Tile 4</mx:String>
                <mx:String>Tile 5</mx:String>
                <mx:String>Tile 6</mx:String>
                <mx:String>Tile 7</mx:String>
                <mx:String>Tile 8</mx:String>
            </mx:ArrayCollection>
        </mx:dataProvider>
    </mx:TileList>
    <mx:Button id="button" label="Button" />
</mx:Canvas>

由于以下原因，这是不够的

tileList必须缩放到所有项目的高度，以便所有项目都可见。

Canvas将对象放置在绝对位置，因此您需要正确放置button。

考虑到容器可以扩展的事实以及tileList可能包含更多项的事实，可以在updateDisplayList函数中完成这些更改，如下所示。

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

    tileList.height = tileList.rowHeight * Math.ceil( tileList.dataProvider.length / tileList.columnCount );
    button.y = tileList.height;
    button.x = (tileList.width / 2) - (button.width / 2);
}

关于actionscript-3 - 在as3中创建自定义图块列表，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18139657/