Device.color tile docs

I’m tinkering with the Arduino shield, trying to get a color wheel to pick the color of the led. I’m able to get basic on/off working, and have a color wheel displayed using the code below. However, the Arduino is looking for RGB color values. The Philips Hue example only shows “setColor” getting Hue and Saturation. Is there a way to get RGB from the color picker, or am I going to have to figure out an HSV -> RGB conversion in groovy? If there was some documentation for device.color and setColor, I think I could figure it out…

controlTile("rgbSelector", "device.color", "color", height: 3, width: 3, inactiveLabel: false) {
		state "color", action:"setColor"
	}

def setColor(value) {
	log.debug "setColor: ${value.hue} and setSaturation: ${value.saturation}"
	zigbee.smartShield(text: "setColor:${value.hue},${value.saturation}").format()
}

Hey @danroot,

I use this line of code for the transformation:

hue = Math.min(Math.round(value.hue / 100.0 * 65535.0), 65535)

It seems to be accurate enough…

Eran.

I found some code to do the conversion…and then discovered that “value” has red, green, and blue properties on it. So no conversion is necessary. Documentation would have really saved me some time here.

Documentation would have really saved me some time here.

Agreed.

Documentation would have really saved me some time here.

ya…

Is there a way to use this to output hex values? (i.e. 0xFFFFFF for white)

@danroot @eran would you mind documenting what you did or giving code examples here? I too would like to use the color picker to send RGB values to the arduino for LED strips

1 Like

This is what I used. I think I based it on the Hue Bulb device type. You might wanna check that one out as well.

tiles {
    standardTile("switch", "device.switch", width: 1, height: 1, canChangeIcon: true) {
        state "on", label:'${name}', action:"switch.off", icon:"st.switches.switch.on", backgroundColor:"#79b821", nextState:"turningOff"
        state "off", label:'${name}', action:"switch.on", icon:"st.switches.switch.off", backgroundColor:"#ffffff", nextState:"turningOn"
        state "turningOn", label:'${name}', icon:"st.switches.switch.on", backgroundColor:"#79b821"
        state "turningOff", label:'${name}', icon:"st.switches.switch.off", backgroundColor:"#ffffff"
    }
    standardTile("refresh", "device.switch", inactiveLabel: false, decoration: "flat") {
        state "default", label:"", action:"refresh.refresh", icon:"st.secondary.refresh"
    }
    controlTile("rgbSelector", "device.color", "color", height: 3, width: 3, inactiveLabel: false) {
        state "color", action:"setColor"
    }
    controlTile("levelSliderControl", "device.level", "slider", height: 1, width: 2, inactiveLabel: false) {
        state "level", action:"setLevel"
    }
    valueTile("level", "device.level", inactiveLabel: false, decoration: "flat") {
        state "level", label: 'Level ${currentValue}%'
    }
    controlTile("saturationSliderControl", "device.saturation", "slider", height: 1, width: 2, inactiveLabel: false) {
        state "saturation", action:"setSaturation"
    }
    valueTile("saturation", "device.saturation", inactiveLabel: false, decoration: "flat") {
        state "saturation", label: 'Sat ${currentValue}    '
    }
    controlTile("hueSliderControl", "device.hue", "slider", height: 1, width: 2, inactiveLabel: false) {
        state "hue", action:"setHue"
    }
    valueTile("hue", "device.hue", inactiveLabel: false, decoration: "flat") {
        state "hue", label: 'Hue ${currentValue}   '
    }

    main(["switch"])
    details(["switch", "levelSliderControl", "rgbSelector", "refresh"])
}
1 Like

I’ll give this a whirl tonight!

controlTile(“rgbSelector”, “device.color”, “color”, height: 3, width: 3, inactiveLabel: false) {
state “color”, action:“setColor”
}

In your code, you have to change

action:"setColor"

to

action:"color control.setColor"

Then, setColor will be called with a color Map as an argument. The map looks like this:

[hex:#60fff6, red:96, green:255, blue:246, level:100, saturation:62.35294117647059, hue:49.05660377358491, alpha:1]

Remember to update your device after publishing. You have to log out of the mobile app and restart it.

I actually ended up doing a blog post including links to both the Device Type and SmartApp code on github:

Hopefully between what the others posted, and this, you can get what you need. One thing I learned after doing the post: The resolution of the shield’s RGB led is lower than the color picker. So, for example, you may give it RGB for orange, but the LED is pretty much indistinguishable from red or yellow (I forget which). Your led strings may vary, but just something to watch for.