Comments (9)
Hi, thanks for reaching out,
You can set the height of the bottom sheet by manually setting the hight of the inner <View />
, like on the SimpleView.js
example https://github.com/cesardeazevedo/react-native-bottom-sheet-behavior/blob/master/example/views/SimpleView.js#L105
Let me know if you got it.
from react-native-bottom-sheet-behavior.
Thanks for the answer! Yes, that works!
I'm aware this might be suitable for another issue, but what I'm essentially trying to do is recreating the maps example but with the BottomContentHeader when I'm in the expanded view because I need to have another navigation once I'm in expanded view to control the ScrollView inside the container. Since using ScrollView only works when either not using the anchor point or when using the MergedAppBar (at least from what I understood of the library so far), I need to implement a custom design for the MergedAppBar, which is not possible.
My idea now would be to set the height of the Content to the screen height once the User scrolls higher than the expanded position.
Maybe you know another way of achieving this?
Thank you very much!
from react-native-bottom-sheet-behavior.
I think i am really confused now π , do you have a visual example on what you are trying to do?
from react-native-bottom-sheet-behavior.
Yes sure!
I built a navigation that controls the content of a scrollview and of the content container behind the BottomSheetBehaviour. Collapsed it looks like this:
I don't need scrolling behaviour when in anchor state, so at the anchor, it should look like this:
But in expanded state, I need the navigation, that I put in the Header to be sticking to the top of the screen with a scrollable list below:
I know that it is possible to achieve scrolling when using the MergedAppBarLayout, but that merges the top bar and it is not possible to customize the header the way I need it.
I tried putting an absolute view on top of the scroll view, but it wouldn't display correctly within the CoordinatorLayout.
Thanks for your help! :)
from react-native-bottom-sheet-behavior.
I have a better understanding now, thanks for clarify, The MergedAppBarLayout is indeed very hard to customized, i think i did something similar on the past, so let me play around and i will back to you.
from react-native-bottom-sheet-behavior.
Is something like this you're trying to achieve?
from react-native-bottom-sheet-behavior.
Yes, something like that, but with the user being to also scroll down in the expanded state! :)
Basically, the view has a map in the content area, so the original statusbar with the "Google Maps" text in the example is not needed. The BottomSheetHeader basically serves as navigation to control what is displayed in the content of the BottomSheet behaviour, which is supposed to be accessible once the user reaches expanded state.
from react-native-bottom-sheet-behavior.
Yeah indeed, i think it's a bug on the NestedScrollView that i need to investigate further, if you want to play around, i have this gist so far. https://gist.github.com/cesardeazevedo/e29b3ef261ba5053b614e52dea40f83b
from react-native-bottom-sheet-behavior.
from react-native-bottom-sheet-behavior.
Related Issues (20)
- Null pointer exception shouldInterceptTouchEvent HOT 3
- Pass touch events to underlying view when BackdropBottomSheet is not defined while at anchor point
- Execution failed for task `:app:transformClassesWithMultidexlistForDebug` HOT 6
- Could not find a declaration file for module 'react-native-bottom-sheet-behavior' HOT 1
- requireNativeComponent: "BSBBottomSheet-BehaviorAndroid" was not found in the UIManager. HOT 3
- UIManager['BSBottomSheetBehaviourAndroid'] is no longer supported . Use UIManager.ViewManagerConfig('BSBottomSheetBehaviourAndroid') instead warning HOT 6
- Crashes when dragging if keyboard is open
- Update to latest library support to latest and change compile to implementation HOT 1
- Task :app:transformDexArchiveWithExternalLibsDexMergerForDebug FAILED HOT 3
- collected in excellent-RN-libs
- Can't Build React-Native App HOT 1
- _reactNative.UIManager.getViewManagerConfig('BSBBottomSheetBehaviorAndroid') HOT 1
- Package android.support.design.widget does not exist HOT 1
- Task :react-native-bottom-sheet-behavior:compileDebugJavaWithJavac FAILED HOT 1
- Q: Additional FloatingActionButton, anchored, above BottomSheet HOT 1
- BottomSheetBehavior ref is null
- pull up to show more,pull down to hide
- Thank you for making this
- Crash when <BottomSheetBehavior /> is hidden within <CoordinatorLayout />
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-bottom-sheet-behavior.