#3 Hide Header on scroll up and visible on scroll down animation in React Native

In this video we will animate YouTube header. Header will hide on scroll up ans it will be again visible on scroll down. React Native animations

connect with me on -

[HolyQuran]

Great! If you go to all the way top it will the scroll part is hiding under header

[nguyennhat]

i'm from Viet Nam. your channel is the best!

[arwysyah]

I can hide and show the header but textinput can press when position absolute, do you know how to solve it?

[Shubh_QR]

Dude! your videos are very valuable to us...

[matkomilic]

brilliant work. i watched many vids on this, all were 20 times longer and all didnt work thank u.

[umaralfaruq]

I am from Indonesia. Thanks for your tutorials

i waiting for next great videos

[LindelaniKgothatsoSodi]

Thanks, It is simple and straight forward

[newtonsazzad]

Thanks a lot. did not know about this diffClamp function.

[afj_]

Thank you my friend for this tutorial you saved my life.
But i have a question how to show the full height of first item in the flatList ? it's hidden behind the header and if i added marginTop to the flatList i still have an empty space on top of screen ???

[rushclintakam]

Thank U for this tutorial, it help me

[arpankkr]

Nice video really helpful in clearing my concepts

[riorafe]

Thankyou so much sir!! Works perfectly on my company app

[wilsonlopez]

Great man, thanks, thats just what i need!!

[chndraja]

Thank you... for this video.. it helped 💖👍

[matkomilic]

if you guys are getting error pls use this: const scrollY = new Animated.Value(0);
const diffClamp = Animated.diffClamp(scrollY, 0, 45);
const translateY = Animated.interpolate(diffClamp, {
inputRange: [0, 45],
outputRange: [0, -45],
});

[nakidm]

hey nice video can u make one where u can add and materialTopTabs like wzzp thanks.

[jervi_sir]

thank you, How to do this with multiple Flatlist, m having a case where m using tab top navigation, each tab is a flatlist, and I need to collapse header when even i scroll in any tab

[gugildak]

Thanks, thats what i m searching for, mister.

[KaranKamdarMW]

Hi I am trying to implement this with the SafeAreaView from react-navigation-safeareaview which wraps my header. But the SafeAreaView remains on top. How to do this. Can you give an example?

[satyaranjannayak]

Hi bro I need a help.
I need to nest a sectionlist insidr another sectionlist. Whenever I use scrollToLocation I get error saying this._scrollRef is not a function.
Please give some suggestion.
Basically I need a scrollable header with tabs having name as of section header and should stick to top even if ListHeaderComponent be in its top.