Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: allow dynamic snap points #81

Merged
merged 12 commits into from
Nov 27, 2020
Merged

Conversation

gorhom
Copy link
Owner

@gorhom gorhom commented Nov 22, 2020

Motivation

this pr will allow snapPoints to be more reactive to updates and improve snap points calculating position.

Test

yarn add ssh://git@github.com:gorhom/react-native-bottom-sheet#allow-dynamic-snap-points

@gorhom gorhom added the v2 Written in Reanimated v1 label Nov 22, 2020
@gorhom gorhom linked an issue Nov 22, 2020 that may be closed by this pull request
@gorhom gorhom linked an issue Nov 22, 2020 that may be closed by this pull request
@likern
Copy link
Contributor

likern commented Nov 22, 2020

@gorhom How to test it? Can't understand how to use this feature. Is it reflected in example App?

@likern
Copy link
Contributor

likern commented Nov 22, 2020

Is dynamic snap point is what located at src/screens/static/BasicExample.tsx?
I see it's not shown in example application.

@likern
Copy link
Contributor

likern commented Nov 22, 2020

I have feeling that bottom-sheet handle is not synced with content, expecially on shaking.

https://drive.google.com/file/d/1DZkq2LoF-uaRpzaga475wzysMVlj2MvI/view?usp=sharing
Sorry for the video quality.

@gorhom
Copy link
Owner Author

gorhom commented Nov 22, 2020

hi @likern , thanks for tasting this pr

I have feeling that bottom-sheet handle is not synced with content, expecially on shaking.

this is a known issue on Android, i will work on a fix later.

@likern
Copy link
Contributor

likern commented Nov 22, 2020

@gorhom Thank you! I have two more questions.

Will this version work for Reanimated V2? My reanimated version is 2.0.0-alpha.8. I don't use old useCode()-like API, but as I understand V2 should fully support V1 API, so even react-native-bottom-sheet V1 should work for react-native-reanimated-2.0.0-alpha.8. Am I correct?

And could you give more examples how to use bottom-sheet based on content? For example just show bottom-sheet with one snap point of content height?

@gorhom
Copy link
Owner Author

gorhom commented Nov 22, 2020

@likern this pr for v2 which is written in Reanimated v1 compatible with Reanimated v2. However, i have put this feature in v3 roadmap which i'll need to rewrite it in Reanimated v2.

And could you give more examples how to use bottom-sheet based on content? For example just show bottom-sheet with one snap point of content height?

i will add one more example for dynamic snap point later 👍

@gorhom
Copy link
Owner Author

gorhom commented Nov 22, 2020

@likern added dynamic snap point example ,, hope it helps 👍

@gorhom gorhom marked this pull request as ready for review November 24, 2020 06:23
@likern
Copy link
Contributor

likern commented Nov 24, 2020

@gorhom I think gestures are not interruptable.
If I, during bottom sheet animation (when it transitions from one snap point to another), tap on it (without panning) - it doesn't pause / interrupt it's animation.

@gorhom
Copy link
Owner Author

gorhom commented Nov 25, 2020

@likern i think that is an expected behaviour,, right. but also you could create an issue and we discuss it from there :)

@stephenlaughton
Copy link

@gorhom this looks sick! one question. do you know of any way to make Modal snap points reactive? the use case is presenting modal confirmation dialogues that have dynamic height based on content.

really awesome work on this library by the way 🔥 !

@gorhom
Copy link
Owner Author

gorhom commented Nov 26, 2020

@stephenlaughton good point , I'll look into it

@gorhom gorhom merged commit 7304867 into master Nov 27, 2020
@gorhom gorhom deleted the feature/allow-dynamic-snap-points branch November 27, 2020 07:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
v2 Written in Reanimated v1
Projects
None yet
Development

Successfully merging this pull request may close these issues.

snapPoints it differs a lot between operating systems Dynamic Bottom Sheet height based on Children height
3 participants