---
title: "Discussion on \"React Native Reanimated 2 - Collapsing Header + FlatList Tips\" | Hashnode"
description: "Discussion on \"React Native Reanimated 2 - Collapsing Header + FlatList Tips\". Recently, I have been trying to animate a dynamic header like AirBnb has using React Native Reanimated 2.\nThe Problem\nWhile I have successfully managed to make it work on iOS, on Android it turned out to be quite laggy and something didn't seem right..."
url: "https://hashnode.com/posts/react-native-reanimated-2-collapsing-header-flatlist-tips/60c20ce4a422035623a7d5af"
---

[Feed](https://hashnode.com/feed) /

Discussion

# [React Native Reanimated 2 - Collapsing Header + FlatList Tips](https://andrei-zgirvaci.hashnode.dev/react-native-reanimated-2-collapsing-header-flatlist-tips?utm_source=hashnode&utm_medium=feed)

Recently, I have been trying to animate a dynamic header like AirBnb has using React Native Reanimated 2. The Problem While I have successfully managed to make it work on iOS, on Android it turned out to be quite laggy and something didn't seem right...

Jun 10, 2021 · 3 min read · andrei-zgirvaci.hashnode.dev  
Updated Jan 10, 2022  
Read the article

-   [#react-native](https://hashnode.com/tag/react-native)
-   [#animations](https://hashnode.com/tag/animations)
-   [#reactjs](https://hashnode.com/tag/reactjs)
-   [#frontend-development](https://hashnode.com/tag/frontend-development)
-   [#mobile-development](https://hashnode.com/tag/mobile-development)

## Written by

[Andrei Zgirvaci](https://hashnode.com/@andrei-zgirvaci)

@andrei-zgirvaci · Bali, Indonesia

  
[View profile](https://hashnode.com/@andrei-zgirvaci)

React Native Developer | Mentor

Software Developer with over 7 years of experience building Mobile Apps and Websites. Founder of multiple startups, two of which have been featured in Forbes and one that won the Cellerant Best of Class Technology Award for emerging dental products.

## Responses 2

Markdown supported · ⌘↵ to post

[Michel dos Santos Kuguio](https://hashnode.com/@mskjapa)

[Jan 5, 2022](https://hashnode.com/posts/react-native-reanimated-2-collapsing-header-flatlist-tips/60c20ce4a422035623a7d5af/comment/61d5386646e56e75ab375228)

i have same problem, i don know but i think pull refresh is not work when use my collapsable header. today i refactory my code withe reanimated 2 and change animation height to transform. the animate i think is well but pull refresh i will need to fix. i will try you solution. and i will be very thankful if you share a example in a github. but i understand if you cant. and im be grateful fo you post! thx

[Andrei Zgirvaci](https://hashnode.com/@andrei-zgirvaci)

[Jan 5, 2022](https://hashnode.com/posts/react-native-reanimated-2-collapsing-header-flatlist-tips/60c20ce4a422035623a7d5af/comment/61d5386646e56e75ab375228#reply-61d53a93220e98797766a3bd)

Hey Michel,

Try to follow this issue, maybe it helps: [stackoverflow.com/questions/54934513/offset-refre…](https://stackoverflow.com/questions/54934513/offset-refreshcontrol-in-react-native/63258603#63258603)

Unfortunately, I can't share my code, but you can find some similar code that I included above in the article.

Hope it helps :)

[Vadim Savin](https://hashnode.com/@vadimsavin)

[Jun 11, 2021](https://hashnode.com/posts/react-native-reanimated-2-collapsing-header-flatlist-tips/60c20ce4a422035623a7d5af/comment/60c329bf1e145957d5af6bdf)

Great article Andrei, but some visuals would really help deliver your point. Would love to see some images or gifs of the result

[Andrei Zgirvaci](https://hashnode.com/@andrei-zgirvaci)

[Jun 11, 2021](https://hashnode.com/posts/react-native-reanimated-2-collapsing-header-flatlist-tips/60c20ce4a422035623a7d5af/comment/60c329bf1e145957d5af6bdf#reply-60c32ab6a25fa357af83f396)

Thank you! Yeah, I would love to share the visuals, unfortunately, is work-related 🙂
