question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

MapPanel.js example with ScrollView (similar to Material Bottom sheets)

See original GitHub issue

First, sorry if this is very related to #35, just wanted to make sure.

Basically, I was trying to mimic Bottom sheets from Material spec using this example MapPanel.js.

But, with one addition, changing content view from the panel here to ScrollView. Then, you cannot interact with it anymore (only internal scrolling).

You can see this is an issue in the real example, on Apple Maps-Style Panel, if you change your device orientation (I try with Android) to landscape, because there is no internal scroll, you cannot see the whole view.

Desired result would be something like:

ezgif-3-fa4a3bc778

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:8
  • Comments:17 (1 by maintainers)

github_iconTop GitHub Comments

3reactions
urbancvekcommented, Apr 26, 2017

Hey any success on implementing this? I’m also trying to do it.

0reactions
neerajemorphiscommented, Mar 19, 2019

@RichardLindhout thats not working as expected, no methods to expand / collapse the bottomSheet, in touch through view, as well as collapsed, opened props doesn’t seem to be working. Apart from that, need to restrict the height, of the bottomsheet to some specific height, which should not be crossed, when expanded. I am looking for the same behavior like Android bottom-sheet - https://github.com/cesardeazevedo/react-native-bottom-sheet-behavior.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How can I mimic the bottom sheet from the Maps app?
I noticed that the Apple Maps bottom sheet handles transitioning from the sheet drag gesture to the scroll view scroll gesture in one...
Read more >
Getting Started | React Native Bottom Sheet - GitHub Pages
A performant interactive bottom sheet with fully configurable options. ... Support FlatList , SectionList , ScrollView & View scrolling interactions, ...
Read more >
Sheets: bottom - Material Design
Modal bottom sheets are an alternative to inline menus or simple dialogs on mobile and provide room for additional items, longer descriptions, ...
Read more >
Bottom sheet | npm.io
A highly customizable modal/bottom sheet that loves scrolling content. react-nativereactnativemodalbottom sheetbottomsheetscrollViewflatListsectionList. 2.0.99 ...
Read more >
DevExpress WinForms 19.2.5 - RSSing.com
End -User Report Designer - The Expression Editor doesn't work correctly with ... another item is added if AccordionControl has images with different...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found