New Developer Feature – Hide Preference When Empty

  1. Home
  2. /
  3. New Features
  4. /
  5. New Developer Feature – Hide Preference When Empty
Screen Shot 2016-08-05 at 1.26.45 PM

New Developer Feature – Hide Preference When Empty

Posted in : New Features on by : Tim

favicon1

We are excited to announce the new hideWhenEmpty preferences configuration option. This feature will be useful to all developers wanting to provide a more succinct and friendly installation flow for your SmartApps. Prior to today if you wanted to hide an input field you would have needed to clutter up your code with if statements. This was hard to read and added another layer of complexity to your code. This is where hideWhenEmpty comes in. hideWhenEmpty will allow you to hide device inputs from the UI that could be empty. Making it easier for your users to understand how to install your SmartApp.

hideWhenEmpty can be used in a few different ways. It can be used on single device inputs with an expected behavior of hiding the input if the user does not have that kind of device connected to their SmartThings account. It can also be used at the section and page level. When using it at these higher levels, hideWhenEmpty will cascade down to all the elements in that section. Lastly, it can be used on non-device input fields. Non-device input fields that use hideWhenEmpty can reference a device input and hide itself based on whether the referenced device input is empty or not.

hideWhenEmpty

Let’s take a look at how this works in practice.

Here is an example of simply adding hideWhenEmpty to a single device input:

preferences {
    section {
        input "switches", "capability.switch", title: "Select a switch"
        input "valves", "capability.valve", title: "Select a valve", hideWhenEmpty: true, required: false
    }
}

Here, the valves input will hide itself if your user does not have a device with capability.valve connected to SmartThings.

Next, we can add it to a section:

preferences {
    section(hideWhenEmpty: true) {
        input "switches", "capability.switch", title: "Select a switch"
        input "valves", "capability.valve", title: "Select a valve", required: false
    }
}

Or page level:

preferences {
    page(name: "mainPage", title: "Select some things", hideWhenEmpty: true) {
        section {
            input "switches", "capability.switch", title: "Select a switch"
            input "valves", "capability.valve", title: "Select a valve", required: false
        }
        section {
            input "audio", "capability.musicPlayer", title: "Select a music player"
        }
    }
}

In each case, any device input within a page or section that declares hideWhenEmpty will hide device inputs when your user does not have one of that type connected to SmartThings.

Lastly, we have an example of how to use hideWhenEmpty to reference other device inputs. That looks something like this:

preferences {
    page(name: "mainPage", title: "Select some things", hideWhenEmpty: true) {
        section {
            input "audio", "capability.musicPlayer", title: "Select a music player"
            input "volume", "number", title: "Set it to this volume level", hideWhenEmpty: "audio"
        }
    }
}

In this case, the volume input will not be displayed if the user does not have any audio devices.

We’re really excited about this feature and the value it can bring to your user experience while you develop.

For more details and a more complete explanation, please visit our documentation on this new feature.

Happy coding!