Customizing the Label in Table Cells

Styling > Using Cascading Style Sheets > Customizing the Label in Table Cells

Customizing the Label in Table Cells

This use case shows you how to customize the label that represents an attribute in the table graphic component.

You can use the following CSS properties to customize the label used to represent an attribute in a table component:

CSS Property	Type of Value	Default	Usage
`label`	`String`	`null`	Text to be displayed for the label. By default, no text is displayed.
`labelVisible`	`Boolean`	`true`	Determines whether the label is displayed or not.
`labelFont`	`Font`	`null`	Font to be used for the label. By default, it is a sans serif font.
`labelForeground`	`Color`	`null`	Color to be used for the label foreground of a cell. By default, the color is black.
`labelBackground`	`Color`	`null`	Color to be used for the label background of a cell. By default, the color is white.

This use case shows how to customize the representation of the attribute throughput in a table component.

How to Customize an Attribute in a Table Component

<class>
  <name>Element</name>
  <superClass>ilog.tgo.model.IltNetworkElement</superClass>
  <attribute>
    <name>throughput</name>
    <javaClass>java.lang.Integer</javaClass>
  </attribute>
</class>

The following example shows how to customize the cell labels in the class Element.

How to Customize Cell Labels

object."Element/throughput" {
       label: @throughput;
       labelForeground: yellow;
       labelBackground: red;
}

In this example, the value of throughput is automatically converted from Integer to String through the application type converter when the value of label is computed. Alternatively, you could use a format function (@|format) to obtain the same result. See CSS Expressions and Functions for more information.

PREVIOUS NEXT