Responsive Sizing

Let’s answer one of the most commonly raised questions — and sources of confusion — about Famo.us: how to size elements with respect to the size of the parent context.

SizeAwareView

ContextualView

Famo.us provides a special widget called ContextualView that takes care of most of this setup for you, offering a more convenient way to achieve parent-aware sizing. When subclassing a ContextualView, you only need to override the .commit() method. ContextualView will take care of registering the entity, returning an ID from .render(), etc. For example:

var ContextualView = famous.views.ContextualView;

function MyWidget() {
  ContextualView.apply(this, arguments);
}

MyWidget.prototype = Object.create(ContextualView.prototype);
MyWidget.prototype.constructor = MyWidget;

MyWidget.prototype.commit = function(parent) {
  // Implement size-aware behavior here
};

Next: Views »