Layouts

Introduction

As you may have understood, layouts are elements, just like any other views. However, they allows to group other elements together, and to choose how to scale and position them according to a certain policy.

Class In Depth

Below are listed the attributes and methods of all layouts. You can modify them as you want. However, it is not advised to modify any field beginning with an underscore (e.g: _myField). You must also use setters if they exist, as they may do some preprocessing.

Object method

• add(element): add an element to the layout. Be careful, the order is maintained. You can also take an array of elements, or even a variable number of elements. e.g: add(element1, element2, element3, ...)

Examples

Add one element at a time:

let layout = new VRUI.layout.VerticalLayout({
    background: 0xFF0000
});

let button = new VRUI.view.ImageButton(texture, {
    height: 0.5,
    width: 0.5,
    background: 0x00FFFF
})

layout.add(button); // Add the button to the layout

You can also add an array of elements:

let layout = new VRUI.layout.VerticalLayout({
    background: 0xFF0000
});

let button = new VRUI.view.ImageButton(texture, {
    height: 0.5,
    width: 0.5,
    background: 0x00FFFF
})

let buttonsList = []
for (let i = 0; i < 10; ++i) {
    buttonsList.push(button.clone());
}

layout.add(buttonsList); // Adds an array of button

You can also list them:

let layout = new VRUI.layout.VerticalLayout({
    background: 0xFF0000
});

let button = new VRUI.view.ImageButton(texture, {
    height: 0.5,
    width: 0.5,
    background: 0x00FFFF
})
let button2 = button.clone();

layout.add(button, button2); // Adds both buttons