Search code examples
javascriptenyo

Make enyo.canvas fit


I have this fiddle: http://jsfiddle.net/y9mhE/3/

Now I want to make the canvas control fit the parent div. Since it inherits enyo.control I should be able to use the 'fit' property, but that does not seem to work.

is this a bug, or am I missing something

( http://enyojs.com/api/#enyo.Canvas )

The canvas control has a width and height property (default 500), maybe this overrides the fit property?

I must include code here, so:

enyo.kind({
    name: "App",
    kind: enyo.Control,
    fit: true,
    components: [
    {
        kind:enyo.Canvas,
        name:"canvas",
        fit:true

    }
    ]
});​

Solution

  • The fit property does not belong to the enyo.Control kind, it can only be used inside a fittable kind. So change your apps kind to "FittableColumns" or "FittableRows" (or set layoutKind of "FittableColumnsLayout" or "FittableRowsLayout"), like this:

    enyo.kind({
        name: 'App',
        kind: 'FittableColumns',
        /* or:
        kind: enyo.Control,
        layoutKind: 'FittableColumnsLayout', */
        components: [
            {
                name: 'canvas',
                kind: enyo.Canvas,
                fit: true // works now because of parents fittable layout
            }
        ]
    });
    

    I updated your fiddle: http://jsfiddle.net/y9mhE/7/