...
The rootPane is a Nexaweb application's implied top-level container.
| Code Block |
|---|
<rootpane> |
...
</rootpane> |
You specify the root pane in your application's client XAL file if you want to change the values of any of the rootPane attributes from their defaults. For example, to set the rootPane border and color.
...
The following shows the XAL syntax for an MDI-style application with a tree on the left and some windows in the center of the container:
| Code Block |
|---|
<rootPane> |
...
<borderPane> |
...
<tree borderPosition="west"/> |
...
<desktopPane borderPosition="center"> |
...
<window>...</window> |
...
</desktopPane> |
...
</borderPane> |
...
</ |
...
rootPane> |
This example includes:
- rootPane, a top-level container.
- borderPane, a layout container that manages the layout of the containers and components within the rootPane.
- tree, a component that provides a hierachical representation of data, situated in the west coordinate of the borderPane layout.
- desktop, a panel that can contain windows and dialogs, situated in the center coordinate of the borderPane layout.
- window, a window component contained in the desktopPane.
...
Visually, with some additional display attributes specified, this example appears as follows:
defs
You specify items in defs tag that other components can refer to by using the syntax: #ID (pound symbol+component ID). Items under the defs tag must be declared before components that refer to them or an error occurs.
...
The following example shows the syntax for a defs section in a Nexaweb Java application UI file including definitions for popup and popupMenu components.
| Code Block | ||||
|---|---|---|---|---|
| ||||
<xal xmlns="http://openxal.org/ui/java"> |
...
<defs> |
...
<popup id="myPopup"> |
...
<borderPane> |
...
<label text="south" borderPosition="south"/> |
...
<label text="east" borderPosition="east"/> |
...
<label text="north" borderPosition="north"/> |
...
<label text="west" borderPosition="west"/> |
...
<label text="center" borderPosition="center"/> |
...
</borderPane> |
...
</popup> |
...
<popupMenu id="myPopupMenu"> |
...
<menuItem text="A menu item"/> |
...
<menuItem text="Another menu item"/> |
...
</popupMenu> |
...
</defs> |
...
<rootPane> |
...
<borderPane> |
...
<desktopPane borderPosition="center"> |
...
<horizontalFlowPane> <borderPane width="300px" height="500px"> |
...
<button text="A button with a popup" popup="#myPopup" borderPosition="north"/> |
...
<button text="MyPopup Used Here" popup="#myPopupMenu" borderPosition="south"/> |
...
<button height="25px" text="MyPopup Used Here" width="200px" popup="#myPopupMenu" borderPosition="west"/> |
...
</borderPane> |
...
</horizontalFlowPane> |
...
</desktopPane> |
...
</borderPane> |
...
</rootPane> |
...
</xal> |
The following figures shows the UI displaying the popupMenu, MyPopup, from the middle button, and then the bottom button.
The following example shows the syntax for a defs section in a Nexaweb Java application UI file including a linearGradient:
| Code Block | ||||
|---|---|---|---|---|
| ||||
<xal xmlns="http://openxal.org/ui/java"> |
...
<defs> |
...
<linearGradient id="button_gradient_xal" x1="0%" y1="0%" y2="100%"> |
...
<stop offset="30%" stop-color="blue"/> |
...
<stop offset="100%" stop-color="#D5DEE3"/> |
...
</linearGradient> |
...
</defs> |
...
<rootPane> |
...
<borderPane> |
...
<desktopPane borderPosition="center"> |
...
<horizontalFlowPane> <borderPane> <button text="OK" borderPosition="north"/> |
...
<button text="Apply" borderPosition="center"/> |
...
<button text="linearGradient" borderPosition="south" backgroundColor="gradient(button_gradient_xal)"/> |
...
</borderPane> |
...
</horizontalFlowPane> |
...
</desktopPane> |
...
</borderPane> |
...
</rootPane> |
...
</xal> |
The following figure shows the UI displaying a button using the linearGradient defined in the defs section:
