IjzerenHein / famous-flex

Animatable layouts, FlexScrollView & widgets for famo.us.
MIT License
279 stars 44 forks source link

Use famous-sizeconstraint with FlexScrollView #131

Open nightshadecf opened 8 years ago

nightshadecf commented 8 years ago

This specific code does apply the constraint, however scrollview doesn't flow items correctly, all items are laid out on top like the position of the first. I'm using a default FlexScrollView with listlayout. Any idea on how to implement this correctly? (I tried to wrap sizeconstraint in a RenderNode but it doesn't work either)

var scrollView = new FlexScrollView({
        autoPipeEvents: true,
        useContainer: true,
        flow: true
});
function _createSection(i) {
        var section = new Surface({
            size: [undefined, true],
            content: "Panel " + i,
            properties: {
                color: "hsl(" + ("" + i) + ", 50%, 70%)",
                fontSize: Math.round(0.5 * height) + "px",
                backgroundColor: "hsla(" + ("" + i) + ", 50%, 50%, 0.8)",
                'white-space': 'nowrap',
            }
        });
        section.pipe(scrollView);
        var sizeConstraint = new SizeConstraint({
            scale: [0.5, undefined]
        });
        sizeConstraint.add(section);
        return sizeConstraint;
}
for (var i = 0; i < 100; i++) {
    var section = _createSection(i);
    scrollView.push(section);
}

Screen shot here: screen shot 2016-04-18 at 12 52 35 am