mirror of
https://github.com/zhigang1992/react-native-bottom-sheet.git
synced 2026-06-15 02:19:08 +08:00
48 lines
1.4 KiB
Plaintext
48 lines
1.4 KiB
Plaintext
---
|
|
id: getting-started
|
|
title: Getting Started
|
|
description: A performant interactive bottom sheet modal with fully configurable options 🚀
|
|
keywords:
|
|
- bottomsheet
|
|
- bottom-sheet
|
|
- bottom sheet
|
|
- react-native
|
|
- react native
|
|
- ios
|
|
- android
|
|
- sheet
|
|
- modal
|
|
- presentation modal
|
|
- reanimated
|
|
image: /img/bottom-sheet-modal-preview.gif
|
|
hide_title: true
|
|
slug: /modal
|
|
hide_table_of_contents: true
|
|
---
|
|
|
|
# React Native Bottom Sheet Modal
|
|
|
|
import useBaseUrl from '@docusaurus/useBaseUrl';
|
|
import { Video } from '../../components/video';
|
|
|
|
<Video
|
|
title="React Native Bottom Sheet Modal"
|
|
url={useBaseUrl('video/bottom-sheet-modal-preview.mp4')}
|
|
/>
|
|
|
|
**Bottom Sheet Modal** is wrapper/decorator on top of the **Bottom Sheet**, it provides all of its functionalities with extra modal presentation functionalities.
|
|
|
|
With the release of the library, support for stack sheet modals were something planned ahead to provide the a native feel & and experience to users.
|
|
|
|
The implementation of this feature was inspired by Apple Maps sheet modals ❤️, [check out the Apple Map sheet modals clone](https://github.com/gorhom/react-native-bottom-sheet/blob/master/example/src/screens/advanced/MapExample.tsx).
|
|
|
|
## Features
|
|
|
|
- ...[Bottom Sheet Features](/#features)
|
|
- Smooth interaction and mounting animation.
|
|
- Support stack sheet modals.
|
|
|
|
## Installation
|
|
|
|
This feature been shipped with `@gorhom/bottom-sheet` package and it requires no extra dependency.
|