Oh-label-cell Condition based label and color

Setup, Configuration and Use Beginners
1

Hi,

Platform: Lastest Openhabian 3 running on RPI 3b+

I am trying to create a label cell that changes color and label based on condition. The following code works for tagging the cell green and changing the label. However, when it changes state to OFF, only the label work. The color does not change to red

component: oh-label-cell
config:
  item: iPhonehenrik_Online
  title: Henrik hjemme?
  stateAsHeader: true
  expandable: false
  color: "=(items.iPhonehenrik_Online.state == 'ON') ? 'green' : 'red'"
  label: "=(items.iPhonehenrik_Online.state == 'ON') ? 'Ja :-)' : 'Nei :-('"
slots: null

Changing the color state to == ‘Ja :-)’ makes no difference, however if I remove the ‘label’ line, the color yet again works. Any tips to make both work would be most welcome :slight_smile:

image
image1450×624 21.1 KB

Best regards,
Henrik

2

This may work:

> color: =(items.iPhonehenrik_Online.state === 'ON') ? 'green' : 'red'

`

3

Thanks for coming back to me @cbg!

If I attempt with:

 color: =(items.iPhonehenrik_Online.state === 'ON') ? 'green' : 'red'

I get the following error message:

Nested mappings are not allowed in compact mappings

If I attempt the full proposal as written below, it will not save when I click done.

  >color: =(items.iPhonehenrik_Online.state === 'ON') ? 'green' : 'red'
  '

Using only the “<”

>color: =(items.iPhonehenrik_Online.state === 'ON') ? 'green' : 'red'

Gives the following error messages

  • Nested mappings are not allowed in compact mappings
  • Implict map keys need to be followed by map values
4

I believe you need to quote the expression as color would expected a string:

color: "=(items.iPhonehenrik_Online.state === 'ON') ? 'green' : 'red'"
5

Hi,

Thanks for the reply @Sunny. This is what I have in my initial attempt as per the code in my first post. However, this yields the result seen in the attached screenshot. It evaluates correctly to green, but when it’s supposed to evaluate to red, something goes amiss.

1 Like
6

try:

color: "=(items[iPhonehenrik_Online].state === 'ON') ? 'green' : 'red'"
7

That resuls in an “Unexpected character error” and does not evaluate at all :frowning:

8

Hi Henrik,

could you try and add

on: true

to your config (same level where the color: is)

4 Likes
9

Hi Bob,

That worked wonders. May I ask what this function changes (to understand why it didn’t work in the first place)?

10

Hi Henrik,

sorry I should have elaborated a little more on it rather just dropping lines of code.
From my understanding a cell can have it’s own ON/OFF state. When it is on, the color in color: will be displayed, otherwise it will use the default color and ignore your setting.
Now, when you don’t explicitly define what the ON state of the cell is (i.e. no on: property) it must use the switch item as ON/OFF state. So in your case, when your item was OFF, the cell also was OFF and ignored your color setting.
Hope this explains it a little more?

Best,

Bob

2 Likes
11

i try also but the color still not change , have you a idea ? :
`

component: oh-label-card
config:
item: TestString
title: Result through Send widget
stateAsHeader: true
expandable: false
color: “=(items.BureauNinaHueSwitch.state == ‘ON’) ? ‘green’ : ‘red’”
on: true
label: “=(items.BureauNinaHueSwitch.state == ‘ON’) ? ‘Bureau Yes :-)’ : ‘Bureau No :-(’”
slots: null

`

thanks for yourt help

12

oh-label-cell not “oh-label-card”
I still have difficulty with the “card”, “cell”, 
 thanks anyway

13

Hello, I too am trying to set the color of a cell based on math

component: oh-label-cell
config:
  title: Solar Feed In
  item: Solar_FeedIn
  icon: oh:energy
  on: true
  color: '=(item[Solar_FeedIn].state < 3) ? "green" : "red"'
slots: null

I’d like the cell to be green if our FeedIn rate is above 3, and red if its below

Any tips? Thankyou

14

Widgets get their item data from the api, but there’s no initial parsing. Every state is a string, regardless of the type of the item. If you want a numerical comparison in your ternary statement, then you need to first parse that string into a number.

color: '=(Number.parseInt(item[Solar_FeedIn].state) < 3) ? "green" : "red"'
15

Thanks Justin, that unfortunately doesn’t display thew colors. Am I missing something else?

16

I have this in my Overview page:

component: oh-label-cell
config:
  expandable: false
  title: Power usage of house.
  icon: oh:energy
  item: Power_Watts
  footer: Live readings
  trendItem: Power_Watts
  stateStyle:
    color: "=Number.parseFloat(items.Power_Watts.state) >= 500 ? 'red' : 'green'"

It works for me.

1 Like
17

Thank you! that makes the text change color, but I was trying to color the entire cell. Definitely closer :smiley:

Is there any documentation on the expression function? Id love to be able check if the value is negative, then the Energy Export should be 0 and red, but if its positive, green!

18

Wouldn’t it be if it is less than zero then it is negative?

1 Like
19

This changes the background colour of the cell:

component: oh-cell
config:
  on: =Number.parseFloat(items.Power_Watts.state) >= 500
  color: "=Number.parseFloat(items.Power_Watts.state) >= 500 ? 'red' : 'green'"
  action: url
  actionModal: widget:Webpage display widget
  actionModalConfig:
    title: TV Guide
    URL: https://www.yourtv.com.au/guide/nownext/
    height: "600"
  header: TV Guide
  title: TV Guide
  icon: f7:tv
  actionUrl: https://www.freeview.com.au/tv-guide
slots: null

NOTE: If you have a trend line item in the cell then the colour will not change.

1 Like
20

OK Cool, sorted that.

Is there any real life examples of this Label/Label - expression? I’d like to change the label depending on the item state (if its greater than 0, Consuming, if its less than 0, feeding in to the grid)

Screenshot 2021-09-26 at 21-37-12 openHAB
Screenshot 2021-09-26 at 21-37-12 openHAB1033×903 9.59 KB