@stevesell and others. Here’s another undocumented tip:
After creating your device type with the code to add your picture, and getting everything done to use your picture on the tile, did you know that you can then go back to ST’s default device type and not loose the picture?
I have no idea why that works, but it does. I’ve done that for every one of my switches and bulbs.
johnconstantelo
Trying to use the code you posted and get the following error when I try to creat a new device type any thoughts ?
Java.lang.IllegalArgumentException: Metadata definition not found
@hondohudson, I wouldn’t use the code posted above anymore because it’s pretty old and a lot has changed. Instead, create your own device type using ST’s default code and add “canChangeBackground: true” to standardTile, like this:
standardTile(“switch”, “device.switch”, width: 2, height: 2, canChangeIcon: true, canChangeBackground: true)
That should work for you. Happy New Year!
Im totally new. Where do I find ST’s default code for a ZWave switch ?
@hondohudson No problem Robert. Here’s a device type I created for a basic zwave switch that includes that line mentioned above. This will be a little easier for you since you’re just getting started.
To find the default code for ST’s devices (not all of them yet), there are basically 2 ways. One way is when modifying your existing code, look to the upper right part of the IDE where the simulator runs and you’ll see Device Type Templates. You can pick one from there, compare to yours, and/or overwrite your code. The other method is to create a new SmartDevice and when the next screen comes up, just select From Template.
Ok, now to the details:
Below is a link to my GitHub source code for a typical z-wave on/off switch. In the IDE, use that code to replace all the code in the device type you have already created. You can change the name I gave it - “My Switch - Normal On/Off”, or leave it as is. Save and then make sure to Publish for yourself. Next, change the device to make sure it’s using the device type you just updated.
Next, make sure you log out of the ST app and log back in, just to be safe. Go to your device in the app and just follow the steps in post 20 above. Make sure the image you want is on your phone somewhere, either locally or in a cloud-based tool. The app will ask you where to go look for the image you want.
Once you’ve added your image, I highly recommend going back to the IDE and changing the device back to the default device type from ST, in this case it would be Z-Wave Switch. You will not loose your image, and if ST changes anything you’ll always have the updates. That is exactly what I do for every switch I have, and it works perfectly.
Here is the source code. Click on that link and you can copy directly from code that come up, or click on Raw and just do ctrl-a and copy all at once:
https://github.com/constjs/SmartThings-Devices/blob/master/example_zwave_switch.device.groovy
Thank you - that’s great - got these done and found the default codes you mentioned. Got the switches working with text - now to fix my other devices.
Thanks for the detailed help.
@Ben: Is there a compelling reason to not have all Device Types (including all existing SmartThings Types) use “canChangeBackground: true” and “canChangeIcon: true” … please?
Perhaps there are some rare examples where the official trademarked image must be locked in place, but … well, I can’t even figure out why that would be necessary.
…CP / Terry.
I have followed the steps and have the option “Set Device Image”, but every time I choose an image from my library, it never takes. The “set device image” line blinks, but doesn’t show the custom icon. I used a PNG with a transparent background as instructed.
Any ideas?
I spoke too soon! I killed the app on my iPhone and then re-opened it then tried again. It worked that time. I guess I missed the step written above that says to close and re-open the app, eh… 
Great! I did it with a Wemo Light Switch and worked perfect!!!
Thanks
This is such a great tip… I used it to make custom icons including images of my real lamps and things, including a pressure mat which has no device type. Equipped with this tip and Photoshop there is no limit to how nice one can make the interface. The edit is quick so I won’t even mind updating if the core code changes later. Again, hopefully ST will include adding names as a feature later.
Thanks @kewashi. If you do modify one of ST’s core/standard device types, you can always go back to it after updating the device image in the app. I did that for all my zwave switches. Somehow your new image is preserved when going back to the standard device type.
I’ve been trying this, but when I set canChangeBackground: true, the background just changes to a faded window-screen style but doesn’t appear to have the uploaded image, even after killing the app on iOS and restarting it. See attached; the light on top is using the standard Z-Wave switch device type, the one on the bottom is using the custom one. I’ve included the modified device code; what am I missing?
metadata {
// Automatically generated. Make future change here.
definition (name: "Z-Wave Switch - Custom Icon", namespace: "jheffner", author: "SmartThings") {
capability "Actuator"
capability "Indicator"
capability "Switch"
capability "Polling"
capability "Refresh"
capability "Sensor"
fingerprint inClusters: "0x25"
}
// simulator metadata
simulator {
status "on": "command: 2003, payload: FF"
status "off": "command: 2003, payload: 00"
// reply messages
reply "2001FF,delay 100,2502": "command: 2503, payload: FF"
reply "200100,delay 100,2502": "command: 2503, payload: 00"
}
// tile definitions
tiles {
standardTile("switch", "device.switch", width: 2, height: 2, canChangeIcon: true, canChangeBackground: true) {
state "on", label: '${name}', action: "switch.off", icon: "st.switches.switch.on", backgroundColor: "#79b821"
state "off", label: '${name}', action: "switch.on", icon: "st.switches.switch.off", backgroundColor: "#ffffff"
}
standardTile("indicator", "device.indicatorStatus", inactiveLabel: false, decoration: "flat") {
state "when off", action:"indicator.indicatorWhenOn", icon:"st.indicators.lit-when-off"
state "when on", action:"indicator.indicatorNever", icon:"st.indicators.lit-when-on"
state "never", action:"indicator.indicatorWhenOff", icon:"st.indicators.never-lit"
}
standardTile("refresh", "device.switch", inactiveLabel: false, decoration: "flat") {
state "default", label:'', action:"refresh.refresh", icon:"st.secondary.refresh"
}
main "switch"
details(["switch","refresh","indicator"])
}
}
def parse(String description) {
def result = null
def cmd = zwave.parse(description, [0x20: 1, 0x70: 1])
if (cmd) {
result = createEvent(zwaveEvent(cmd))
}
if (result?.name == 'hail' && hubFirmwareLessThan("000.011.00602")) {
result = [result, response(zwave.basicV1.basicGet())]
log.debug "Was hailed: requesting state update"
} else {
log.debug "Parse returned ${result?.descriptionText}"
}
return result
}
def zwaveEvent(physicalgraph.zwave.commands.basicv1.BasicReport cmd) {
[name: "switch", value: cmd.value ? "on" : "off", type: "physical"]
}
def zwaveEvent(physicalgraph.zwave.commands.basicv1.BasicSet cmd) {
[name: "switch", value: cmd.value ? "on" : "off", type: "physical"]
}
def zwaveEvent(physicalgraph.zwave.commands.switchbinaryv1.SwitchBinaryReport cmd) {
[name: "switch", value: cmd.value ? "on" : "off", type: "digital"]
}
def zwaveEvent(physicalgraph.zwave.commands.configurationv1.ConfigurationReport cmd) {
def value = "when off"
if (cmd.configurationValue[0] == 1) {value = "when on"}
if (cmd.configurationValue[0] == 2) {value = "never"}
[name: "indicatorStatus", value: value, display: false]
}
def zwaveEvent(physicalgraph.zwave.commands.hailv1.Hail cmd) {
[name: "hail", value: "hail", descriptionText: "Switch button was pressed", displayed: false]
}
def zwaveEvent(physicalgraph.zwave.commands.manufacturerspecificv2.ManufacturerSpecificReport cmd) {
if (state.manufacturer != cmd.manufacturerName) {
updateDataValue("manufacturer", cmd.manufacturerName)
}
}
def zwaveEvent(physicalgraph.zwave.Command cmd) {
// Handles all Z-Wave commands we aren't interested in
[:]
}
def on() {
delayBetween([
zwave.basicV1.basicSet(value: 0xFF).format(),
zwave.switchBinaryV1.switchBinaryGet().format()
])
}
def off() {
delayBetween([
zwave.basicV1.basicSet(value: 0x00).format(),
zwave.switchBinaryV1.switchBinaryGet().format()
])
}
def poll() {
delayBetween([
zwave.switchBinaryV1.switchBinaryGet().format(),
zwave.manufacturerSpecificV1.manufacturerSpecificGet().format()
])
}
def refresh() {
delayBetween([
zwave.switchBinaryV1.switchBinaryGet().format(),
zwave.manufacturerSpecificV1.manufacturerSpecificGet().format()
])
}
def indicatorWhenOn() {
sendEvent(name: "indicatorStatus", value: "when on", display: false)
zwave.configurationV1.configurationSet(configurationValue: [1], parameterNumber: 3, size: 1).format()
}
def indicatorWhenOff() {
sendEvent(name: "indicatorStatus", value: "when off", display: false)
zwave.configurationV1.configurationSet(configurationValue: [0], parameterNumber: 3, size: 1).format()
}
def indicatorNever() {
sendEvent(name: "indicatorStatus", value: "never", display: false)
zwave.configurationV1.configurationSet(configurationValue: [2], parameterNumber: 3, size: 1).format()
}
def invertSwitch(invert=true) {
if (invert) {
zwave.configurationV1.configurationSet(configurationValue: [1], parameterNumber: 4, size: 1).format()
}
else {
zwave.configurationV1.configurationSet(configurationValue: [0], parameterNumber: 4, size: 1).format()
}
}Did you get any answer for this, seeing the same thing here, I change the image but it doesn’t show up in the ios app
This happened to me a few times too. To fix it I did the following. First change the canChangeIcon: to false. Then refresh the mobile app. Next load in a random image - something different than what you were trying to do initially. Refresh the app again. Next load in the image that you really want. I don’t know why this works but it does.
Here’s a screen shot of my icons after using this tip. This is why I believe it is worth the effort to figure this out. I made my icons using Photoshop… Note that when you do this, save the image as web in PNG format. Also make sure you leave room at the bottom for the OFF status by shifting the image upward. I like the blue better than the brown - will be changing those soon. And I tried using a photo for the Dinette and it just looks goofy, so that will get changed too.
Great job. I AGREE “I’d love for the ST developers to give us the option to select the device name or an icon”
Just learned this the other day, but ST already has this feature, all you have to do is shake your device and the icons change to the name. Shake again and they go back. The line wrapping could use some work, but its apparently been a feature for a while now.
Many people know about the shake option, but most people are still looking for permanent text display. The two are not equivalent in daily use.
the display after shake is too brief, especially once you have several dozen devices to scroll through. This is the most common issue.
the shake is physically difficult for many people. (I myself am quadriparetic with limited hand function. My phone is in a caddy. Works fine for touch and voice, no shake.)
OMG… I had no clue about the shake option, and as JD points out, shake isn’t for everyone. My wife would never do that - I can barely convince her to use the app at all instead of the minimote and the wall switches. Ther permanent image just makes it all that much more friendly. But it sure is cool to know about the shake option - I will use that for my thermostats which I haven’t figured out how to hack yet to show the name, the temp, and the set point all at once. Project for another day!!!
