Panel

Use

A Panel is a container-type UI element that is similar to a Tray. You can use a Panel also as a ROOTUIELEMENTCONTAINER.

Panel

Unlike a Tray a Panel has a toggle button, which is displayed in the form of a small triangle in the top left corner. (A Tray has a square button that is displayed in the top right corner).

Different to a Tray the height property specifies the full height of Panels, including header and ToolBar. In a Tray the height specifies only the height of the content area, so without the header and ToolBar.

Note

To avoid confusion with Trays, you should not use Trays and Panels together on the same screen.

Implementation Details

Runtime Class

CL_WD_PANEL

Name	Type	Initial Value	Bindable
id	STRING	(automatic)	No
accessibilityDescription	Translatable text		Yes
ariaLandmark	WDUI_ARIA_LANDMARK	None	Yes
contentDesign	WDUI_PANEL_CONTENT_DESIGN	transparentNoBorder	Yes
contentPadding	WDUI_CONTENT_PADDING	standard	Yes
contextMenuBehaviour	WDUI_CONTEXT_MENU_BEHAVIOUR	inherit	No
contextMenuId	WDY_MD_UI_ELEMENT_REFERENCE		No
defaultButtonId	WDY_MD_UI_ELEMENT_REFERENCE		Yes
enabled	WDY_BOOLEAN	true	Yes
expandable	WDY_BOOLEAN	true	Yes
expanded	WDY_BOOLEAN	true	Yes
handleHotkeys	WDY_BOOLEAN	false	No
headerDesign	WDUI_PANEL_HEADER_DESIGN	standard	Yes
height	STRING		Yes
imageSource	STRING		Yes
isDragHandle	WDY_BOOLEAN	false	No
scrollingMode	WDUI_SCROLLING_MODE	none	Yes
scrollLeft	I	0	No
scrollTop	I	0	No
styleClassName	STRING		Yes
title	Translatable text		Yes
titleEditable	WDY_BOOLEAN	false	Yes
tooltip	Translatable text		Yes
visible	WDUI_VISIBILITY	visible	Yes
width	STRING		Yes

Name	Cardinality	Type
Element	0..n	UIElement
DRAG_SOURCE_INFO	0..1	DragSourceInfo
DROP_TARGET_INFO	0..1	DropTargetInfo
HEADER_FUNCTIONS	0..n	IconButton
HEADER_TOOLBAR	0..1	ToolBar
TOOLBAR	0..1	ToolBar

Name
onDrop
onToggle

Note

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

Dynamic Programming

For dynamic programming, the same properties, events, and aggregations as in the View Designer are available. But note that the spelling format and use of upper/lower case is different.

View Designer Name	Runtime Name	Type
accessibilityDescription	ACCESSIBILITY_DESCR	WDY_MD_TRANSLATABLE_TEXT
ariaLandmark	ARIA_LANDMARK	WDUI_ARIA_LANDMARK
ariaLandmark: Application	CL_WD_PANEL=>E_ARIA_LANDMARK-APPLICATION
ariaLandmark: Article	CL_WD_PANEL=>E_ARIA_LANDMARK-ARTICLE
ariaLandmark: Banner	CL_WD_PANEL=>E_ARIA_LANDMARK-BANNER
ariaLandmark: Complementary	CL_WD_PANEL=>E_ARIA_LANDMARK-COMPLEMENTARY
ariaLandmark: Contentinfo	CL_WD_PANEL=>E_ARIA_LANDMARK-CONTENTINFO
ariaLandmark: Form	CL_WD_PANEL=>E_ARIA_LANDMARK-FORM
ariaLandmark: Main	CL_WD_PANEL=>E_ARIA_LANDMARK-MAIN
ariaLandmark: Navigation	CL_WD_PANEL=>E_ARIA_LANDMARK-NAVIGATION
ariaLandmark: None	CL_WD_PANEL=>E_ARIA_LANDMARK-NONE
ariaLandmark: Search	CL_WD_PANEL=>E_ARIA_LANDMARK-SEARCH
contentDesign	CONTENT_DESIGN	WDUI_PANEL_CONTENT_DESIGN
contentDesign: fillBorder	CL_WD_PANEL=>E_CONTENT_DESIGN-FILL
contentDesign: fillNoBorder	CL_WD_PANEL=>E_CONTENT_DESIGN-FILL_NO_BORDER
contentDesign: plainBorder	CL_WD_PANEL=>E_CONTENT_DESIGN-PLAIN
contentDesign: plainNoBorder	CL_WD_PANEL=>E_CONTENT_DESIGN-PLAIN_NO_BORDER
contentDesign: transparentNoBorder	CL_WD_PANEL=>E_CONTENT_DESIGN-TRANSPARENT
contentDesign: transparentBorder	CL_WD_PANEL=>E_CONTENT_DESIGN-TRANSPARENT_BORDER
contentPadding	CONTENT_PADDING	WDUI_CONTENT_PADDING
contentPadding: none	CL_WD_PANEL=>E_CONTENT_PADDING-NONE
contentPadding: standard	CL_WD_PANEL=>E_CONTENT_PADDING-STANDARD
contextMenuBehaviour	CONTEXT_MENU_BEHAVIOUR	WDUI_CONTEXT_MENU_BEHAVIOUR
contextMenuBehaviour: inherit	CL_WD_PANEL=>E_CONTEXT_MENU_BEHAVIOUR-INHERIT
contextMenuBehaviour: provide	CL_WD_PANEL=>E_CONTEXT_MENU_BEHAVIOUR-PROVIDE
contextMenuBehaviour: suppress	CL_WD_PANEL=>E_CONTEXT_MENU_BEHAVIOUR-SUPPRESS
contextMenuId	CONTEXT_MENU_ID	WDY_MD_UI_ELEMENT_REFERENCE
defaultButtonId	DEFAULT_BUTTON_ID	WDY_MD_UI_ELEMENT_REFERENCE
enabled	ENABLED	WDY_BOOLEAN
expandable	EXPANDABLE	WDY_BOOLEAN
expanded	EXPANDED	WDY_BOOLEAN
handleHotkeys	HANDLE_HOTKEYS	WDY_BOOLEAN
headerDesign	HEADER_DESIGN	WDUI_PANEL_HEADER_DESIGN
headerDesign: standard	CL_WD_PANEL=>E_HEADER_DESIGN-STANDARD
headerDesign: underline	CL_WD_PANEL=>E_HEADER_DESIGN-UNDERLINE
height	HEIGHT	STRING
imageSource	IMAGE_SOURCE	STRING
isDragHandle	IS_DRAG_HANDLE	WDY_BOOLEAN
scrollingMode	SCROLLING_MODE	WDUI_SCROLLING_MODE
scrollingMode: auto	CL_WD_PANEL=>E_SCROLLING_MODE-AUTO
scrollingMode: both	CL_WD_PANEL=>E_SCROLLING_MODE-BOTH
scrollingMode: none	CL_WD_PANEL=>E_SCROLLING_MODE-NONE
scrollLeft	SCROLL_LEFT	I
scrollTop	SCROLL_TOP	I
styleClassName	STYLE_CLASS_NAME	STRING
title	TITLE	WDY_MD_TRANSLATABLE_TEXT
titleEditable	TITLE_EDITABLE	WDY_BOOLEAN
tooltip	TOOLTIP	WDY_MD_TRANSLATABLE_TEXT
visible	VISIBLE	WDUI_VISIBILITY
visible: none	CL_WD_PANEL=>E_VISIBLE-NONE
visible: visible	CL_WD_PANEL=>E_VISIBLE-VISIBLE
width	WIDTH	STRING

View Designer Name	Runtime Name	Cardinality
Element	CHILDREN	0..n
DRAG_SOURCE_INFO	DRAG_SOURCE_INFO	0..1
DROP_TARGET_INFO	DROP_TARGET_INFO	0..1
HEADER_FUNCTIONS	HEADER_FUNCTIONS	0..n
HEADER_TOOLBAR	HEADER_TOOLBAR	0..1
TOOLBAR	TOOLBAR	0..1

View Designer Name	Runtime Name
onDrop	ON_DROP
onToggle	ON_TOGGLE

Example

You can find a test example in the system in the WDR_TEST_PANEL component.