Basic Control Page, how to question

Trying to build a Control Page for the first time and successfully added a few buttons/controls. In the forums, I see examples of some dashboards.
Question, what do you create the skin or or overlay with (PSD, Key, ??) and how do you import that file?

In the directions I saw process for exporting but I don't have anything to export.

Thanks in advance.

Ignore. I figured how to import my artwork but it doesn't work the way I thought...it's a background vs an overlay.

Does anybody know of a tutorial (not the manual) video or written on control pages?

You can adjust the “zorder” of anything on the page to bring it forward/backwards.


Sent from my iPhone using Tapatalk Pro

howarth,
That did the trick!
Thanks!!!

Howarth, or anybody,

z-edit worked for the elements I added but I haven't been able to figure out how to get the background to be the 'foreground' with the various elements hidden behind. I was expecting that my background would have a z-order.

Here is how the background is set-up:

Howarth, or anybody,

z-edit worked for the elements I added but I haven't been able to figure out how to get the background to be the 'foreground' with the various elements hidden behind. I was expecting that my background would have a z-order.

Here is how the background is set-up:

The background is just that, a background.

What exactly are you trying to do because I’m confused!

You could have no background and just insert your ‘background’ as a static image that happens to be full screen, which will then have a z-order.

Peter


Sent from my iPhone using Tapatalk Pro

Peter,

Thanks for the help.

I'm trying to use the attached image as an overlay and then put the controls underneath (hidden).
You might have answered my question in that the background doesn't have an order. I'll try inserting it as an element and report back.

I inserted the background as a static image/caption. That got me to the next step (advance apologies for the NOOB questions):

1.) When I toggle a group of lights, some are out of sync. I also tried the online (true/false). Maybe the Action settings hold a solution.

2.) I created individual elements as an experiment (see attached), one of "ON" and the same for "OFF". I was trying to copy the on/off dots but couldn't figure out where the logic is to switch from one image to the other (I can see Green Dot and Green Dot+on).

Ignore #1...I think I figured out how to sync the lights in a group by using the "Match on state to device"

I spoke too soon.

5 lights for the hall: Hall Light Stairway Landing, Front Hall 1, Front Hall 2, Hall Color, Hall Ambiance.
First I turn on the Hall Light Stairway Landing light using the toggle on/off. Then setup a "match on state to device" and chose the other four lights.
The Hall Light Stairway Landing light is opposite when I execute.

They are all Hue lights, if that makes a difference... Maybe toggle and match don't work well for Hue lights.

Change Hall to Hall+ then set that as your state image.

You don’t need both images on your page, you just have Hall+ on your page which will change to Hall+on when the device is on.

You shouldn’t be needing or trying to hide things behind the background image you’ve shown above; whatever you’re trying sounds like a misunderstanding - which might be solved by what I’ve just said about + images?

(Note I reserve the possibility I’ve got my filenames wrong - someone will correct me if so - but the theory I’ve said is correct)

Peter


Sent from my iPhone using Tapatalk Pro

Apologies, I’ve just worked out what you’re after.

“All off” you’re wanting to be a touch-button that does something, and you’re hiding some device or something behind it that performs that action.

My version is that the text “All off” isn’t part of the image; change image to just the coloured boxes.

Then add a static text element in control panel that has a transparent background by its nature; make the text box as big as the coloured blob, and attach a server action to the text itself.

Peter


Sent from my iPhone using Tapatalk Pro

Peter, Many thanks!

Worked on it this AM. The transparent element suggestion works. I got around the "sync" issue by adding a delay of a second. I guess Indigo picks the actual "state" of the HW when using this command vs what "state" you've asked it to switch too.

I want to play around with the image changing based on the state of the device: "you just have Hall+ on your page which will change to Hall+on when the device is on."

I noticed that the elements that contain "element"+on are in the control directory. Is that where they I should place all of these "+on" that I create or does it matter?

ignore, found the documentation for creating images... that should do the trick.