Adding a State to an Event

You can program a button on your interface to change its appearance according to the State of a device. Elements of the button appearance that can be changed include: text, color, text bolding and button image.

This article explains the procedure of configuring a button to change its appearance using the Mute state of a device as an example.

Page Setup

• Launch into the Builder of your controlled space.
• Make sure devices are imported.
• Make sure buttons are added to a page.

Adding States to the Button

1. Double click the button to which you would like to add the state based change.
2. Select your device from the Devices tab in the right pane. For this example, we are using an Onkyo receiver.
3. Select the Category type. For this example, select Volume.
4. Drag the relevant Command to the center pane. For this example, select Mute Toggle.
5. Scroll below the Commands list in the Devices tab to the list of States.
6. Stay within the selected Category and drag the relevant State (for this example, the Mute state) to the center pane section where the following words are displayed: “Drop state here to add Event”.
   A popup window opens.
   In the example of the Mute Toggle Command, the popup shows a dialogue asking what zone is being controlled with this button and which State we are tracking.
   Do one of the following:
   • Select a single state to track. OR
   • Add multiple States to a single button and use conditional logic to track multiple states. See the next section below.

Event 1 is added under the button action in the center pane.

Adding Substitutions via Conditional Logic

If you added an unspecified event to your button, follow the steps below to add conditional logic.

Adding the First Part of the IF Statement

1. Click the + icon in the event section.
2. Select the Conditional option.
3. Drag the relevant State from the Devices tab to the IF statement in the Event.
   In our example, drag the Mute state from the Onkyo device. This is the same state you added to the event field of the button.
   The Add State Expression window opens.
4. From the Operator field, select “=” (equals) or “!=” (does not equal).
   For our example, use “=” (equals).
5. Select the relevant option from the Value field.
   In our example there are two options Mute On and Mute Off. Select Mute On for the IF statement.
6. Click the + icon in the Event section of the center pane and select the Update property option.
7. Select the Target property from the Properties window.
   In our example, select the Image property.
8. Deselect the option to use State Value.
9. Drag the relevant image from the right pane to the Update property portion of the IF statement.
   This image now appears when the State of your device matches your Conditional statement.
   In our example, this is the image shown when the Mute State = Mute On.

Adding the Second Part of the IF Statement

1. Click the + next to the first part of the IF statement that you created in the section above.
2. Add ELSEIF.
3. Drag the relevant State from the right pane to your IF statement.
   Use the same State as the IF statement. In our example use the Mute State.
4. Make sure the ELSEIF statement is selected in the Event section, and click the + sign in the Event section of the center pane.
5. Select the Add update property option.
6. Select the Target property from the Properties window.
   In our example, select the Image property.
7. Deselect the option to use State Value.
8. Drag the relevant image from the right pane to the Update property portion of the ELSEIF statement.
   This image now appears when the state of your device matches your Conditional statement.
   In our example, this is the image shown when the Mute State = Mute Off.

IF your device has more possible states than two, repeat the above steps to create your ELSEIF statements for all possibilities

Copyright © 2024 Kramer — Powered by