cooperka / react-native-snackbar

:candy: Material Design "Snackbar" component for Android and iOS.
Other
815 stars 150 forks source link

Add support for setting bottom margin #186

Closed Polarisation closed 1 year ago

Polarisation commented 3 years ago

See #15

This allows a bottom margin to be set. This can be used to place the snackbar above navigational elements such as a tab bar at the bottom of the screen.

Screenshot 2021-06-21 at 17 42 42

cooperka commented 3 years ago

Thank you for this work @Polarisation! The code looks great, I'll just need to find some time to test before officially merging. It may be a few weeks, but I will get to it.

Because you reached out via email about being able to include this in your own app, I just wanted to offer that you CAN use this immediately -- you just need to use your fork in your app instead of this library directly. You can find articles about this online, here's one for example that seems useful: https://blaipratdesaba.com/how-to-use-an-npm-node-module-that-has-been-forked-b7dd522fdd08. Hope it helps, cheers!

Polarisation commented 3 years ago

@cooperka Thanks that's helpful. Keen to stay aligned on the main package but may use the fork short term 👍

Polarisation commented 3 years ago

Made a few further tweaks:

sugata98 commented 2 years ago

Want this feature to be merged. Kind of a necessary one. Thank you!

JuanpaG94 commented 2 years ago

Definitely is a really nice to have feature!

cooperka commented 2 years ago

Update: Rebased on latest main with dependency upgrades; works great on Android! Now to spend a few more hours setting up xcode... I should have this ready to merge tomorrow.

cooperka commented 2 years ago

Facebook's support for upgrading RN modules is truly despicable... I'll need to start a new module from scratch and re-apply this library's code on top of it.

For anyone wanting to use this feature right away, you can: just point to the code at cooperka/react-native-snackbar, branch feature/margins where I've committed the compiled lib directory. There's NO reason you can't use this feature RIGHT NOW in your app.

I will merge this PR after I'm able to test on iOS. It will take several more days before I have time to keep going. Thanks again for the great submission @Polarisation, I have no concerns that it works, I just need to be able to verify before shipping new code.

Polarisation commented 2 years ago

I integrated my fork into an app with the following edits to package.json:

"dependencies": {
  "react-native-snackbar": "https://github.com/Polarisation/react-native-snackbar.git#feature/margins"
},
"scripts": {
  "build-snackbar": "cd ./node_modules/react-native-snackbar && yarn install && rm -rf node_modules example",
  "postinstall": "yarn build-snackbar"
},

Probably easier to use the compiled branch @cooperka prepared above, but just thought I'd share this snippet, it might be helpful for anyone submitting Pull Requests in future.

pe-johndpope commented 2 years ago

merge

Sumit2202 commented 1 year ago

Can we merge this now?

lydialawli commented 1 year ago
  • In a bottom margin is set, the animation will now fade in/out, rather than slide up/down.
  • Removed the marginLeft and marginRight options as I couldn't find an implementation which works reliably. (it's also not important for my use case, which is to raise the snackbar above a bottom tab bar)

Hi @cooperka (https://github.com/cooperka), any way we can have all margins setable as you tried before? or perhaps a custamizable styling of the box? I am unsure how difficult it is to build this. My wish is to have the snackbar floating at the bottom but not touching any side . So basically I would love to have it like this example found in MUI docs:


Screenshot 2022-11-03 at 16 52 12

Is what I'm asking possible with this library?
 Thanks for the efforts.

cooperka commented 1 year ago

still untested by me on iOS, but has a lot of love from the community! thanks again @Polarisation.

released as v2.6.0 🎉