Skin form — Components tab — Layouts — Trees and tables - Rows tab
Styles that you set on this tab apply to the rows in tables, tree tables, and tree layouts.
Select Enable row banding options (zebra striping) to specify alternating text or background colors for odd and even rows.
Only text color is used when using default grid text or mixin. Only background color is used when using default grid background or mixin.
A preview of the currently selected format displays to the right. You can also preview formats by selecting on the toolbar and then choosing one of the following preview options: Run Process, Open Portal, Harness Preview, UI Gallery Preview, Skin Preview.
| Enable row banding options (zebra striping) | Select to enable alternating odd and even text and background colors. Without selecting this option, you can apply formatting to the rows, the total row, the tree icons, and the expand pane icons. After you select this check box, you can select different styling for the odd and even rows. |
Rows: All, Odd, Even, or Total
Set the Text and Background color for rows: all (without banding), odd and even (with banding) or total row.
Text
Use the default text for the grid format or choose the mixin style or a specific style.
To set the row handle image, select the Headers tab.
| Use mixin |
Select Use mixin to apply the skin's standard active mixin. You can then
override individual font attributes by clicking Add Mixin Overrides . Select Specify
styles to define all your own font attributes independently of the mixin.
The Mixin field displays the name and a preview of the currently selected mixin. Click the menu icon to select a different mixin from the list. |
| Specify styles |
Select to define a custom style for the selected format and specify a Color
for the text. Enter a hexadecimal value (such as #3d3d3d) or click the box next to
the field to
Color Picker.
|
Background
Applies to the background color of odd, even, and total rows.
| Use default background for this grid format | Select to use the default background color specified in the Default background area on the General tab. |
| Use mixin | Select to use a mixin to define the background color. Mixin displays the name and a preview of the currently selected mixin. Click the menu icon to select a different mixin from the list. |
| Specify styles |
Select to specify a Color . The default is transparent (no fill). Enter a
value using CSS hex notation (such as #3d3d3d) or click the box next to the field to
Color Picker.
|
Tree icons and Expand Pane icons
Specify Expand and Collapse images for:
- Tree icons — These icons are handles for expanding and collapsing row details.
- Expand Pane icons — These icons are handles for expanding and collapsing a pane.
|
Expand
Collapse |
To search for an image, click the
Gear
icon to open the
Image Catalog tool. Enter any portion of a file name (relative path, file name, or
extension) in the Search box, and click
Find. If you can’t
find the image, make sure it is in the
webwb
directory.
|
- grid
Help users access and compare data with table layouts. Use tables in your applications as a flexible basis for users to process large amounts of information. For example, tables in a price comparison application can help users efficiently identify the best offer.
- tree grid
A tree layout allows users to view, navigate, and access the properties in pages in an embedded Page List property. The user can quickly expand and collapse branches of the tree to find entries of current interest.
- Creating a hierarchical table layout
Help users access and compare nested data with a Hierarchical table layout. Hierarchical table layouts support expandable rows, which can provide you with a more compact view of your data.
- Component styles (custom style formats)
Use the Component styles tab to define the presentation of components by creating custom style formats. After you define style formats, reference them on property panes for sections, harnesses, and controls.
Previous topic Creating custom table and tree table formats Next topic Skin form — Components tab — Layouts — Trees and tables - General tab