Backdrop

The Backdrop component is a semi-transparent overlay that appears on top of its child component to obscure or highlight the content behind it.

<App>
  <Backdrop opacity="0.2">
    <Image 
      src="/resources/images/components/image/breakfast.jpg" 
      fit="cover" width="400px" />
    <property name="overlayTemplate">
      <VStack verticalAlignment="center" height="100px">
        <H1 color="white" textAlign="center">Great breakfast!</H1>
      </VStack>
    </property>
  </Backdrop>
</App>

Properties

`backgroundColor (default: "black")`

The background color of the backdrop.

`opacity (default: 0.1)`

The opacity of the backdrop.

`overlayTemplate`

This property defines the component template for an optional overlay to display over the component.

Events

This component does not have any events.

Exposed Methods

This component does not expose any methods.

Styling

This component does not have any styles.

Avatar Badge