Scrollview

Scrollview is a component that allows to make any ui-component scrollable (horizontal or vertical). Ui-related scrollview inherits from view.


Full code of the example in the picture

Initialization

To init the component you need to perform a simple procedure - call initialization code.

Initialization code or an object constructor lets you create an object by using common declaration.

dhx.ui ({view:"scrollview", 
...})

Parameters

In constructor you can specify the following parameters:

  • scroll - (x, y) sets the type of scrolling (x - horizontal, y - vertical)
  • content - specifies view content that you want to scroll (whatever ui-components you like)

Please note, scrollview is a derived class, i.e. it inherits all the features of the base class (scrollview → view).

dhx.ui({
        container:"container",
	rows:[{   
		 view:"scrollview",
		 scroll:"x",
		 content:{
                           width:3000,
			   cols:[
		                 { id:"1",template:img, data:{src:"imgs/image001.jpg"} },
				 { id:"2",template:img, data:{src:"imgs/image002.jpg"} },
				 { id:"3",template:img, data:{src:"imgs/image003.jpg"} }
 		]}
	}]
})

Related how-tos