Toolbar

Overview

TOOLBAR is a component that contains buttons, labels, icons and other elements used for most-popular commands in app. Ui-related TOOLBAR inherits from view.


Related sample: 03_toolbar/01_init.html

Initialization

The following is an example of initialization with the commonly used parameters (to see a full list of TOOLBAR's parameters, please refer to the corresponding chapter of the manual):

dhx.ui({ 
        view:"toolbar", 
        type:"MainBar", 
        height:110, 
        id:"leftbar", 
        visibleBatch:"init",
        elements:[{ ... }]
})

All the controls that can be used in TOOLBAR (and not only in TOOLBAR, but also in FORM or as individual components) you can find in 'Controls' chapter.

API Reference

Useful Tips

  • Specify id if you're going to refer to FORM later.
  • Controls are derived classes, i.e. they inherit all the features of the base class (any control → View).
  • Use 'rows', 'cols' parameters of Layout to set the desired position of elements.
  • Height of TOOLBAR is determined according to content size.

Related articles

A full list of articles.

To use ui functionality, touchui.css and touchui.js files must be included.