card
The card is a versatile and visually appealing UI element that encapsulates and presents information or interactive content in a structured, consistent, and user-friendly manner. It enhances the app's usability by organizing content into manageable, self-contained units that are easy to navigate and interact with. Each card typically includes a mix of text, images, and interactive elements, creating a self-contained unit of content.
Some properties are common to all components, see Common component properties for a list and their configuration options.
Core structure | |
---|---|
children | Configure a component or multiple components in a card. See Components for a list of available components. |
instanceId | Give the card component a unique id that can be referenced throughout the jig. |
Other options | |
---|---|
color | Sets the color of the card. Choose a color from the provided Jigx color palette. Default color is white if the property is not specified in the YAML. |
style | When isDisabled is set to true, the card appears opaque, indicating that it is unavailable for selection. By default isDisabled is set to false. |
Actions | |
---|---|
onPress | Choose from the provided list of available actions, for example, use the go-to action to open a different jig. |
- Component-level: The carousel component has the option to use the card component within the carousel to create a visually appealing carousel.