Styling Column Technical Reference
Summary
- Styles Columns are configured at design-time in Initial Adaptable State
- Styled Column API is used for run time access to Styled Columns
Styled Column State
The Styled Column section of Adaptable State contains a collection of StyledColumn objects:
| Property | Description |
|---|---|
| StyledColumns | Collection of Special Column Styles |
The Styled Column object is defined as follows:
| Property | Description |
|---|---|
| BadgeStyle | Displays cell values in Column as a Badge |
| ColumnId | Column being styled |
| GradientStyle | Styles a numeric column with a Gradient |
| PercentBarStyle | Styles a numeric column so each cell displays a 'Bar' |
| SparklineStyle | Displays a Sparkline Chart in an array column |
| IsReadOnly | Sets Entity to ReadOnly (overwriting a Strategy Entitlement of 'Full') |
| IsSuspended | Suspends (i.e. turns off) an Adaptable Object |
Gradient Style
The Gradient Column object is of type NumericStyledColumn defined as follows:
| Property | Description | Default |
|---|---|---|
| CellRanges | Ranges (e.g. to create traffic light effect) | |
| ColumnComparison | Compares Cell values to another Column | |
| RangeValueType | Used with Ranges; can be Number (any number or Col-Min/Col-Max) or 'Percentage' (values 0-100) | Number |
Percent Bar Style
The Percent Bar Style also inherits from NumericStyledColumn:
| Property | Description | Default |
|---|---|---|
| CellRanges | Ranges (e.g. to create traffic light effect) | |
| ColumnComparison | Compares Cell values to another Column | |
| RangeValueType | Used with Ranges; can be Number (any number or Col-Min/Col-Max) or 'Percentage' (values 0-100) | Number |
But it also contains a few additional properties:
| Property | Description | Default |
|---|---|---|
| BackColor | Background colour for 'Percent Bar'; leave unset if none required | undefined |
| CellText | Whether Cell shows Cell Value, Percent Value, both or none | |
| CellTextPosition | Position of text in Cell relative to Percent Bar, "Above", "Below" or "Merged" | Below |
| ToolTipText | Whether Tooltip shows Cell Value, Percent Value, both or none |
Cell Ranges
Both Gradient Column and Percent Bar contain a CellRanges property of type CellColorRange:
| Property | Description |
|---|---|
| Color | Cell colour to use for values that fall inside Range |
| Max | End number of Range |
| Min | Start number of Range |
| ReverseGradient | Reverses the Gradient so the lower the cell value the darker the colour |
Column Comparison
Gradient Column and Percent Bar also both contain a ColumnComparison property of type ColumnComparison:
| Property | Description |
|---|---|
| Color | Colour to use for the Comparison |
| MaxValue | End value - either numeric value or Column name |
| MinValue | Start value - either numeric value or Column name |
Badge Style
The BadgeStyle is defined as follows:
| Property | Description |
|---|---|
| Badges | Collection of Badge Style Definitions |
| RowScope | Which types of Rows should contain a Badge (data, grouped, summary) |
Each BadgeStyleDefinition is defined as follows:
| Property | Description |
|---|---|
| Expression | |
| Icon | Icon to display in Badge |
| IconOnly | Only show an Icon and no Cell text |
| IconPosition | Position of Icon in the Badge - 'Start' or 'End' |
| Predicate | Optional Rule for deciding whether Badge is displayed |
| Style | Style for the Badge |
Sparkline Style
The Sparkline Style has a single options property which sets up the AG Grid Sparkline properties
Styled Column API
The Styled Column API section of Adaptable API contains functions for managing Styled Columns:
| Method | Description |
|---|---|
| addStyledColumn(styledColumn) | Create a Styled column |
| canDisplaySparklines() | Can this AdapTable instance display Sparklines (e.g. is AG Grid SparklinesModule installed) |
| deleteAllStyledColumns() | Delete all Styled Columns in State |
| deleteStyledColumn(styledColumn) | Delete a Styled column |
| editStyledColumn(styledColumn) | Edits a Styled Column |
| getActiveStyledColumnForColumn(column) | Returns a Styled Column for a given column |
| getActiveStyledColumns(config) | Retrieves all active (not-suspended) Styled Columns in Adaptable State |
| getStyledColumnById(id, config) | Retrieves Styled Column by Id |
| getStyledColumnForColumnId(columnId, config) | Retrieves Styled Column for given Column Id |
| getStyledColumns(config) | Retrieves all Styled Columns in Adaptable State |
| getStyledColumnState() | Retrieves Styled Column section from Adaptable State |
| getSuspendedStyledColumns(config) | Retrieves all suspended Styled Columns in Adaptable State |
| hasGradientStyle(columnId) | Checks whether Column with given columnId has a Gradient Style applied |
| hasPercentBarStyle(columnId) | Checks whether Column with given columnId has a PercentBar Style applied |
| isSparklineStyleStyledColumn(column) | Checks whether Column is a Sparkline Column |
| openStyledColumnSettingsPanel() | Open Styled Column section of Settings Panel |
| suspendAllStyledColumn() | Suspends all Styled Columns |
| suspendStyledColumn(styledColumn) | Suspends an active Styled Column |
| unSuspendAllStyledColumn() | Activates all suspended Styled Column |
| unSuspendStyledColumn(styledColumn) | Activates a suspended Styled Column |