Responsive settings for coach views
At run time, users can interact with your application interfaces by using a range of devices, each of which have their own characteristics, such as screen size and standard user-interface conventions.
You can build interfaces that are responsive to the user's runtime environment by specifying the responsive coach view settings. You can configure these settings separately for different screen sizes so that you can design one interface that changes in appearance and behavior based on the user's screen size.
| Screen size setting | Icon | Width |
|---|---|---|
| Small |  |
640 pixels or less |
| Medium |  |
641 - 1024 pixels |
| Large (default) |  |
More than 1024 pixels |
When you build your coach or coach view, you can configure the responsive settings for all the coach view instances in your coach or coach view by using one screen size. You can then configure the same settings using different values for another screen size. At run time, the pixel count of the viewport width determines which screen-size setting the device browser uses to display the coach and the coach views that it contains. Typically, the device browser uses the same screen-size setting regardless of the device orientation. If a device has an unusual size, however, the browser could have one screen size for the portrait orientation and a different screen size for the landscape orientation, depending on the widths of the two orientations.
Note that the viewport pixel counts for a web browser on a device do not necessarily match the advertised pixel counts of the device screen. The web browser viewport is often smaller. Websites such as http://viewportsizes.com are useful for determining the viewport size for a particular device.
The large screen size is the default. If you do not provide different values for a responsive setting that is available for a coach view instance, all three screen sizes use the same value for the setting and the coach view instance appears the same in all user environments. For example, if you set values for the coach view instance margins for the large screen size, and do not provide values for the medium or small screen sizes, then the large screen values apply in all user environments.
If you set the responsive settings for a coach view instance for the medium screen size, but do not provide values for the small screen size, the medium screen size values apply in small screen size environments.
Responsive settings for coach view instances
You can configure the following types of properties for different screen sizes: positioning properties, configuration options, and visibility properties.
Positioning properties enable you to configure the placement and spacing of a coach view instance. You can set positioning properties for each screen size, for example, so that coach content can be spaced more closely together when the interface is displayed on smaller devices. For information about how to set responsive positioning properties, see Positioning options for coach view instances.
Configuration options, when they are marked as responsive, can change the presentation or even the contents of a coach view instance, depending on the device. You can also add responsive configuration options to your own coach views.
For example, you might create a coach view with a configuration option that determines whether selection controls on an instance of that coach view are rendered as check boxes, radio buttons, or slider controls. If this configuration option is marked as responsive, it can have three different settings corresponding to three different screen size settings. For information about how to set configuration properties as responsive, see Configuration properties and configuration options.
Visibility properties, which determine whether a view is hidden, visible, editable, and so on, can also be set relative to a particular device size. For example, to pare down the user interface in the smallest screen-size environments, you might hide a more detailed coach view instance in small screen size environments and show a simplified version instead. For information about how to set responsive visibility properties, see Coach view visibility properties.