BBjTree

Description

The BBjTree object provides methods for manipulating a GUI tree control.

Implemented Interfaces

DragSource, DropTarget, Editable, Focusable, MouseWheelEnabled, Scrollable,TabTraversable, Validateable

Creation

BBjAPI > BBjSysGui > BBjWindow > BBjTree

A BBjTree object is created through the following BBjWindow method:

Return Value Method
BBjTree addTree()
BBjTree addTree(byte[] flags)
BBjTree addTree(int ID)
BBjTree addTree(int ID, byte[] flags)
BBjTree addTree(int ID, number x, number y, number w, number h)
BBjTree addTree(int ID, number x, number y, number w, number h, byte[] flags)

Methods of BBjTree - Tree Node Setup

Return Value Method
void addExpandableNode(int childID, int parentID, String text)
void addNode(int childID, int parentID, String text)
void clearImageSize()
int getChildAt(int parentID, int index)
int getImageHeight()
int getImageWidth()
int getIndexOfChild(int ID)
int getNumChildren(int parentID)
int getParentNode(int childID)
int getRoot()
void insertExpandableNode(int childID, int parentID, String text, int index)
void insertNode(int childID, int parentID, String text, int index)
boolean isNodeLeaf(int ID)
void removeDescendants(int ID)
void removeNode(int ID)
void setImageSize(number width, number height)
void setRoot(int ID, String text)

Methods of BBjTree - Tree Node Expanding and Collapsing

Return Value Method
void collapseNode(int ID)
void collapseTreeFromNode(int ID)
void expandNode(int ID)
void expandTreeFromNode(int ID)
int getCollapsedNode()
int getExpandedNode()
BBjVector getExpandedNodes()
boolean isNodeExpandable(int ID)
boolean isNodeExpanded(int ID)

Methods of BBjTree - Tree Node Contents

Return Value Method
String getNodeText(int ID)
void setNodeText(int ID, String text)

Methods of BBjTree - Tree Node Editing

Return Value Method
void editNode(int ID)
void endEdit()
boolean isNodeEditable(int ID)
boolean isTreeEditable()
void setNodeEditable(int ID, boolean editable)
void setTreeEditable(boolean editable)

Methods of BBjTree - Tree Node Icons

Return Value Method
void clearNodeIcon(int ID)
void clearNodeSelectedIcon(int ID)
void setCollapsedIcon(BBjImage image)
void setCollapsedIcon(String file)
void setCollapsedImage(BBjImage image)
void setExpandedIcon(BBjImage image)
void setExpandedIcon(String file)
void setExpandedImage(BBjImage image)
void setLeafIcon(BBjImage image)
void setLeafIcon(String file)
void setLeafImage(BBjImage image)
void setNodeIcon(int ID, BBjImage image)
void setNodeIcon(int ID, String file)
void setNodeImage(int ID, BBjImage image)
void setNodeSelectedIcon(int ID, BBjImage image)
void setNodeSelectedIcon(int ID, String file)
void setNodeSelectedImage(int ID, BBjImage image)
void setSelectedIcon(BBjImage image)
void setSelectedIcon(String file)
void setSelectedImage(BBjImage image)

Methods of BBjTree - Tree Node Selection

Note:

Multiple nodes can be selected.

Return Value Method
void deselectAll()
void deselectChildren(int parentID)
void deselectNode(int ID)
BBjColor getSelectedBackColor()
BBjColor getSelectedForeColor()
int getSelectedNode()
BBjVector getSelectedNodes()
int getSelectionMode()
boolean isNodeSelected(int ID)
boolean isRootVisible()
void selectChildren(int parentID)
void selectNode(int ID)
void setNodeVisible(int ID)
void setRootVisible(boolean visible)
void setSelectedBackColor(BBjColor color!)
void setSelectedForeColor(BBjColor color!)
void setSelectionMode(int mode)

Methods of BBjTree - Node-specific Font (BBj 24.01+)

Return Value Method
BBjFont getNodeFont(int ID)
void setNodeFont(int ID, BBjFont font!)

Methods of BBjTree - Node-specific Text Color

Return Value Method
BBjColor getNodeForeColor(int ID)
void setNodeForeColor(int ID, BBjColor color)

Methods of BBjTree - Node-specific Tooltips

Return Value Method
String getToolTipText(int ID)
void setToolTipText(int ID, String text)

Methods of BBjTree - Drag and Drop

Return Value Method
boolean getDragEnabled()
String getDragType(int ID)
BBjVector getDropTypes(int ID)
void setDragEnabled(boolean enable)
void setDragType(int ID, String type)
void setDropTypes(int ID, BBjVector types)

Methods of BBjTree implemented for DragSource

Return Value Method
int getDragActions()
string getDragType()
void setDragActions(int actions)
void setDragType(string type)

Methods of BBjTree implemented for DropTarget

Return Value Method
int getDropActions()
void setDropActions(int actions)
BBjVector getDropTypes()
void setDropTypes(BBjVector types)

Methods of BBjTree implemented for Editable

Return Value Method
boolean isEditable()
void setEditable(boolean edit)

Methods of BBjTree implemented for Focusable

Return Value Method
boolean isFocusable()
void setFocusable(boolean focus)

Methods of BBjTree implemented for MouseWheelEnabled

Return Value Method
int getScrollWheelBehavior()
void setScrollWheelBehavior(int trav)

Methods of BBjTree implemented for Scrollable

Return Value Method
int getHorizontalScrollBarHeight()
int getHorizontalScrollBarPosition()
int getHorizontalScrollBarWidth()
int getVerticalScrollBarHeight()
int getVerticalScrollBarPosition()
int getVerticalScrollBarWidth()
boolean isHorizontalScrollBarVisible()
boolean isVerticalScrollBarVisible()
void setHorizontalScrollBarPosition(int position)
void setVerticalScrollBarPosition(int position)

Methods of BBjTree implemented for TabTraversable

Return Value Method
boolean isTabTraversable()
void setTabTraversable(boolean trav)

Methods of BBjTree implemented for Validateable

Return Value Method
void accept(boolean valid)
string getValidationText()

ClosedMethods of BBjTree inherited from BBjControl

Events

Callback Code Object-oriented Event Read Record Event Code
ON_CONTROL_SCROLL BBjControlScrollEvent Scrollbar Move Event p
ON_CONTROL_VALIDATION BBjControlValidationEvent Control Validation Event v
ON_GAINED_FOCUS BBjGainedFocusEvent Control Focus Gained/Lost Event f
ON_LOST_FOCUS BBjLostFocusEvent

Control Focus Gained/Lost Event

f
ON_MOUSE_ENTER BBjMouseEnterEvent Mouse Enter/Exit Event E
ON_MOUSE_EXIT BBjMouseExitEvent Mouse Enter/Exit Event E
ON_POPUP_REQUEST BBjPopupRequestEvent Popup Request Event r
ON_RIGHT_MOUSE_DOWN BBjRightMouseDownEvent Right Mouse Button Down Event R
ON_TREE_SELECT BBjTreeNodeSelectedEvent Tree Node Selected N (Notify Code 1)
ON_TREE_DESELECT BBjTreeNodeDeselectedEvent Tree Node Deselected N (Notify Code 2)
ON_TREE_EXPAND BBjTreeNodeExpandedEvent Tree Node Expanded N (Notify Code 3)
ON_TREE_COLLAPSE BBjTreeNodeCollapsedEvent Tree Node Collapsed N (Notify Code 4)
ON_TREE_EDIT_STOP BBjTreeNodeEditStoppedEvent Tree Node Edit Stopped N (Notify Code 5)
ON_TREE_MOUSE_UP BBjTreeMouseUpEvent Left Mouse Up N (Notify Code 6)
ON_TREE_MOUSE_DOWN BBjTreeMouseDownEvent Left Mouse Down N (Notify Code 6)
ON_TREE_DOUBLE_CLICK BBjTreeMouseDoubleClickEvent Double-Click on Tree N (Notify Code 7)
ON_TREE_RIGHT_MOUSE_DOWN BBjTreeRightMouseDownEvent Right Mouse Down N (Notify Code 8)
ON_TREE_RIGHT_MOUSE_UP BBjTreeRightMouseUpEvent Right Mouse Up N (Notify Code 8)

BUI logoCSS

The visual appearance of BUI controls is defined using CSS (cascading style sheets) rules. Easily change the default colors, border, and other settings by customizing these rules, all without changing any application code. See CSS API for a high-level overview of BUI CSS.

To see the effect of some simple CSS rules, use the following BBjTree sample:

rem ' BBjTree

sysgui = unt
open (sysgui)"X0"
sysgui! = bbjapi().getSysGui()
window! = sysgui!.addWindow(50,50,300,300,"BBjTree",$00090003$)
window!.setCallback(window!.ON_CLOSE,"eoj")
tree! = window!.addTree(101,25,25,250,250)
tree!.setTreeEditable(1)
node = 0
tree!.setRoot(node,"Root")

for branch = 1 to 4
    node = node + 1
    tree!.addExpandableNode(node,parent,"Node "+str(node))
    branch_node = node
    for leaf = 1 to 4
        node  = node + 1
        tree!.addNode(node,branch_node,"Node "+str(node))
    next leaf
next branch

process_events

eoj:
release

With the default CSS, that BBjTabCtrl looks like this:

The BBjTree defines the following CSS style names:

Style Name Description
.BBjTree The top level tree control
.BBjTree-node An individual node
.BBjTree-node-image An image icon within a node row
.BBjTree-content Display text within a node row
.BBjTree-node-edit The edit control that a user types into to edit node text
.BBjTree.bbj-disabled The tree is disabled
.BBjTree.bbj-focused The tree is focused
.BBjTree.bbj-readonly The tree is read-only
.BBjTree .bbj-selected The selected node; note the space between the two parts

The following CSS styles the edit control that the user types into to edit node text:

.BBjTree                    {
}
.BBjTree .bbj-selected
{
}
.BBjTree-node-edit
{
    font-size: 16px;
    max-width: 150px;
    outline: none;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(50%,rgba(243,243,243,1)), color-stop(51%,rgba(237,237,237,1)), color-stop(100%,rgba(255,255,255,1)));
    background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%);
    background: -ms-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%);
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );
}

With that CSS, the node editor looks like this:

Mode Selection Constants

The getSelectionMode and setSelectionMode methods use the following constants:

Constant Description

SINGLE_TREE_SELECTION

Only one node can be selected at a time.

CONTIGUOUS_TREE_SELECTION

Multiple contiguous tree nodes can be selected.

DISCONTIGUOUS_TREE_SELECTION

Multiple tree nodes can be selected; they do not have to be contiguous. This is the default.

ClosedConstants inherited from BBjControl

Example

rem 'Add a tree control to a window

rem 'Obtain the instance of the BBjAPI object
let myAPI! = BBjAPI()

rem 'Open the SysGui device
SYSGUI = UNT
OPEN (SYSGUI) "X0"

rem 'Obtain the instance of the BBjSysGui object
let mySysGui! = myAPI!.getSysGui()

rem 'Constants
WINDOW_X = 200,WINDOW_Y = 200
WINDOW_W = 300,WINDOW_H = 200
TREE_ID = 101
TREE_X = 0,TREE_Y = 0
TREE_W = WINDOW_W,TREE_H = WINDOW_H
PARENT_ID = 0
NODE_ID = 0
TITLE$="Musical Tree"
TRUE = 1
FALSE = 0
OK = 0
QUOTE$ = CHR(34)

rem 'Create array to hold ARTIST and songs
DIM MUSIC$[2,4]
MUSIC$[0,0]="The Beatles"
MUSIC$[0,1]="Hey Jude",MUSIC$[0,2]="Let It Be",MUSIC$[0,3]="Twist and Shout",MUSIC$[0,4]="Yesterday"
MUSIC$[1,0]="Paul Simon"
MUSIC$[1,1]="Bridge Over Troubled Waters",MUSIC$[1,2]="Hearts and Bones",MUSIC$[1,3]="Kathy's Song",MUSIC$[1,4]="The Sound of Silence"
MUSIC$[2,0]="Willie Nelson"
MUSIC$[2,1]="Always On My Mind",MUSIC$[2,2]="Getting Over You",MUSIC$[2,3]="Old Fords and Natural Stone",MUSIC$[2,4]="This Morning"

rem 'Create the main window
myWindow! = mySysGui!.addWindow(WINDOW_X,WINDOW_Y,WINDOW_W,WINDOW_H,TITLE$,$0093$,$02$)

rem 'Create the tree control on the window
myMusicalTree! = myWindow!.addTree(TREE_ID,TREE_X,TREE_Y,TREE_W,TREE_H)

rem 'Create root node of tree
myMusicalTree!.setRoot(PARENT_ID,TITLE$)

rem 'Add nodes to tree
FOR ARTIST = 0 TO 2
    NODE_ID = NODE_ID+1
    myMusicalTree!.addExpandableNode(NODE_ID,PARENT_ID,MUSIC$[ARTIST,0])
    SONG_PARENT_ID = NODE_ID
    FOR SONG = 1 TO 4
        NODE_ID = NODE_ID+1
        myMusicalTree!.addNode(NODE_ID,SONG_PARENT_ID,MUSIC$[ARTIST,SONG])
    NEXT SONG
NEXT ARTIST

rem 'Show the window
myWindow!.setVisible(TRUE)

rem 'Register the CALLBACK routines
CALLBACK(ON_TREE_SELECT,DO_SELECTION,mySysGui!.getContext(),myMusicalTree!.getID())
CALLBACK(ON_CLOSE,APP_CLOSE,mySysGui!.getContext())

rem 'Process Events
process_events

rem 'Callback routine called when the user selects a node of the tree control
DO_SELECTION:
    rem 'Get the selected node
    let NODE = myMusicalTree!.getSelectedNode()

    rem 'Get the node text
    let NODE_DATA$ = myMusicalTree!.getNodeText(NODE)

    rem 'Check if node is a child
    let CHILD_NODE = myMusicalTree!.isNodeLeaf(NODE)

    if (CHILD_NODE) then
        rem 'If child node get the parent node
        CHILD_DATA$ = NODE_DATA$
        NODE = myMusicalTree!.getParentNode(NODE)
        NODE_DATA$ = myMusicalTree!.getNodeText(NODE)
    endif

    rem 'Create the selected display message
    MESSAGE$="You have selected "+NODE_DATA$
    if (CHILD_NODE) then
        MESSAGE$ = MESSAGE$+"'s hit song, "+QUOTE$+CHILD_DATA$+"."+QUOTE$
    else
        MESSAGE$ = MESSAGE$+"."
    endif

    rem 'Display the user selection
    X = MSGBOX(MESSAGE$,OK,TITLE$)
return

rem 'Callback routine called when the user closes the application window
APP_CLOSE:
release

See Also

BBjAPI

BBjSysGui

BBjWindow

CALLBACK Verb - Register BBj Subroutine

DWC Component: dwc-tree

See the BBj Object Diagram for an illustration of the relationship between BBj Objects.