View
The View element is used to configure the display of blocks, similar to the div tag in HTML.
Parameters
| Param | Type | Description |
|---|---|---|
| display | block | inline |
|
| [style] | string |
CSS style string |
| [className] | string |
Class name of the CSS style to apply. Use with the Style tag |
| [visibleWhen] | region-selected | choice-selected | no-region-selected | choice-unselected |
Control visibility of the content. Can also be used with when* attributes below to narrow down visibility |
| [whenTagName] | string |
Use with visibleWhen. Narrow down visibility by tag name. For regions, use the name of the object tag, for choices, use the name of the choices tag |
| [whenLabelValue] | string |
Use with visibleWhen=”region-selected”. Narrow down visibility by label value |
| [whenChoiceValue] | string |
Use with visibleWhen (“choice-selected” or “choice-unselected”) and whenTagName, both are required. Narrow down visibility by choice value |
Example
Create two cards that flex to take up 50% of the screen width on the labeling interface
<View style="display: flex;">
<View style="flex: 50%">
<Header value="Facts:" />
<Text name="text" value="$fact" />
</View>
<View style="flex: 50%; margin-left: 1em">
<Header value="Enter your question:" />
<TextArea name="question" />
</View>
</View>