XML Tutorial Scrollbar and View Control
Version 1.6
This is the archives. For the latest Bambookit GUI 2.0, XML GUI Demos & Tutorials visit: www.bambookit.com/_demo.html


View without frames

This section below will describe how to use scrollbars in Bambookit.

Let's say you encounter the situation where you have created a widget with rows of button controls as is displayed below.

Then you decided to add 10 more rows of buttons to the widget, and at the same time to keep the widget's size (setSize="120,300", line 2) the same. To do so you would use the View control, which will be set to this size (setSize="120,300"), and we will place the widget inside this View. Then you will set the Widget size as large as you need. The Widget and the two Scrollbar controls are added to the View. In this case you would need to use a vertical scroll to be able to view the contents(10 more buttons added) of the widget. View control is a parent for the Scrollbar, so you always place the Scrollbar control inside the View. View control extends from the Widget control, and therefore inherits all widget's properties, like setShape, setBackground, setBorder and so forth.

In the applet below we have added to the widget 10 more buttons, and this would increase the height of the widget to 605, line 5 to be able to display those buttons. Then we placed this widget inside the View control. Then we add two Scrollbar controls inside the View control : first represents the vertical(setVertical="true", line 3) and second the horizontal(setVertical="false", line 4) scrollbars. To display the horizontal Scrollbar control (which is the case in the applet below), you must set the Widget's width to be less then the View's width by 22 pixels (in this case the scrollbar width is 20 pixels wide, and the Widget's border is 1 pixel wide, where the left and right borders sum is 2 pixels). Therefore the Widget size inside the View control is: setSize="98,605" in the applet below, line 5. See Scrollbar section of the tutorial on how you can customize the scrollbars.

Now let's increase the Widget's width to 500 on line 5. This is shown below, note the horizontal Scrollbar that has now appeared.

[Home][Tutorial] [Demo]

Containers
Windows Panels Tabs Resize Layout Manager Splitter View Dragresize Scrollbars