Bottom Sheet React Native | Expo Tutorial 2022

Поделиться
HTML-код
  • Опубликовано: 3 окт 2024
  • НаукаНаука

Комментарии • 49

  • @sdinan
    @sdinan 7 месяцев назад +1

    Thank you for the tutorial! Couldn't get my layouts to work right & this instantly solved my problems :)

  • @burakylmaz9973
    @burakylmaz9973 Год назад

    This video and your explanation has helped me immensely in my project Beto. Thank you.

  • @Redstarcrew
    @Redstarcrew 2 года назад +1

    thank you for the video man, i really appreciate these small react native projects. Hope you continue making these

    • @codewithbeto
      @codewithbeto  2 года назад

      thanks! I will be uploading more content soon!

  • @natizerai
    @natizerai Год назад

    Thanks man and your english is very clear.

  • @dearesthui
    @dearesthui 2 года назад

    Hi Beto, great video, thanks for this tutorial. Your English is great no worries.

  • @asadanik5987
    @asadanik5987 2 года назад

    I just looking which video will be more helpful and easier to learn. I watched more videos for this Bottom Sheet on React Native. But this one is just awesome and brother please keep it up new contents every single days. Awesome bro take love from Bangladesh

  • @PauloIcaro-pg2xk
    @PauloIcaro-pg2xk 9 месяцев назад

    Best! 👍🔥

  • @ManoelCarvalho
    @ManoelCarvalho 2 года назад

    Top d+ Beto!

  • @PitZza143
    @PitZza143 Год назад

    Awesome tutorial

  • @ByteVillain
    @ByteVillain Год назад +1

    run
    expo start -c
    if you get cannot read toString() of undefined, it clears the cache before starting, it's a bug with react native reanimated

    • @iRTerence
      @iRTerence Год назад

      You are a life saver

  • @cesswhite
    @cesswhite 2 года назад

    Nice video, thanks

  • @Winsoery
    @Winsoery Год назад

    Thank you

  • @arpecop
    @arpecop Год назад

    good sheet! 🤗

  • @harshdeep7015
    @harshdeep7015 Год назад

    How to dismiss bottom sheet after click on outside??

  • @kelvinnimelyjr
    @kelvinnimelyjr Год назад

    What about you use the backdropComponent for adding opacity when the BottomSheet Opens.

  • @lakhey8057
    @lakhey8057 2 года назад

    How to override navigation header with backdrop, can you make video on it?

  • @mohamedyoussef1311
    @mohamedyoussef1311 Год назад

    Awesome video +++++++++++++ 😀

  • @LebanCardozo
    @LebanCardozo 4 месяца назад

    does it work for cli project

  • @ShivamPanchal-b6q
    @ShivamPanchal-b6q Год назад

    how can we make a one bottom sheet common for whole project and send inner contents using props

  • @ByteVillain
    @ByteVillain Год назад

    run
    expo start -c
    if you get cannot read toString() of undefined, it clears the cache before starting, it's a bug with react native reanimated

  • @OneTHPS
    @OneTHPS Год назад

    Hey, is there possible to open bottom sheet when it close and swipe up in any place to open it ?

  • @kwesikayofficial3078
    @kwesikayofficial3078 Год назад

    what did you use for the alert

  • @nikkit.1079
    @nikkit.1079 Год назад

    Are you able to change the border top left and border top right radius? I'm trying to use style and backgroundStyle but it doesn't work

  • @d0minar
    @d0minar Год назад +1

    how do you load this page with bottomsheet in a closed state?

    • @d0minar
      @d0minar Год назад +2

      figured it out. index={-1}

  • @QuanNguyen-zi7yl
    @QuanNguyen-zi7yl Год назад

    Is react native bottom sheet library available on React native CLI ?

  • @qwer-dn2wq
    @qwer-dn2wq 2 года назад

    Can I use it in Javascript not typescript?

  • @Redstarcrew
    @Redstarcrew 2 года назад

    I noticed in your spanish channel that you created a chat application. Would be really appreciated if you could make the same app but in english

  • @hungphan13999
    @hungphan13999 2 года назад

    how could I close the bottom tab when I press outside?

  • @mariosconnou9214
    @mariosconnou9214 2 года назад

    Hello there. I get something odd which I cant seem to resolve. When I try to console log
    my sheetRef, it return a boolean. Is this normal?
    Thank you. Great Work :)

  • @oyewolesheddrack3642
    @oyewolesheddrack3642 Год назад

    is there a way this can work in js?

  • @armisael2k
    @armisael2k 2 года назад +1

    Cómo puedo hacer que al abrir la app el bottom sheet no sea visible?

    • @electrodiux-pbh
      @electrodiux-pbh Год назад +1

      Añade a BottomSheet la propiedad "index" a -1,

  • @lecongduong6056
    @lecongduong6056 2 года назад +1

    i have an error : function component cannot have string refs. any solution

    • @rizanurfatrisyam1177
      @rizanurfatrisyam1177 2 года назад +1

      make sure you use typescript , is not remove from hook useRef

    • @lecongduong6056
      @lecongduong6056 2 года назад

      @@rizanurfatrisyam1177 i used js, can i use this

    • @zillahmwimali2857
      @zillahmwimali2857 2 года назад +1

      if you are using Javascript simply decaler the useRef() function, which should look like this
      const bottomSheetRef = useRef();

  • @duybangang9621
    @duybangang9621 2 года назад

    How to show bottom sheet above bottom navigation ? Thanks Sir

    • @codewithbeto
      @codewithbeto  2 года назад +1

      I think there is a property in the bottom tab that allows you to hide it. Maybe this can help you stackoverflow.com/questions/56745881/how-to-hide-bottom-navigation-bar-on-a-specific-screen-in-react-native

    • @lolekakaa
      @lolekakaa Год назад

      in your _layout.tsx just wrap your stack in BottomSheetModalProvider, and then use bottom modal anywhere else

  • @lakhey8057
    @lakhey8057 2 года назад

    Why not use backdrop?

    • @codewithbeto
      @codewithbeto  2 года назад

      This package has more features but for this specific functionally backdrop could be a better fit, I'll try to make a video on that

  • @Nibezak
    @Nibezak Год назад

    do expo and pouchdb
    I dare you