MQTT - Colorpicker - where to find a good example with explanation?

[Apollo42 (Marko Wurfel)]

• Platform information:
  • openHAB version: running docker container openhab/openhab:3.2.0
• Issue of the topic:

I added a zigbee RGB spot light by zigbee2mqtt.
Here a link to all the MQTT topics: Lidl HG06106A control via MQTT | Zigbee2MQTT

I am having troubles with configuring the color. (I know the LED has the colorspace CIE 1931 which means I need to add some kind of transformation from the RGB values to the colorspace of the device. But I am not even able to create a proper configuration which could send simple RGB colors to any device.)

I would have expected the integration of a RGB LED would be quite easy and the internet would be full with good examples.
But the stuff I am finding is not really helping me:

• sitemap: Sitemaps | openHAB
  • ok, this is easy.
    Colorpicker item=LR_LEDLight_Color label="LED Light Color" icon="colorwheel"
    But what kind of thing configuration do I need to receive/send the commands?
• I found a component which is kind of useless for me because I do not know what this is.
  oh-colorpicker-item - Color Picker List Item | openHAB
  I guess this is a custom thing you can install additionally if you do not like the preinstalled colorpicker? In this case I prefer to stick to the most simple configuration of the colorpicker at the moment.
• Old forum discussion: Colorpicker and Color item Pushstart (Please help)
  But I cannot see anything useful for me.
• Even older post which is probably not even working in OH3?
  Colorpicker List Item with separate items for OnOff and Power

I appreciate every useful link or sample to learn how to add a LED RGB light with MQTT to OpenHAB.

• Please post configurations (if applicable):
  • Items configuration related to the issue

    Switch    HG06106A_State          "State"                         (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:StateGet"}
    Number    HG06106A_Brightness     "Brightness"                    (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:Brightness"}
    Number    HG06106A_ColorTemp      "ColorTemp"                     (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:ColorTemp"}
    Number    HG06106A_ColorX         "ColorX"                        (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:ColorX"}
    Number    HG06106A_ColorY         "ColorY"                        (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:ColorY"}
    Number    HG06106A_Effect         "Effect"                        (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:Effect"}
    Number    HG06106A_Linkquality    "Linkquality [%d / 255 LQI]"    (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:Linkquality"}
    Number    HG06106A_Transition     "Transition"                    (zigbee)    {channel="mqtt:topic:zigbee:Lidl_GU10_HG06106A:Transition"}
    

  • Things configuration related to the issue

    Thing mqtt:topic:zigbee:Lidl_GU10_HG06106A "Livarno Lux GU10 spot RGB" (mqtt:broker:myMQTTBroker) @ "TODO" {
        Channels:
            Type switch : StateGet          [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.state", on="ON", off="OFF"]
            Type number : Brightness        [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.brightness"]
            Type number : ColorTemp         [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.color_temp"]
            Type number : ColorX            [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.color_xy.x"]
            Type number : ColorY            [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.color_xy.y"]
            Type number : Effect            [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.effect"]
            Type number : Linkquality       [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.linkquality"]
            Type number : Transition        [stateTopic="zigbee2mqtt/XX", transformationPattern="JSONPATH:$.transition"]
    }
    

  • Sitemap configuration related to the issue

    sitemap mqtt_zigbee2mqtt_GU10 label="mqtt_zigbee2mqtt_GU10" {
      // device specific properties
      Switch item=HG06106A_State icon="light"
      Text item=HG06106A_Brightness
      Text item=HG06106A_ColorTemp
      Text item=HG06106A_ColorX
      Text item=HG06106A_ColorY
      Text item=HG06106A_Effect
      Text item=HG06106A_Transition
    
      // Diagnostics
      Text item=HG06106A_Linkquality icon="qualityofservice"
    }
    

  • Rules code related to the issue
    nothing yet
  • Services configuration related to the issue
    addons.cfg

    binding = mqtt
    transformation = jsonpath
    

[rossko57]

@Apollo42

sitemap:

Are you viewing this sitemap in an app, or in BasicUI?
Sitemaps don’t have anything to do with the usual beginners starting point, the main admin GUI,“MainUI”.

@Apollo42

I found a component which is kind of useless for me because I do not know what this is.

Aha, now this gets used in MainUI. So, either/or, which are you working with?

@Apollo42

But what kind of thing configuration do I need to receive/send the commands?

Yes, you will need a Thing configuration.
I suspect some openHAB basics have gone over your head until now.

Items are the heart of openHAB, idealized models of simple devices.
In this context, all Color type Items are alike - RGB,HSV,LED,zwave,MQTT all make no difference.

Because they’re all alike, we can use consistent UIs with these Items. And there is a choice of UIs.
To use a UI widget, just click it, it sends an idealized standard command to the idealized standard Item.

Then Things and channels come into play - Things are a rough model of someexternal device or service. Channels link the Thing to Items, perhaps many Items with different properties. Things and channels are configured to matc the real-world variables and weirdness to the standard model Item. So here is where RGB mode, or HSV mode etc. become important.
So Thing and channel settings decide how and where the standard command gets converted to bits and bytes and sent over wire or radio or whatever the real technology is.

From the above you can see that MQTT and Colorpicker widget have no direct relationship at all.
Make a Colorpicker work with a Color Item? Sure, works out of the box. How to set up is dependent on the UI that you choose.

Important limitation here though - colorpickers, like a slider, require a sensible starting point. Might not work, might not even be visible if your linked Color Item has not got an initial value, from device, or by other intervention.

Something you might gather from the above … “but I haven’t got a Color type Item!”. Yep, that’s your problem. You cannot use the standard colorpicker with a collection of Number Items, with different colour components

Your MQTT settings don’t look silly, but not enough to say if they suit the real device. They certainly don’t suit a Color Item.
What you need to do is combine the incoming MQTT data elements into a single color channel.
Might help-

Mqtt color xy brightness

You could use zigbee2mqtt’s “experimental” feature “attribute_and_json”. Then send commands for colorXY and brightness in two separate channels. This allows to use a dimmer channel for brightness, where you can set minimum and maximum value. This is how I configured my lamp (Aldi brand): UID: mqtt:topic:mqtt_raspberry:ZigbeeRGBLight01 label: ZigbeeRGBLight01 thingTypeUID: mqtt:topic configuration: {} bridgeUID: mqtt:systemBroker:mqtt_raspberry location: Bedroom channels: - id: power chan…

otherwise you might need a transformation to assemble x y b values into one.

Once your Item state is updating correctly, then worry about colorpickers.

To get colorpicker generated commands out to MQTT, this looks useful

OH3 zigbee2mqtt Livarno Lux work in progress

Hello, I bought the Lidl HG06106C Livarno Lux E27 bulb RGB…and I think I found an easier way to control it with the Zigbee2MQTT. In MQTT Command Topic, we have to indicate the path zigbee2mqtt/FRIENDLY_NAME/set/color. Then if we choose CIE mode xyY (x, y, Brightness), in the Outgoing Value Format we have to put {“x”:%s, “y”:%s}. If we choose RGB mode (Red, Green, Blue) we have to put {“rgb”:"%s,%s,%s"} or {“r”:%s,“g”:%s,"b ":%s}.