Humidity percent are not shown constant in Widget OH3

Release = Raspbian GNU/Linux 10 (buster)
Kernel = Linux 5.10.17-v7+
Platform = Raspberry Pi 3 Model B Rev 1.2
openHABian 3.1.0

Hello,
I am running into the same problem again and again.

I copied the design of my overview page from this shared post:

So I got for every room a widget which contains the temperature and also the humidity.
The overview page is displaying the humidity constant and correctly.

But, when I click on the Widget for example “Küche” there only will be sometimes the humidity displayed.


The ITEM for the humidity is the same, as I use for the overview page.

It is very confusing, cause sometimes (random) the humidity is shown in the widget.
I can’t figure out at which point this happens.
But at the moment it is working for the room “Wohnzimmer” which also has the same widgets.
So the widget should work too ?

Someone got a hint, why the percentage of the Humidity is randomly shown ?!
Item works correct and widget works sometimes ?

Code for widget “Temperatur”

uid: Cell_Temp_Card_1
tags: []
props:
  parameters:
    - description: Small title on top of the card
      label: Title
      name: title
      required: false
      type: TEXT
    - description: Icon on top of the card (only f7 icons (without f7:))
      label: Icon
      name: icon
      required: false
      type: TEXT
    - description: in rgba() or HEX or empty
      label: Background Color
      name: bgcolor
      required: false
      type: TEXT
    - context: item
      label: Current Temperature
      name: temp_item
      required: false
      type: TEXT
    - context: item
      label: Set Temperature
      name: set_temp_item
      required: false
      type: TEXT
    - context: item
      label: Current Humidity
      name: humidity_item
      required: false
      type: TEXT
    - context: item
      description: on/off item
      label: Heating control item
      name: heating_item
      required: false
      type: TEXT
  parameterGroups: []
timestamp: Jul 9, 2021, 10:18:59 AM
component: f7-card
config:
  style:
    noShadow: false
    padding: 0px
    border-radius: var(--f7-card-expandable-border-radius)
    box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.1)
    background-color: "=props.bgcolor ? props.bgcolor : ''"
    height: 120px
    margin-left: 5px
    margin-right: 5px
slots:
  content:
    - component: f7-block
      config:
        style:
          position: absolute
          top: -5px
          left: 16px
          flex-direction: row
          display: flex
      slots:
        default:
          - component: f7-icon
            config:
              f7: =props.icon
              size: 18
              style:
                margin-right: 10px
              visible: "=props.icon ? true : false"
          - component: Label
            config:
              text: "=props.title ? props.title : ''"
              style:
                font-size: 12px
                margin-top: 0px
    - component: f7-block
      config:
        style:
          position: absolute
          bottom: -20px
          left: 16px
          flex-direction: row
      slots:
        default:
          - component: Label
            config:
              text: "=items[props.temp_item].displayState ? items[props.temp_item].displayState : items[props.temp_item].state"
              style:
                font-size: 22px
                font-weight: 400
                margin-left: 0px
                margin-top: 0px
    - component: f7-block
      config:
        style:
          position: absolute
          bottom: -40px
          left: 12px
          flex-direction: row
          display: flex
      slots:
        default:
          - component: f7-icon
            config:
              f7: drop
              size: 18
              visible: "=props.humidity_item ? true : false"
          - component: Label
            config:
              visible: "=props.humidity_item ? true : false"
              text: =items[props.humidity_item].displayState
              style:
                font-size: 12px
                margin-left: 5px
                margin-top: 0px
    - component: f7-block
      config:
        style:
          position: absolute
          bottom: -63px
          left: 12px
          flex-direction: row
          display: flex
      slots:
        default:
          - component: f7-icon
            config:
              visible: "=props.heating_item ? true : false"
              f7: flame
              size: 18
          - component: Label
            config:
              visible: "=props.heating_item ? true : false"
              text: =items[props.heating_item].state
              style:
                font-size: 12px
                margin-left: 5px
                margin-top: 0px
    - component: oh-button
      config:
        visible: "=props.set_temp_item ? true : false"
        iconColor: red
        iconF7: arrow_up_circle
        iconSize: 35
        action: command
        actionItem: =props.set_temp_item
        actionCommand: =Number(items[props.set_temp_item].state.split(' ')[0]) + 0.5
        style:
          position: absolute
          top: 12px
          right: 10px
          height: 35px
          background: transparent
    - component: oh-button
      config:
        visible: "=props.set_temp_item ? true : false"
        iconColor: red
        iconF7: arrow_down_circle
        iconSize: 35
        action: command
        actionItem: =props.set_temp_item
        actionCommand: =Number(items[props.set_temp_item].state.split(' ')[0]) - 0.5
        style:
          position: absolute
          top: 74px
          right: 10px
          height: 35px
          background: transparent
    - component: Label
      config:
        visible: "=props.set_temp_item ? true : false"
        text: =items[props.set_temp_item].state
        style:
          font-size: 12px
          position: absolute
          right: 15px
          top: 50px
    - component: f7-block
      config:
        style:
          position: absolute
          top: 15px
          left: 15px
          width: "=props.set_temp_item ? 'calc(100% - 55px)' : '100%' "
          height: 120px
      slots:
        default:
          - component: oh-trend
            config:
              trendItem: =props.temp_item
              trendGradient:
                - "#aa2b1d"
                - "#cc561e"
                - "#ef8d32"
                - "#beca5c"
              style:
                --f7-theme-color-bg-color: transparent
                background: var(--f7-theme-color-bg-color)
                filter: opacity(30%)
                position: absolute
                width: 100%
                height: 100%
                top: 0px
                left: 0px
                z-index: 1
    - component: oh-link
      config:
        actionAnalyzerChartType: day
        action: analyzer
        actionAnalyzerItems: "=props.set_temp_item ? [props.temp_item, props.humidity_item, props.set_temp_item] : (props.humidity_item ? [props.temp_item, props.humidity_item] : [props.temp_item])"
        actionAnalyzerCoordSystem: time
        style:
          position: absolute
          left: 0px
          top: 0px
          height: 120px
          width: "=props.set_temp_item ? 'calc(100% - 55px)' : '100%' "

Have you tried to define displaystate for humidity item, or to change .displayState to .state?

1 Like