1

I have a table where one of the columns (sap.m.Text) represents a binary value (0/1) and I would like to format it in the following manner:

  1. Mapping: 0/1 → No/Yes
  2. Style: No should be a red color
  3. Style: Yes should be a green color

The mapping I've performed as described in Step 23: Custom Formatters, everything is working correctly.

But I'm struggling with style-formatting. In the Step 22: Expression Binding there is an example how to format a number according to its value by using the numberState, however, sap.m.Text (<Text />) doesn't have such or any similar property.

Is there any easy way to apply a style formatting based on a value for sap.m.Text? Or the only way is to apply manually a CSS-style?

Mike
  • 14,010
  • 29
  • 101
  • 161
  • 1
    In addition to the linked answer: as mentioned in the Fiori Design Guidelines, either `sap.m.ObjectStatus` or `sap.m.ObjectNumber` can be used if ["you need to display the semantic status of an object"](https://experience.sap.com/fiori-design-web/object-display-elements/) (here: the item of the table / list). See also the [UX guideline for Responsive Table (`sap.m.Table`)](https://experience.sap.com/fiori-design-web/responsive-table/) which mentions the object display controls. – Boghyon Hoffmann Apr 18 '21 at 12:46
  • PS: please consider closing https://github.com/SAP/openui5/issues/3224 – Boghyon Hoffmann Apr 18 '21 at 12:49
  • What's bad to have an ability to specify a `state` for `sap.m.Text` elements? – Mike Apr 18 '21 at 12:54
  • How does `sap.m.Text` with `state` differ from `sap.m.ObjectStatus`? – Boghyon Hoffmann Apr 18 '21 at 12:56

1 Answers1

1

For texts:

<ObjectStatus
    state = "{= ${isCompleted} === 0 ? 'Error' : 'Success'}"
    text = "{= ${isCompleted} === 0 ? ${i18n>STATUS_NO} : ${i18n>STATUS_YES}}" />

For numbers:

<ObjectNumber
    number = "{= ${isCompleted} === 0 ? ${i18n>STATUS_NO} : ${i18n>STATUS_YES}}"
    state = "{= ${isCompleted} === 0 ? 'Error' : 'Success'}" />
Mike
  • 14,010
  • 29
  • 101
  • 161
  • Not sure how much the 2nd snippet makes sense. The `number` should ideally get a number instead of a translatable text – Boghyon Hoffmann Apr 18 '21 at 12:18
  • My initial solution was with `ObjectNumber`, then I realized your solution with `ObjectStatus` and updated the answer. Anyway, I've [proposed](https://github.com/SAP/openui5/issues/3224) to the UI5 team to add the `state`-property to `sap.m.Text` in order to avoid extra mess with `ObjectStatus`. – Mike Apr 18 '21 at 12:40
  • Could you elaborate more on what you mean by _extra mess_? – Boghyon Hoffmann Apr 18 '21 at 12:56
  • I have a set of `Text`-items in `items`/`ColumnListItem`/`cells`, now I want to add semantic highlight, but to do that I have to replace a `Text`-item with an `ObjectStatus`. While I would expect just to have an ability to provide a `state`-value for the `Text`-item. – Mike Apr 18 '21 at 12:59