Start of Content Area

Background documentation Tree  Locate the document in its SAP Library structure

Hierarchies defined in the context can be visualized using the Tree UI element. The hierarchy to be displayed is defined in the context. You can describe this context structure in two ways:

      With a recursive node if the number of levels is not yet known at design time.

      With a non-recursive node if a certain number of levels can be specified at design time.

So a tree is used for navigation. By clicking on an entry the associated data is displayed in another place. If you want to display a tree structure in which data can be input and you want to provide a scroll bar, use a hierarchical table instead of a tree. More information: TreeByKeyTableColumn and TreeByNestingTableColumn. A tree does not enable the user to select entries, it can only interact with the LeadSelection. Note that although this looks like a selection, it does affect performance, which means that for most scenarios it would be a hindrance.

Example of the Visual Display

This graphic is explained in the accompanying text

The Tree UI element is bound against the top-level context node to be displayed.

You use nodes (TreeNodeType elements) or leaves (TreeItemType elements) to specify which subnodes are to be displayed and which context attributes are to be displayed on these subnodes as a text or tooltip. The dataSource property of the TreeNodeType element or TreeItemType element is bound to the corresponding context node and the properties text, tooltip, and so on, are bound to the corresponding context attributes on this context node.

TreeItemType elements cannot have children. Therefore, they are always displayed as leaves. They are used when it is decided at design time that the corresponding node does not have children. When using TreeNodeType elements, the decision of whether to use children is dynamically made at runtime.

Note

Hierarchy levels defined in the context cannot be left out when displaying the UI element. For example, a TreeNodeType element that is bound to the Orders must also exist to display the items for the hierarchy Customers Orders Items, which is defined in a context.

All nodes that are not directly below the context root node must be non-singleton nodes, because all elements should be displayed in a tree regardless of the lead selection.

You can also bind the tree so that the dataSource of the tree binds to a structured 1:1 node and the element nodes of the tree are located below them. This is necessary to map directory structures. With recursive trees you can display the recursions for this 1:1 node. This is then skipped with rendering.

Note

To enable the development of accessible applications, the tooltip property is checked during the syntax check.

 

Runtime Class

CL_WD_TREE

 

Properties in View Designer

Name

Type

Initial Value

Bindable

ID

STRING

(automatic)

No

dataSource

Context Node

 

Mandatory

defaultItemIconSource

STRING

 

Yes

defaultNodeIconSource

STRING

 

Yes

enabled

WDY_BOOLEAN

true

Yes

minHeight

STRING

 

Yes

rootText

Translatable text

 

Yes

rootVisible

WDY_BOOLEAN

true

Yes

selectionChangeBehaviour

WDUI_LEAD_SEL_CHNG_BEHVR

auto

No

title

Translatable text

 

Yes

titleVisible

WDUI_VISIBILITY

visible

Yes

tooltip

Translatable text

 

Yes

visible

WDUI_VISIBILITY

visible

Yes

width

STRING

 

Yes

 

Aggregations in View Designer

Name

Cardinality

Type

Node Type:

0..n

AbstractTreeNodeType

 

Events in View Designer

Name

onExpandAll

Note

Other properties that can be inherited are defined in the associated higher-level classes. The associated UI elements are:

        UIElement

        ViewElement

Dynamic Programming

For dynamic programming, the same properties, events and aggregations are available as in the View Designer. Bear in mind the different spellings.

Dynamic Programming of Properties

View Designer Name

Runtime Name

Type

dataSource

DATA_SOURCE

OBJECT

defaultItemIconSource

DEFAULT_ITEM_ICON_SOURCE

STRING

defaultNodeIconSource

DEFAULT_NODE_ICON_SOURCE

STRING

enabled

ENABLED

WDY_BOOLEAN

minHeight

MIN_HEIGHT

STRING

rootText

ROOT_TEXT

WDY_MD_TRANSLATABLE_TEXT

rootVisible

ROOT_VISIBLE

WDY_BOOLEAN

selectionChangeBehaviour

SELECTION_CHANGE_BEHAVIOUR

WDUI_LEAD_SEL_CHNG_BEHVR

 selectionChangeBehaviour: auto

CL_WD_TREE=>E_SELECTION_CHANGE_BEHAVIOUR-AUTO

 selectionChangeBehaviour: manual

CL_WD_TREE=>E_SELECTION_CHANGE_BEHAVIOUR-MANUAL

title

TITLE

WDY_MD_TRANSLATABLE_TEXT

titleVisible

TITLE_VISIBLE

WDUI_VISIBILITY

 titleVisible: none

CL_WD_TREE=>E_TITLE_VISIBLE-NONE

 titleVisible: visible

CL_WD_TREE=>E_TITLE_VISIBLE-VISIBLE

tooltip

TOOLTIP

WDY_MD_TRANSLATABLE_TEXT

visible

VISIBLE

WDUI_VISIBILITY

 visible: none

CL_WD_TREE=>E_VISIBLE-NONE

 visible: visible

CL_WD_TREE=>E_VISIBLE-VISIBLE

width

WIDTH

STRING

 

Dynamic Programming of Events

View Designer Name

Runtime Name

onExpandAll

ON_EXPAND_ALL

 

Dynamic Programming of Aggregations

View Designer Name

Runtime Name

Cardinality

Node Type:

NODE_TYPES

0..n

Example

You can find examples of this interface element in the system in the Web Dynpro application WDR_TEST_UI_ELEMENTS, and in the component WDR_TEST_EVENTS in the views TREE_*.

 

 

End of Content Area