Spotify Scrollable Header – “Can it be done in React Native?”



In this video, we are looking at the Spotify scrollable header. I hope that you will enjoy the video! 😀 Let me know what you think.

Wanna learn the fundamentals of Gesture Handler and Reanimated? Check out my online course at

The full example is available at
You can check it out on GitHub as well at
I mentioned a React Native bug in the video, here is the link:

The boilerplate project if you want to follow along with the example is available at

Want to build your best app yet? Check out

Do you like the series? You can support the channel by buying me a coffee at ☕️.

Are you sometimes asking yourself “Can it be done in React Native”? Send me your suggestions at wcandillon@gmail.com

Nguồn: https://baggersoriginals.com/

Xem thêm bài viết khác: https://baggersoriginals.com/cong-nghe/

Article Categories:
Công Nghệ

Comments

  • I really love your lectures. Thanks william for producing awesome content.

    Ashish Mehra July 2, 2020 4:40 pm Reply
  • Unfortunately the example on expo could not be loaded

    Daniel July 2, 2020 4:40 pm Reply
  • Amazing

    Gabriel Chuler Battistella July 2, 2020 4:40 pm Reply
  • Why Typescript ? Please use JavaScript

    Harshad M July 2, 2020 4:40 pm Reply
  • Hi William,
    just a question
    If you a similar scrolling

    for example

    I have tabs from native base that is under the header which is collapsible

    let's say the header max is 300 and when its collapsed, it will be 200 for example.

    What I want is I want to disable scroll view of the tabs till I reach a certain point then I am allowed to scroll the inner scroll view

    hope you get my point, i have been looking to fix this for a while now but I have no clue

    I tried, scrollEnabled={false} on the inner scroll view and it worked but there is no way to switch back to true and allow it to scroll then If the user wants drag the scroll view back he can.

    Can you give me an idea on how to fix such a thing.

    A good example would, open table app

    Regards

    Chihab Ahmed July 2, 2020 4:40 pm Reply
  • i love to purchase your course, but do have tutorial for js, because im not familiar with typescript

    ariff jumper July 2, 2020 4:40 pm Reply
  • Is onScroll function available on "react-native-redash": 3.3.2 because on version 14 am encountering bugs

    Apiut Toel July 2, 2020 4:40 pm Reply
  • Cool video

    Osman Musse July 2, 2020 4:40 pm Reply
  • This's really amazing video about react native. Thank you so much!!! ❤️❤️❤️❤️

    Dmobi Soft July 2, 2020 4:40 pm Reply
  • Hi William, I'm from chennai, India. I love your videos. It is very helpful. Could you please do a video recreating Google Play profile scrollview animation.

    cracy abdul July 2, 2020 4:40 pm Reply
  • Sans vouloir être méchant, il faut vraiment améliorer votre accent. Ce n'est pas une critique mais un conseil.

    Mitsushi KOTSIBA July 2, 2020 4:40 pm Reply
  • This make so much sense and like the video so much and can understand it

    GEoRgeTte BEuLaH July 2, 2020 4:40 pm Reply
  • its RN version 0.61.5 and i think the shuffle play lag you mentioned in 26:00 still persists on both platforms. In this example however it is pretty difficult to spot the delay in the animation, although your work around probably works great. Im about to try and implement it in my case of use.

    manny quintero July 2, 2020 4:40 pm Reply
  • Thank you!!

    Ikey Benz July 2, 2020 4:40 pm Reply
  • 50 percent i understood…what i do…its making me sad….

    B Santhosh dhana July 2, 2020 4:40 pm Reply
  • Hi there! I am trying to implement the animation. But I get an error: undefined is not a function (near '…proc…') when importing onScroll from 'react-native-redash'. Can't find any related issues. Any ideas?

    Barbara Rekowska July 2, 2020 4:40 pm Reply
  • Tu n’es pas français ? 😅

    Sébastien Fréchard July 2, 2020 4:40 pm Reply
  • Will the onEndReached() of the flatlist be called if Flatlist is used in this example?

    Punyaslok Dutta July 2, 2020 4:40 pm Reply
  • Great work. Does this work on andriod too

    Latif Issaka July 2, 2020 4:40 pm Reply
  • I have a basic question, what is difference of .js and .tsx? And can I use .js instead of tsx without changing any codes?

    Raemarc San Gabriel July 2, 2020 4:40 pm Reply
  • i love react , we are same religion 😀

    Agit Naeta July 2, 2020 4:40 pm Reply
  • Awesome. You make animated seem very easy to use.

    Osama Qarem July 2, 2020 4:40 pm Reply
  • Congrats on the great content! Keep it up

    Moy Olvera July 2, 2020 4:40 pm Reply
  • Thank you so much for helping us out 😊

    Nishan July 2, 2020 4:40 pm Reply

Leave a Reply

Your email address will not be published. Required fields are marked *