How to show dashboard with device info page in smartapp


(Ravi Dubey) #1

Hi,

Myself Ravi Dubey & I am new in ST SmartApp development. I am currently developing a App which works with thermostat & temperature sensors.
I am confused how to create a main page which shows current state of thermostat & other device status. Kind of dashboard. is it really possible or not?

Regards,
RD


(ActionTiles.com co-founder Terry @ActionTiles; GitHub: @cosmicpuppy) #2

There may be various opinions and recommendations, but mine is that SmartApps have very limited UI at this time.

So you should create a Device Type for a custom virtual device, to be the UI for your SmartApp.

You can have as many custom Attributes, Commands and sub-tiles as you need to have your SmartApp(s) use it to display the information you describe.


(Mike Maxwell) #3

This can be done currently using dynamic pages, then inserting the output in a paragraph element. Currently there isn’t a simple way (if in fact any way), of using device icons within a smart app.
So text yes, multi state icons, not so much…


(Kevin) #4

If you’re referring to displaying images based on device state, I’m pretty sure I accomplished that with my Simple Device Viewer SmartApp.


(Ravi Dubey) #5

Thanks Mike for your reply. I will try creating dynamic pages. But I hope we will get some way in future where we can integrate icons as well within layout.


(Ravi Dubey) #6

Thanks a lot Kevin. I will look into your app. I am sure it will be great help for me. again, thanks a ton.

Regards,
RD.


(Ravi Dubey) #7

Hi tgauchat,

Developing a Device Types will be really costly deal just to show a device status on a page. I will see if I can achieve this by creating a Dynamic pages & inserting a output in paragraph as suggested by Kevin.

Regards,
RD


(Kevin) #8

I created custom icons, but you can use the built-in SmartThings icons by their full url.

You can find a list of the icons here and here.

I’ve received a report that my SmartApp does’t work on Windows Phone, but I’m still trying to figure out if it is just the one user or all Windows Phone users. I don’t have a Windows Phone so it’s been difficult to troubleshoot.


(ActionTiles.com co-founder Terry @ActionTiles; GitHub: @cosmicpuppy) #9

If a SmartApp is sufficient, the certainly avoid the DTH. But using a DTH is a better fit in some situations, and not much more work; it’s just code in a different place.


(Ravi Dubey) #10

Hi Kevin,

Thanks for details. Can you share your github URL of your app plz.

Regards,
RD


(Kevin) #11

It’s in the top post of page that my first post on this topic linked to.


(Ravi Dubey) #12

Thanks Kevin. I created the mockup but I am facing issue while showing image in paragraph. I am trying to create paragraph for each switches with their status, but image is not getting displayed in simulator. Though I have not tried it in mobile. What could be the issue.
ie.
paragraph image: “https://s3.amazonaws.com/smartapp-icons/Convenience/Cat-Convenience.png”,
title: “paragraph title”,
"Swtich 1 is On "

Secondly, can we create a page which will be shown default for our app, rather than clicking Gear menu and open dynamic preference page. Just a thought!

Regards,
RD


(Kevin) #13

Unless you’re creating a simple SmartApp, the simulator is basically useless.

I’ve found it a lot less frustrating to just install the app in order to test it.


(Kevin) #14

SmartApps don’t have a gear, the dynamic page is the first thing you see when the SmartApp opens… If you’re creating a Device Handler, dynamic pages won’t work so you should just use the tiles.

Have you viewed my SmartApp on your phone?

Also, the only way to change the icons is to reload the dynamic page so if you’re viewing the dynamic page and a light turns on, the user won’t see the new image unless they leave that page and come back to it.

If you want to be able to see things change in real-time, you should create a virtual Device Handler instead of a SmartApp, like @tgauchat recommended.


(Ravi Dubey) #15

Yes Kevin, you are right. The image is coming fine in mobile app rather than simulator.
I am looking to develop page like below. Do I need to develop using Device Handler or it is possible using SmartApp. I am willing to escape device handler development for such a small thing.


(Kevin) #16

If those toggle switched are images, yes you can do something similar with a SmartApp, but the images would appear on the left and there would be an arrow on the right. When you press the item, it would also have to load another page.

The screenshot below is what mine looks like, but if you install it you can see it works.


(Ravi Dubey) #17

Right, but I am looking to turn on/off the light tapping on it rather than opening a page.


(Kevin) #18

Tapping mine toggles the light, but the only way I was able to do that was to have it take you to a confirmation page.

If you want it to act like a true dashboard you will have to create a device handler. Device handlers can’t use multiple devices so the only way to do that is to also use a smart app that passes the device handler the data.

Out of curiosity, why are you reinventing the wheel? It sounds like my Smart App and SmartTiles can already do what you’re trying to do.


(Ravi Dubey) #19

I was new to this things, so was trying couple of things. But my main objective is to build a iOS app which will be external application and interacts with devices that user have using API. I will start developing Smart API app tomorrow and expose the endpoints. But just have one doubt, will Smart API app will react to events ? like start thermostat cooling if temperature reaches to 70 F. I know I will get devices, can command it (on/off etc) from external application to smart devices that user has configured. But what reacting on events?


(Kevin) #20

I haven’t had a chance to play around with web service SmartApps yet so I can’t provide any information for what you’re trying to do.