Number-item has no effect on f7 Progress Bar

Hi together,

I’m facing an issue, using the f7 progress bar.
I have created the item ‘runtimeProgress’ which is of the type ‘Number’, which contains the progress.
This progress I want to visualize in a widget as - exactly! - a progress bar.

Unfortuanetly, the progress bar is not working, using the item for the ‘progress’-item (which is not 0).

progress: =items.runtimeProgress.state

2021-09-10 17_00_20-openHAB

If I just type

progress: 26.888

Everything works fine.

Anyone has an idea?

uid: test
tags: []
timestamp: Sep 10, 2021, 4:52:17 PM
component: f7-card
config:
  noShadow: true
  outline: true
  noborder: true
slots:
  default:
    - component: f7-card-content
      slots:
        default:
          - component: f7-row
            slots:
              default:
                - component: f7-progressbar
                  config:
                    infinite: false
                    progress: =items.runtimeProgress.state
                    color: lightblue
                    style:
                      --f7-progressbar-height: 10px

All states arrive in the UI as strings. Did you need to parse it into a decimal?

1 Like

Yes, the property ‚progress‘ has to be a number.
How can I transform the Items value to a number in the Main UI?

progress: =Number.parseFloat(items.runtimeProgress.state)

if you want decimal places or

progress: =Number.parseInt(items.runtimeProgress.state)

if you prefer an integer value.

1 Like