there are multiple articles in this forum for the used f7-components - you also have tooltips in the editor for the most of the components and the configuration properties that each component have. Especially usefull for the oh-specific components as they might have additional settings that are not documented at a single place currently.
I mentioned some of these sources here, if you’re interested.
Image items does not populate the base64 encoded string they hold (only some basic information of the image-type and size will be returned) as their state. So accessing the state inside a css background-image won’t work.
AFAIK, the only way to access these encoded images dynamically from items, is to add the it to a image-component and call it via the ‘item’ config property.
@ysc Is there a reason why the string isn’t populated as item state? Maybe it’d be useful to make this encoded string available to reuse it in cases like this?!
Besides the messed up YAML structure (which is most likely related to the wrong code fence selection), you try to access the state of the item here and not the name of the item itself.
To get the item name from a prop, you have to do it this way:
Same thing as above - you’re trying to access the items state and not the item name itself.
It’s sufficient to use the item name here.
item: myKodi_ctp
I’d recommend you to have a look in the library of already created widgets and try to adapt what you see. Like Sonos player widget, Multiroom audio widget or Spotify widget as all of them uses the components that should suit your needs.
And I’ll try to come ahead of the question that might follow here…
It seems you wanna use this as a slider for the elapsed / remaining time of the media you’re playing (which is obviously dynamic for each movie) - to do so, you could try to grab the max config parameter dynamically.
You need at least the length of the movie (as well as the elapsed time here and set these as the max value, with something like:
I tried to put a star icon directly in front of the 7 (f7-icon) on the screenshot, in the widget editor it is suitable but not when I open it on the mobile phone or on the overview page.
I think that’s because of the position. but i don’t know how to adjust them.
then i use displaystate to show me the redesignd item with only one number after the point.
=items[props.rating].displayState
that works fine, until the rating is a 8.0 or 2.0 or 3.0 or 4.0. then the displaystate is empty only when the rating item has more then 2 numbers after the point it works.
exmaple, that works with displaystate
7.699999809265137
this doesnt works
8.0
here is a result of the rating item, when the rating is a for example 8.0
I think that’s how the implementation of the state handling for the image items is made, I suppose to avoid ending up with long base64 data in your logs, and the SSE connections, which isn’t ideal.