ScrollView and Image (see http://stackoverflow.com/questions/23057349/famo-us-scrollview-height)

main.js

/*globals define*/
define(function(require) {
    'use strict';
    // import dependencies
    var Engine = require('famous/core/Engine');
    var Surface = require('famous/core/Surface');
    var ScrollView = require('famous/views/ScrollView');
    var ImageSurface = require('famous/surfaces/ImageSurface');
    var StateModifier = require('famous/modifiers/StateModifier');
    var RenderNode = require('famous/core/RenderNode');
    var SequentialLayout = require('famous/views/SequentialLayout');

    // create the main context
    var mainContext = Engine.createContext();

    // Create components
    var scrollview = new ScrollView();
    var image = new ImageSurface({
        content: 'content/images/famous_symbol_transparent.png'
    });

    // Create Size Modifiers
    var scrollModifier = new StateModifier({ size: [200,200]});
    var imageModifier = new StateModifier({ size: [200,200]});

    // Wrap the Modifier in a RenderNode, so we can add the surface
    // (you can't add surfaces directly to a modifier)
    var scrollNode = new RenderNode(scrollModifier);
    scrollNode.add(scrollview);

    var imageNode = new RenderNode(imageModifier);
    imageNode.add(image);

    // Create a SequentialLayout
    var sequence = new SequentialLayout();
    sequence.sequenceFrom([scrollNode,imageNode]);

    mainContext.add(sequence);

    // Populate scrollview
    var surfaces = [];
    scrollview.sequenceFrom(surfaces);
    for (var i = 0, temp; i < 20; i++) {
        temp = new Surface({
             content: 'Surface: ' + (i + 1),
             size: [undefined, 40],
             properties: {
                 backgroundColor: 'hsl(' + (i * 360 / 20) + ', 100%, 50%)',
                 lineHeight: '40px',
                 textAlign: 'center'
             }
        });
        temp.pipe(scrollview);
        surfaces.push(temp);
    }

});