Skylight Docs
Search
K

Card Sizing

Cards have a size property, which will determine their width (if using the Android HUD client) or their height (on all other clients).
The term viewport is used throughout this page to signify the scrollable region that is visible on the screen -- that is, the full screen minus the navigation/view title/view description elements. As such, a card cannot be bigger than the screen.

Basic Values

In the application builder, there are four basic values that a card's size can be set to -- Small, Medium, Large, and Auto.

Small

This is the same as setting min and max values both to 0.3. The card will take up a third of the viewport horizontally (on HUD) or vertically (on all other clients).

Medium

This is the same as setting min and max values both to 0.6. The card will take up a two-thirds of the viewport horizontally (on HUD) or vertically (on all other clients).

Large

This is the same as setting min and max values both to 1. The card will take up the full viewport horizontally (on HUD) or vertically (on all other clients).

Auto

This is the same as setting min and max values both to 0. The card will resize horizontally (on HUD) or vertically (on all other clients) anywhere from a tenth of the viewport to the full viewport to fit its content.

Custom Values

Custom values can be provided for the card, as static or databound values for min and max. The values for min and max should range from 0 to 1, inclusive. If min and max are the same, the card will be a fixed size that takes up value * 100% of the viewport in the direction appropriate for the device. If min and max are not the same, the card will resize to fit its content with a minimum size of min * 100% the viewport and a maximum size of max * 100% the viewport.
Setting min to 0 and max to 1 achieves the same behavior as setting the both values to 0, as the card will resize to fit its content automatically, taking up as little or as much of the viewport as possible.