Famo.us scrollview altezza

Question

Sto cercando di aggiungere un'immagine sotto uno scorrimento utilizzando il famoso sequenzialeLayout e sto avendo un problema con l'altezza di scorrimento.

È così che creo il mio scrollview.

var scrollview = new Scrollview({       
    direction: Utility.Direction.X,
    options: {
        size: [300, 300]
    },        
    paginated: true
});

.

Quando aggiungo superfici alla scrollView con 250 altezza, il contenitore genitore del genitore di ScrollView (famoso gruppo) contenente queste superfici ha una larghezza e un'altezza di 0.

Quando si aggiunge questo scrollView all'interno di un sequenzialeLayout come primo elemento, il secondo elemento o superficie con un'altezza viene visualizzata in cima a questo scrollView poiché non ha altezza.

Qualche idea come risolvere questo utilizzo utilizzando Famo.US?

Answer 1

Non è possibile impostare la dimensione del genere: utilizzare un modificatore per questo.

Questo sarà l'albero di rendering

MainContext
   SequentialLayout
      Modifier(size)
          ScrollView
      Modifier(size)
          Image

.

Codice Snippet:

// 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]);

.

ed ecco un ESEMPIO GIST (copia-incolla il main.js dopo l'esecuzione del generatore yo famous)