NoResult
NoResult displays a visual indication that a query or search returned nothing.
Behaviors
This component supports the following behaviors:
| Behavior | Properties |
|---|---|
| Animation | animation, animationOptions |
| Bookmark | bookmark, bookmarkLevel, bookmarkTitle, bookmarkOmitFromToc |
| Publish/Subscribe | subscribeToTopic |
| Tooltip | tooltip, tooltipMarkdown, tooltipOptions |
| Styling Variant | variant |
Properties
hideIcon
default: false
This boolean property indicates if the icon should be hidden.
<App>
<FlowLayout>
<NoResult hideIcon="true" width="50%" />
<NoResult hideIcon="false" width="50%" />
</FlowLayout>
</App>Example: hideIcon
<App>
<FlowLayout>
<NoResult hideIcon="true" width="50%" />
<NoResult hideIcon="false" width="50%" />
</FlowLayout>
</App>icon
default: "noresult"
This property defines the icon to display with the component.
This property defines the icon to display with the component. For a list of of available icons consult Icon documentation.
<App>
<NoResult icon="error" height="100%" />
</App>Example: icon
<App>
<NoResult icon="error" height="100%" />
</App>label
This property sets the label of the component. If not set, the component will not display a label.
Customize the displayed text using this property. Leave empty to omit it.
<App>
<NoResult label="Sorry, found nothing!" height="100%" />
</App>Example: label
<App>
<NoResult label="Sorry, found nothing!" height="100%" />
</App>Events
This component does not have any events.
Exposed Methods
This component does not expose any methods.
Styling
Theme Variables
| Variable | Default Value (Light) | Default Value (Dark) |
|---|---|---|
| backgroundColor-NoResult | transparent | transparent |
| border-NoResult | 0px solid $borderColor | 0px solid $borderColor |
| borderBottom-NoResult | none | none |
| borderBottomColor-NoResult | none | none |
| borderBottomStyle-NoResult | none | none |
| borderBottomWidth-NoResult | none | none |
| borderColor-NoResult | none | none |
| borderEndEndRadius-NoResult | none | none |
| borderEndStartRadius-NoResult | none | none |
| borderHorizontal-NoResult | none | none |
| borderHorizontalColor-NoResult | none | none |
| borderHorizontalStyle-NoResult | none | none |
| borderHorizontalWidth-NoResult | none | none |
| borderLeft-NoResult | none | none |
| borderLeftColor-NoResult | none | none |
| borderLeftStyle-NoResult | none | none |
| borderLeftWidth-NoResult | none | none |
| borderRight-NoResult | none | none |
| borderRightColor-NoResult | none | none |
| borderRightStyle-NoResult | none | none |
| borderRightWidth-NoResult | none | none |
| borderStartEndRadius-NoResult | none | none |
| borderStartStartRadius-NoResult | none | none |
| borderStyle-NoResult | none | none |
| borderTop-NoResult | none | none |
| borderTopColor-NoResult | none | none |
| borderTopStyle-NoResult | none | none |
| borderTopWidth-NoResult | none | none |
| borderVertical-NoResult | none | none |
| borderVerticalColor-NoResult | none | none |
| borderVerticalStyle-NoResult | none | none |
| borderVerticalWidth-NoResult | none | none |
| borderWidth-NoResult | none | none |
| gap-icon-NoResult | $space-2 | $space-2 |
| padding-NoResult | none | none |
| paddingBottom-NoResult | none | none |
| paddingHorizontal-NoResult | none | none |
| paddingLeft-NoResult | none | none |
| paddingRight-NoResult | none | none |
| paddingTop-NoResult | none | none |
| paddingVertical-NoResult | $space-2 | $space-2 |
| size-icon-NoResult | $space-8 | $space-8 |