Index

• Overview
• BorderPane

Overview

The HT for Web provides a border panel ht.widget.BorderPane component layout container, the subcomponents can be placed in the top, bottom, left, right, and middle five regions, and can be the HT framework, or HTML native components, subcomponents absolute positioning by setting position to absolute.

The TablePane and TreeTablePane components' internal are used the BorderPane to lay out the TableView and TableHeader.

BorderPane

The main configurable properties and functions of the border panel class ht.widget.BorderPane are as follows:

• isDisabled() and setDisabled(true/false, iconURL) Gets and sets the entire component in an unusable state
• topHeight Top component height, can gets and sets value by getTopHeight()/setTopHeight(topHeight)
• topView Top component, can gets and sets value by getTopView()/setTopView(view, topHeight)
• bottomHeight Bottom component height, can gets and sets value by getBottomHeight()/setBottomHeight(bottomHeight)
• bottomView Bottom component, can gets and sets value by getBottomView()/setBottomView(view, bottomHeight)
• leftWidth Top component width, can gets and sets value by getLeftWidth()/setLeftWidth(leftWidth)
• leftView Left component, can gets and sets value by getLeftView()/setLeftView(view, leftWidth)
• rightWidth Top component width, can gets and sets value by getRightWidth()/setRightWidth(rightWidth)
• rightView Right component, can gets and sets value by getRightView()/setRightView(view, rightWidth)
• centerView Center component, can gets and sets value by getCenterView()/setCenterView(value)

The example constructs two BorderPane objects where the innerBorder object is nested in the middle of another centerView:

borderPane = new ht.widget.BorderPane();       
innerBorder = new ht.widget.BorderPane();

innerBorder.setTopView(createDiv('lightyellow', 'top'), 50);
innerBorder.setBottomView(createDiv('lightyellow', 'bottom'), 50);
innerBorder.setLeftView(createDiv('#3498DB', 'left'), 100);
innerBorder.setRightView(createDiv('#3498DB', 'right'), 100); 
innerBorder.setCenterView(createDiv('#F4F4F4', 'center')); 

borderPane.setTopView(createDiv('#1ABC9C'), 30);
borderPane.setBottomView(createDiv('#1ABC9C'), 30);
borderPane.setLeftView(createDiv('#E74C3C'), 50);
borderPane.setRightView(createDiv('#E74C3C'), 50);  
borderPane.setCenterView(innerBorder);