flutter_package / modal_bottom_sheet

Go to a project
Toggle navigation Toggle navigation pinning
Jaime Blasco
Committed by GitHub
98aa5fea 1 parent d4fc697e

Update README.md

Inline Side-by-side
Showing 1 changed file with 16 additions and 7 deletions
1 -# Flutter Modal BottomSheet 1 +# Flutter Modal Bottom Sheet
2 2
3 Create awesome and powerful modal bottom sheets 3 Create awesome and powerful modal bottom sheets
4 4
  5 +<img align="left" height="300" src="https://github.com/jamesblasco/modal_bottom_sheet/blob/master/screenshots/cupertino_shared_view.gif">
  6 +<img align="left" height="300" src="https://github.com/jamesblasco/modal_bottom_sheet/blob/master/screenshots/modal_inside_modal.gif">
  7 +<img align="left" height="300" src="https://github.com/jamesblasco/modal_bottom_sheet/blob/master/screenshots/material_fit.png">
  8 +<img height="300" src="https://github.com/jamesblasco/modal_bottom_sheet/blob/master/screenshots/bar_modal.png">
  9 +
  10 +
5 ## Material Modal BottomSheet 11 ## Material Modal BottomSheet
6 12
7 `showMaterialModalBottomSheet` 13 `showMaterialModalBottomSheet`
@@ -12,14 +18,14 @@ Improved showModalBottomSheet that support scroll and drag at the same time. @@ -12,14 +18,14 @@ Improved showModalBottomSheet that support scroll and drag at the same time.
12 18
13 iOS 13 came with an amazing new modal navigation and now it is available to use with Flutter. 19 iOS 13 came with an amazing new modal navigation and now it is available to use with Flutter.
14 20
15 -###OPTION 1. Recommended. 21 +### OPTION 1. Recommended.
16 1. use `showCupertinoModalBottomSheet` 22 1. use `showCupertinoModalBottomSheet`
17 2. `MaterialPageRoute` does not allow animated translation for routes that are not `MaterialPageRoute` or `CupertinoPageRoute`. 23 2. `MaterialPageRoute` does not allow animated translation for routes that are not `MaterialPageRoute` or `CupertinoPageRoute`.
18 For this we created `MaterialWithModalsPageRoute` that needs to replace the route you are using now. 24 For this we created `MaterialWithModalsPageRoute` that needs to replace the route you are using now.
19 Notice this route type works the same as `MaterialPageRoute` and will support custom `PageTransitionsTheme`. 25 Notice this route type works the same as `MaterialPageRoute` and will support custom `PageTransitionsTheme`.
20 26
21 27
22 -###OPTION 2. 28 +### OPTION 2.
23 1. Wrap previous page inside a `CupertinoScaffold`. 29 1. Wrap previous page inside a `CupertinoScaffold`.
24 2. Call `CupertinoScaffold.showCupertinoModalBottomSheet(context:context, builder: ...)` 30 2. Call `CupertinoScaffold.showCupertinoModalBottomSheet(context:context, builder: ...)`
25 31
@@ -39,8 +45,11 @@ Try `showBarModalBottomSheet` for a bottomSheet with the appearance used by Face @@ -39,8 +45,11 @@ Try `showBarModalBottomSheet` for a bottomSheet with the appearance used by Face
39 Check in the example project `showAvatarModalBottomSheet` for how to create your own ModalBottomSheet 45 Check in the example project `showAvatarModalBottomSheet` for how to create your own ModalBottomSheet
40 46
41 ## Roadmap 47 ## Roadmap
42 -[ ] Support closing by dragging fast on a modal with a scroll view.  
43 -[ ] Improve animation curves when user is not dragging.  
44 -[ ] Allow to set the initial size of the bottom sheet  
45 -[ ] Support hero animations 48 +- [ ] Support closing by dragging fast on a modal with a scroll view.
  49 +
  50 +- [ ] Improve animation curves when user is not dragging.
  51 +
  52 +- [ ] Allow to set the initial size of the bottom sheet
  53 +
  54 +- [ ] Support hero animations
46 55