Skip to main content

Backdrop

A backdrop appears behind all other surfaces in an app, displaying contextual and actionable content.

A backdrop is composed of two surfaces: a back layer and a front layer. The back layer displays actions and context, and these control and inform the front layer's content.

💬 Feedback 🎨 Material Design

Import

import { Backdrop, BackdropSubheader } from "@react-native-material/core";

Props

revealed

Type: boolean;

Optional: Yes


header

Type: React.ReactElement | null;

Optional: Yes


headerHeight

Type: number;

Optional: Yes


backLayer

Type: React.ReactElement | null;

Optional: Yes


backLayerHeight

Type: number;

Optional: Yes


subheader

Type: React.ReactElement | null;

Optional: Yes


subheaderHeight

Type: number;

Optional: Yes


style

Type: StyleProp<ViewStyle>;

Optional: Yes


headerContainerStyle

Type: StyleProp<ViewStyle>;

Optional: Yes


backLayerContainerStyle

Type: StyleProp<ViewStyle>;

Optional: Yes


frontLayerContainerStyle

Type: Animated.AnimatedProps<ViewProps>["style"];

Optional: Yes


subheaderContainerStyle

Type: StyleProp<ViewStyle>;

Optional: Yes