- Created by Kirstin Seidel-Gebert, last modified by Annegret Bernhardt on Jan 26, 2024
MagicDraw offers a selection of basic and also complex widgets and user interface objects which cover most of any screen design needs. As a matter of fact, not all MagicDraw UI elements can be used for designing screens that work with xUML service UIs.
As a reference the following catalog will describe and at the same time indicate that they can be used.
Supported UI Elements
Oops, it seems that you need to place a table or a macro generating a table within the Table Filter macro.
The table is being loaded. Please wait for a bit ...
Type | Name | Element | Description |
---|---|---|---|
Container | Panel | The Panel container () is the most basic container and is the base for any screen modeling. | |
Frame | The Frame container () is used for modal dialogs and screens that open within the same browser window (e.g. detail view or table records). A Frame has by default a close button in the window title bar. It is important to know, that despite of the creating a web application, the Frame container does not represent the HTML frames. | ||
Tabbed Pane | The Tabbed Pane container () is an ideal way to consolidate multiple screens on little space. | ||
Group Box | The Group Box container () is ideal for grouping UI elements into different groups belonging together. | ||
UI Element | Label | The Label element () is for placing static text on a Panel container. | |
Text Field | The Text Field element () is used to give the user the possibility to input text to the application.
| ||
Password Field | The Password Field element () is a Text Field with the difference, that the input is not shown in plain text but each character is replaced and hidden with the * symbol. | ||
Checkbox | The Checkbox element () is used to indicate a on or off state. | ||
Radio Button | The Radio Button element () is used in a similar way as the Check Box element but with the difference, that only one option within a group of options can be selected. Refer to Radio Button Group for more information. | ||
Combo Box | The Combo Box element () allows to select one option of a list that opens up when clicking with the cursor onto the element. With some additional changes to the tagged values the Combo Box element can change to a Multiselect List. How to implement this is described in the following chapters. | ||
Table | The Table element () is used to render data within a table grid. | ||
Tree | The Tree element () can be used to display hierarchical trees like folder structures or catalog indices. | ||
List | The List element () enables to select one or more options from a list. | ||
Separator | The Separator element () can be used to visually separate one area of a screen with another one. | ||
Button | The Button element () is used to submit an action by the application user e.g. send a form or open a dialog window. | ||
File Selector | The File Selector, used for selecting files to bind them to an file upload form consists of a normal button element () element with the open icon applied to it. The open icon is specified in the buttons specifications. The file selector will be displayed as follows: |
Unsupported UI Elements
Name | Element | Remark |
---|---|---|
Slider () | ||
Progress Bar () | ||
Menu Bar () | ||
Scroll Bar () | Scrollbars are added automatically to the container elements if necessary. | |
Spinner () | ||
Toolbar () | ||
Close Toolbar button () |
Usage of the UI Widgets:
- No labels