在 Famo.us JS 中结合 GridLayout 和 ScrollView答案

【问题标题】：Combine GridLayout and ScrollView in Famo.us JS在 Famo.us JS 中结合 GridLayout 和 ScrollView
【发布时间】：2014-12-17 23:49:03
【问题描述】：

我正在尝试将网格布局插入到 famo.us 的滚动视图中（使用带角度的 famo.us），最明显的方法是工作

<fa-view>
    <fa-scroll-view fa-pipe-from="eventHandler" fa-options="scrollView">
        <fa-modifier fa-size="[undefined, 3000]">
            <fa-grid-layout fa-options="results.options">
                <fa-modifier ng-repeat="grid in results.grids" fa-size="[undefined, results.rowHeight]">
                    <fa-surface class="item" fa-background-color="'grey'" fa-pipe-to="eventHandler">
                        <h5>{{grid.content.cleanTitle}}</h5>
                    </fa-surface>
                </fa-modifier>
            </fa-grid-layout>
        </fa-modifier>
    </fa-scroll-view>
</fa-view>

但我想知道这是否真的很聪明。它实际上只有一个视图（网格布局），而不是将许多视图推送到滚动视图。我可以想象，famo.us 的家伙实施了一些关于滚动的性能黑客，我担心，一个单一的网格布局不是正确的选择。有没有更好的办法？也许为每个“行”创建一个视图并按视图排列项目？

谢谢！

【问题讨论】：

标签： javascript angularjs famo.us

【解决方案1】：

使用 vanilla famo.us 时，您可以使用支持 CollectionLayout 的 FlexScrollView 轻松做到这一点：

var scrollView = new FlexScrollView({ layout: CollectionLayout, layoutOptions: { itemSize: [200, 200] } });

文档：

https://github.com/IjzerenHein/famous-flex/blob/master/tutorials/FlexScrollView.md https://github.com/IjzerenHein/famous-flex

【讨论】：

【解决方案2】：

我认为这种方法没有任何反对意见。我目前有一个带有一个网格布局的水平滚动视图，它工作得很好。在内部使用带有网格视图的多个视图只会导致网格视图的过载。

【讨论】：