Views

LudoJS Views

A View in LudoJS is a Javascript prototype.

A view can render anything from simple HTML, to more complex things like grids and charts.

Since the View is a prototype, you can have many instances of a view on screen simultaneously.

Example:

var viewA = new ludo.Window({
    title: 'View a', layout: { left:20,top:20,width:200,height:200}
});

var viewB = new ludo.Window({
    title: 'View b', layout: { left:50,top:50,width:200,height:200}
});

Creates two instances of the ludo.Window view.

Extendable

A view can be extended to make your own view classes:

Example:

myApp.View = new Class({
    Extends: ludo.View
})

Composite Views

A Composite View is a view with child views.

Example: A View with two child views.

myApp.View = new Class({
    Extends: ludo.View,
    layout:{
        type:'linear', orientation:'vertical'
    },
    children:[
        {
            type:'View', layout:{ weight:1}, html: 'View'
        },
        {
            type:'form.Text', layout: {height: 'wrap' }
        }

    ]
})

When working with LudoJS, you will in most cases create your own composite view classes, example: user registration forms, your own charts etc.

Layouts

When you have a view with child views, you need to specify how to render the child views. This is done using layouts. In the example above, he views will be rendered beneath each other using the linear layout.