Another question for developers. Code for default tile/value

i want to create a capability showing info like this

{
“id”: “alarmStatusPanel”,
“version”: 1,
“name”: "Alarm State,
“status”: “live”,
“attributes”: {
“armStatus”: {
“schema”: {
“type”: “object”,
“additionalProperties”: false,
“properties”: {
“value”: {
“type”: “string”,
“title”: “String”,
“enum”: [
“Disarmed”,
“Armed Stay”,
“Armed Away”,
“Unknown”
]
}
},
“required”: [
“value”
]
}
},

    "lastAlertType": {
        "schema": {
            "type": "object",
            "additionalProperties": false,
            "properties": {
                "value": {
                    "type": "string",
                    "title": "String".
                    "enum": [
                        "Smoke/CO2 Alert",
                        "Water Alert",
                        "IntrusionAlert",
                        "Unknown"
                    ]
                }
            },
            "required": [
                "value"
            ]
        }
    },

    "lastAlert": {
        "schema": {
            "type": "object",
            "additionalProperties": false,
            "properties": {
                "value": {
                    "type": "string",
                    "title": "String",
                    "maxLength": 150
                }
            }
        }
    },

    "statusText": {
        "schema": {
            "type": "object",
            "additionalProperties": false,
            "properties": {
                "value": {
                    "type": "string",
                    "title": "String",
                    "maxLength": 150
                }
            }
        }
    }




},
"commands": {

}

}

Capability: peaceparty20604.alarmstatuspanel

Attributes:
±--------------------------------+
¦ Name ¦ Type ¦ Setter ¦
±--------------±-------±-------¦
¦ armStatus ¦ string ¦ ¦
¦ lastAlert ¦ string ¦ ¦
¦ lastAlertType ¦ string ¦ ¦
¦ statusText ¦ string ¦ ¦
±--------------------------------+

C:\st>

Hi @Lgkahn,

The smartthings capabilities:presentation command is only for capabilities, if you add --help at the end you can get a brief description.

If you want to see the presentation of an existing device, you should consider to get the devices list through an API request, there, you can find a property “presentationId” and use it in the command to visualize it.

For the custom capabilities, I recommend you to focus in one functionality for each one of them, also, the setter command is used to change the value in the attribute, you can take switchLevel capability as an example

Hi @nayelyz,

If I have a DTH for a hub connected device that uses a predefined capability (illuminance) referenced in the document from your post #24, what is the proper way I should be calling that so that illuminance is the default instead of battery level? Since this is a predefined capability, do I still need to use the CLI to create my own VID?

I appreciate any help since I’m just now getting up to speed and I have a couple DTH’s used by the community that do not present the default tile as expected. Thanks!!!

im confused right above you told me to use this command to view a standard capabilities presentatin… or am i missing something

as i said i ran it for an existing capabliity ie contactsensor and i what comes back does NOT match when i am seeing on a deivce which is u sing this stock capability in the display

yes just follow that example that is exactly the same thing i did except my stock capablilty was temperature Measurement

aslo this appears to be unix as case matters

you also need to be using your own device handler or a copy of th estock one so that you can change the vid in the decice handler code in the last step to match your newly generated vid

Capabilities have their own presentations that define how they look when they are used as the status on the dashboard tile, as the action on the dashboard tile, as tiles on the detail pages, and in automations. You don’t need to worry about that here as that is already defined.

What you need to work with is the device config, which says which capabilities are to be used in the dashboard, details page and automations for anything using your device handler, and sometimes in what order.

This device config is combined with the info in the capability presentations, and probably some other fluff, to create a device presentation.

Prerequisites:

The UUID for your device handler as installed in your IDE. It is in the URL.
The CLI installed. Let’s call it ‘st’.

First you need to generate a default device config for your DTH, using the UUID of your device handler in the below.

st presentation:device-config:generate UUID --dth --output=config.json

The resulting config.json file is a ‘device config’. It describes at a macro level how you want your device handler to be presented. You need to edit it to make sure that illuminance is being used as the status in the dashboard tile. The bit you are interested in is near the top:

"dashboard": {
    "states": [
        {
            "component": "main",
            "capability": "illuminanceMeasurement",
            "version": 1,
            "values": [],
            "visibleCondition": null
        },
        {
            "component": "main",
            "capability": "battery",
            "version": 1,
            "values": [],
            "visibleCondition": null
        },
        {
            "component": "main",
            "capability": "configuration",
            "version": 1,
            "values": [],
            "visibleCondition": null
        },
        {
            "component": "main",
            "capability": "refresh",
            "version": 1,
            "values": [],
            "visibleCondition": null
        },
        {
            "component": "main",
            "capability": "sensor",
            "version": 1,
            "values": [],
            "visibleCondition": null
        },
        {
            "component": "main",
            "capability": "healthCheck",
            "version": 1,
            "values": [],
            "visibleCondition": null
        }
    ],

You want the first entry in the ‘states’ array to be your illuminance measurement. The other entries aren’t currently used by the app as dashboard tiles currently only support one state. When I tried it using what I think is your DTH it was already OK.

Now you need to create a device presentation that is based on the description in your potentially updated device config.

st presentation:device-config:create --input=config.json

   Basic Information
    ┌──────┬──────────────────────────────────────┐
    │ VID  │ a3fe3c0d-1f51-3d51-9309-566ba1219b4f │
    ├──────┼──────────────────────────────────────┤
    │ MNMN │ SmartThingsCommunity                 │
    ├──────┼──────────────────────────────────────┤
    │ Type │ dth                                  │
    └──────┴──────────────────────────────────────┘

8< SNIP 8<

Behind the scenes a perhaps surprisingly large JSON file has been created that is your 'device presentation`. You now need to tell your device handler to use that presentation by adding the VID and MNMN from the above (NOT from the config.json file). So for example:

definition (name: "My Xiaomi Mijia Smart Light Sensor", namespace: "jsconstantelos", author: "jsconstantelos", mnmn: "SmartThingsCommunity", vid: "a3fe3c0d-1f51-3d51-9309-566ba1219b4f")

The new app needs to load this presentation for each device that is using your device handler. This is on a twelve hour cache (apparently), so you may need to give it a nudge. You can clear the cache on the app and that is said to do the job, but I prefer to update the devices in the IDE (you’ll need to change the name or something to make it a proper update).

That should do it.

2 Likes

Thank you @orangebucket, you have been extremely helpful, as has @Lgkahn. Really appreciate the help!

1 Like

Hi @orangebucket,

That worked beautifully, thank you so much. Your VID example for my light sensor DTH helped me a lot, and it worked exactly the way I always wanted it to look in the new app. Now time to work on all my other DTH’s.

It’s contributions like yours that make this community a great and valuable source of information and help.

:clap: :trophy:

2 Likes

this is slightly wrong the correct command is this
C:\st>smartthings presentation:device-config:generate UUID --dth --output zooz4in1.json.orig -j

I pasted the actual command I used with the UUID masked. You don’t need the -j if the output file has the .json extension.

1 Like

Either way gave me the same results. What I’m starting to see is that I have one DTH I’m trying to work with and reorder tiles, but when I run create it doesn’t honor the changes I made in the json file. Driving me a bit nuts, so I think I’ll take a break for some lunch and try again later today.

im seeing the same thing… i just made changes and they are not being honored… i know the device type work as it is the same handler that is working fine in my other location… Maybe the shards are not communicting and updating today for some reason… I will also take a break and hope it updates later.

As a side note still havent found a display method or example just to display text or an enumeration type of states

1 Like

I’m not sure that the order of tiles is actually respected. I tend to see the switch capability displayed first and then hints of alphabetical order, with exceptions.

A lot seems to happen at the device plugin level that is undocumented. If you compare the capability presentations for the standard capabilities with what you actually get, they can be very different. For example temperature and humidity get merged into one tile and a link to graphs is provided. Then there are the Quick Controls for switches and buttons. Nothing in the API mentions such things. Nice features but they make a mockery of the API.

Hi @Lgkahn,

The parameter received in that command is the capability ID, the way you use it for contactSensor:

smartthings capabilities:presentation contactSensor -j

Before, I was referring to this one:

Here is an example analyzing a device I have installed:
I got the presentationId, Manufacturer name, and deviceId values from the devices list and used them as parameters to get the device presentation.


You can see in both the dashboard configuration. If you see differences, it can be due to the manufacturer.

Would you mind to please share your entire use case to help you implement it and guide you through the process?

ya, well that is the biggest issue . All our custom work for layout etc on the detail pages for devices is now in the #$itter. That is on the things I am pissed about. However, i understand because from a support standpoint it makes more sense to have a standard view of a device etc… I dont know why they couldnt of kept the detailed view however… oh well. So I assume you have changed the order the .json and it is not working?

I dont have a direct use case… I wanted to see the .json so I could see how a colored icon was displayed next to the status info. My case is above I posted the json but I will have to create custom attributes to display , alarm staate ie disarmed, armed away, armed stay, last alert type ie water, intrustion, smoke etc.
specifices about last alert, ie which sensor was triggered.

and a button to dismiss an alert (which turns off all notifications ie siren , colored lights etc.(

similiary to this device I have written for the old app

in addiition i have a device handler for the qubino weather station… currently the device is not even showing up under devices… Any idea why…Anyway here is the first part of the current code with tiles, that again will have to be all converted to custom capabilities

metadata {
definition (name: “Qubino Weatherstation V2”, namespace: “LGK-Apps”, author: “Kristjan Jamšek, kahn@lgk.com”) {
capability “Configuration” //Needed for configure() function to set MultiChannel Lifeline Association Set
capability “Temperature Measurement” //Used on main tile, needed in order to have the device appear in capabilities lists, mirrors temperatureCh1 attribute states
capability “Relative Humidity Measurement” //Needed in order to have the device appear in capabilities lists, mirrors humidityCh1 attribute states
capability “Sensor” // - Tagging capability
capability “Health Check”

	attribute "temperatureCh1", "number" // temperature attribute for Ch1 Temperature reported by device's endpoint 1
	attribute "windDirection", "number" // wind direction attribute for Wind Gauge - Direction reported by device's endpoint 2
	
	attribute "windVelocity", "number" // wind velocity attribute for Wind Gauge - Velocity reported by device's endpoint 3
	attribute "windGust", "number" // wind gust velocity attribute for Wind Gauge - Wind gust reported by device's endpoint 4
	attribute "windTemperature", "number" // wind temperature attribute for Wind Gauge - Temperature reported by device's endpoint 5
	attribute "windChillTemperature", "number" // wind chill temperature attribute for Wind Gauge - Wind Chill reported by device's endpoint 6
	attribute "rainRate", "number" // rain rate attribute for Rain Sensor data reported by device's endpoint 7
	attribute "humidityCh1", "number" // humidity attribute for Ch1 Humidity reported by device's endpoint 8
	attribute "temperatureCh2", "number" // temperature attribute for Ch2 Temperature reported by device's endpoint 9
	attribute "humidityCh2", "number" // humidity attribute for Ch2 Humidity reported by device's endpoint 10
	
	attribute "setConfigParams", "string" // attribute for tile element for setConfigurationParams command
	attribute "setAssocGroups", "string" // attribute for tile element for setAssociations command
	
    /* lgk last update times. */
    attribute "lastUpdateWind", "string"
	attribute "lastUpdateCh1", "string"
	attribute "lastUpdateCh2", "string"
	attribute "lastUpdateRain", "string"
    
    attribute "windMaxDate", "string"
	attribute "tempMaxDate", "string"
	attribute "tempMinDate", "string"
	attribute "rainMaxDate", "string"
    
    attribute "maxOutdoorTemp", "number"
	attribute "minOutdoorTemp", "number"
    attribute "maxRain", "number"
    attribute "maxWindGust", "number"
    
    attribute "windMaxDateStr", "string"
	attribute "tempMaxDateStr", "string"
	attribute "tempMinDateStr", "string"
	attribute "rainMaxDateStr", "string"

	command "setConfigurationParams" // command to issue Configuration Set command sequence according to user's preferences
	command "setAssociations" // command to issue Association Set command sequence according to user's preferences
	command "resetMaxMin" // lgk reset them

    fingerprint mfr:"0159", prod:"0007", model:"0053"  //Manufacturer Information values for Qubino Weatherstation
}


simulator {
	// TESTED WITH PHYSICAL DEVICE - UNNEEDED
}

tiles(scale: 2) {
	multiAttributeTile(name:"temperature", type:"generic", width:6, height:4, canChangeIcon: false) {
		tileAttribute("device.temperature", key: "PRIMARY_CONTROL") {
			attributeState("default", label:'${currentValue} °F', unit: "°F", icon: "st.Weather.weather2",
                 backgroundColors:[
            	[value: 1,  color: "#c8e3f9"],
            	[value: 10, color: "#dbdee2"],
            	[value: 20, color: "#c0d2e4"],
				[value: 32, color: "#153591"],
				[value: 44, color: "#1e9cbb"],
				[value: 59, color: "#90d2a7"],
				[value: 74, color: "#44b621"],
				[value: 84, color: "#f1d801"],
                [value: 92, color: "#d04e00"],
				[value: 98, color: "#bc2323"]
		])
        }
         tileAttribute("device.windChillTemperature", key: "SECONDARY_CONTROL") {
			attributeState("default", label:'Wind Chill ${currentValue} °F', unit:"°F")
            }
	
    }   

/*
tiles(scale: 2) {
	valueTile("temperature", "device.temperature") {
		state("temperature", label:'${currentValue} °F', unit:"°F", icon: "st.Weather.weather2", backgroundColors: [
		 	// Celsius Color Range
			[value: 0, color: "#153591"],
			[value: 7, color: "#1e9cbb"],
			[value: 15, color: "#90d2a7"],
			[value: 23, color: "#44b621"],
			[value: 29, color: "#f1d801"],
			[value: 33, color: "#d04e00"],
			[value: 36, color: "#bc2323"],
			// Fahrenheit Color Range
			[value: 40, color: "#153591"],
			[value: 44, color: "#1e9cbb"],
			[value: 59, color: "#90d2a7"],
			[value: 74, color: "#44b621"],
			[value: 84, color: "#f1d801"],
			[value: 92, color: "#d04e00"],
			[value: 96, color: "#bc2323"]
		])
	}
    */
 
	valueTile("humidity", "device.humidity") {
		state("humidity", label:'${currentValue} %', unit:"%", display:false)
	}	
    
	standardTile("temperatureCh1", "device.temperatureCh1", width: 3, height: 2) {
		state("temperatureCh1", label:'Temp. Ch1:\n${currentValue} °F', unit:'°F', icon: 'st.Weather.weather2',
        	backgroundColors:[
            	[value: 1,  color: "#c8e3f9"],
            	[value: 10, color: "#dbdee2"],
            	[value: 20, color: "#c0d2e4"],
				[value: 32, color: "#153591"],
				[value: 44, color: "#1e9cbb"],
				[value: 59, color: "#90d2a7"],
				[value: 74, color: "#44b621"],
				[value: 84, color: "#f1d801"],
                [value: 92, color: "#d04e00"],
				[value: 98, color: "#bc2323"]

			])
	}
	standardTile("windDirection", "device.windDirection", width: 3, height: 2) {
		state("windDirection", label:'Wind Dir.:\n${currentValue}', unit: "", icon: 'st.Outdoor.outdoor20')
	}

	standardTile("windVelocity", "device.windVelocity", width: 3, height: 2) {
		state("windVelocity", label:'Wind Vel.:\n${currentValue} mph', unit:"mph", icon: 'st.Weather.weather1',
          backgroundColors: [
        	[value: 0, color: "#90d2a7"],
			[value: 5, color: "#44b621"],
			[value: 10, color: "#f1d801"],
			[value: 20, color: "#d04e00"],
			[value: 30, color: "#bc2323"]
            ]
            )
	}
	
	standardTile("windGust", "device.windGust", width: 3, height: 2) {
		state("windGust", label:'Wind Gust:\n${currentValue} mph', unit:"mph", icon: 'st.Weather.weather1',
        backgroundColors: [
        	[value: 0, color: "#90d2a7"],
			[value: 5, color: "#44b621"],
			[value: 10, color: "#f1d801"],
			[value: 20, color: "#d04e00"],
			[value: 30, color: "#bc2323"]
            ]
            )
	}
	standardTile("windTemperature", "device.windTemperature", width: 3, height: 2) {
		state("windTemperature", label:'Outdoor Temp.\n${currentValue} °F', unit:'°F', icon: 'st.Weather.weather2',
     backgroundColors:[
            	[value: 1,  color: "#c8e3f9"],
            	[value: 10, color: "#dbdee2"],
            	[value: 20, color: "#c0d2e4"],
				[value: 32, color: "#153591"],
				[value: 44, color: "#1e9cbb"],
				[value: 59, color: "#90d2a7"],
				[value: 74, color: "#44b621"],
				[value: 84, color: "#f1d801"],
                [value: 92, color: "#d04e00"],
				[value: 98, color: "#bc2323"]

			])   
	}
	standardTile("windChillTemperature", "device.windChillTemperature", width: 3, height: 2) {
		state("windChillTemperature", label:'Wind Chill:\n${currentValue} °F', unit:'°F', icon: 'st.Weather.weather2',
        backgroundColors:[
            	[value: 1,  color: "#c8e3f9"],
            	[value: 10, color: "#dbdee2"],
            	[value: 20, color: "#c0d2e4"],
				[value: 32, color: "#153591"],
				[value: 44, color: "#1e9cbb"],
				[value: 59, color: "#90d2a7"],
				[value: 74, color: "#44b621"],
				[value: 84, color: "#f1d801"],
                [value: 92, color: "#d04e00"],
				[value: 98, color: "#bc2323"]

			])
	}
	standardTile("rainRate", "device.rainRate", width: 3, height: 2) {
		state("rainRate", label:'Rain: ${currentValue} inches/h', unit:"inches/h", icon: 'st.Weather.weather10')
	}
	standardTile("humidityCh1", "device.humidityCh1", width: 3, height: 2) {
		state("humidityCh1", label:'Hum. Ch1:\n${currentValue} %', unit:"%", icon: 'st.Weather.weather12',
          backgroundColors : [
                [value: 01, color: "#724529"],
                [value: 11, color: "#724529"],
                [value: 21, color: "#724529"],
                [value: 35, color: "#44b621"],
                [value: 49, color: "#44b621"],
                [value: 50, color: "#1e9cbb"]
     ]        
     )	}
	standardTile("temperatureCh2", "device.temperatureCh2", width: 3, height: 2) {
		state("temperatureCh2", label:'Temp. Ch2:\n${currentValue} °F', unit:'°F', icon: 'st.Weather.weather2',
        	backgroundColors:[
            	[value: 1,  color: "#c8e3f9"],
            	[value: 10, color: "#dbdee2"],
            	[value: 20, color: "#c0d2e4"],
				[value: 32, color: "#153591"],
				[value: 44, color: "#1e9cbb"],
				[value: 59, color: "#90d2a7"],
				[value: 74, color: "#44b621"],
				[value: 84, color: "#f1d801"],
                [value: 92, color: "#d04e00"],
				[value: 98, color: "#bc2323"]

			])
	}
	standardTile("humidityCh2", "device.humidityCh2", width: 3, height: 2) {
		state("humidityCh2", label:'Hum. Ch2:\n${currentValue} %', unit:"%", icon: 'st.Weather.weather12',\
          backgroundColors : [
                [value: 01, color: "#724529"],
                [value: 11, color: "#724529"],
                [value: 21, color: "#724529"],
                [value: 35, color: "#44b621"],
                [value: 49, color: "#44b621"],
                [value: 50, color: "#1e9cbb"]
     ] )
	}
    
    // lgk reset max/min
    
    standardTile("resetMaxMin", "device.resetMaxMin", decoration: "flat", width: 2, height: 2) {
		state("resetMaxMin", label:'reset Max/Min', action:'resetMaxMin', icon: "st.secondary.tools")
	}
	standardTile("setConfigParams", "device.setConfigParams", decoration: "flat", width: 2, height: 2) {
		state("setConfigParams", label:'Set configuration', action:'setConfigurationParams', icon: "st.secondary.tools")
	}
	standardTile("setAssocGroups", "device.setAssocGroups", decoration: "flat", width: 2, height: 2) {
		state("setAssocGroups", label:'Set associations', action:'setAssociations', icon: "st.secondary.tools")
	}
	
    
    
        // lgk main max
     
        valueTile("maxWindGust", "device.maxWindGust", width: 3, height: 1) {
        state "default", label: 'Max Wind Gust:\n ${currentValue} mph' }
     
        valueTile("maxOutdoorTemp", "device.maxOutdoorTemp", width: 3, height: 1) {
        state "default", label: 'Max Outdoor Temp:\n ${currentValue} °F' }
  
        valueTile("minOutdoorTemp", "device.minOutdoorTemp", width: 3, height: 1) {
        state "default", label: 'Min Outdoor Temp:\n ${currentValue} °F' }
        
        valueTile("maxRain", "device.maxRain", width: 3, height: 1) {
        state "default", label: 'Max Rain:\n ${currentValue} inches/h' }
        
        
    	// lgk status tiles
    	valueTile("windMaxDate", "device.windMaxDate", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Date/Time:\n ${currentValue}'
				}
    	valueTile("tempMaxDate", "device.tempMaxDate", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Date/Time:\n ${currentValue}'
				}
    	valueTile("tempMinDate", "device.tempMinDate", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Date/Time:\n ${currentValue}'
				}
        valueTile("rainMaxDate", "device.rainMaxDate", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Date/Time:\n ${currentValue}'
				}
                
                 	// lgk status tiles
    	valueTile("windMaxDateStr", "device.windMaxDateStr", width: 3, height: 1, decoration: "flat") {
		state "default", label: '${currentValue}'
				}
    	valueTile("tempMaxDateStr", "device.tempMaxDateStr", width: 3, height: 1, decoration: "flat") {
		state "default", label: '${currentValue}'
				}
    	valueTile("tempMinDateStr", "device.tempMinDateStr", width: 3, height: 1, decoration: "flat") {
		state "default", label: '${currentValue}'
				}
        valueTile("rainMaxDateStr", "device.rainMaxDateStr", width: 3, height: 1, decoration: "flat") {
		state "default", label: '${currentValue}'
				}
    
    
    // lgk status tiles
    	valueTile("statusWind", "device.lastUpdateWind", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Wind Last Update: ${currentValue}'
				}
    	valueTile("statusCh1", "device.lastUpdateCh1", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Ch1 Last Update: ${currentValue}'
				}
    	valueTile("statusCh2", "device.lastUpdateCh2", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Ch2 Last Update: ${currentValue}'
				}
        valueTile("statusRain", "device.lastUpdateRain", width: 3, height: 1, decoration: "flat") {
		state "default", label: 'Rain Last Update: ${currentValue}'
				}
    
	main("temperature")
	
	details(["temperatureCh1", "humidityCh1", "temperatureCh2", "humidityCh2","windDirection", "windVelocity", "windGust", "windTemperature", 
        "windChillTemperature", "rainRate", "tempMinDateStr", "tempMaxDateStr", "windMaxDateStr", "rainMaxDateStr",
        "statusCh1", "statusCh2", "statusWind", "statusRain", "resetMaxMin","setConfigParams", "setAssocGroups"])

}

also using the smart weather station tile default device type in your list… it is not working correctly in the new app, detail view only shows temp, humidity and illumniation and uv index. there is tons more info on the view in the old app that needs to be converted…

ie

Vs

They already have and it worked before, but there are some issues with displaying all custom capabilities at the moment.

1 Like

@Lgkahn is your new dth psted anywhere?