AWESOME React Native carousel animation 60fps - FlatList and Animated API

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

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

  • @techienomadiso8970
    @techienomadiso8970 3 года назад +13

    Catalin you are the best Teacher out here for React Native Animations. Your tutorials should be added to react-native docs as official example reference. Great Work!

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Wow, thank you so much Francis, I’m glad you think this way! Cheers ✌️

  • @charithagoonewardena3095
    @charithagoonewardena3095 3 года назад +7

    I love this. You deserve more user engagement

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Thank you Charitha! ✌️

    • @zayndominick3842
      @zayndominick3842 3 года назад

      Pro tip : watch movies on flixzone. I've been using them for watching lots of of movies these days.

    • @brayancolin9377
      @brayancolin9377 3 года назад

      @Zayn Dominick Yup, I have been watching on flixzone} for since december myself =)

    • @mohammadcastiel3901
      @mohammadcastiel3901 3 года назад

      @Zayn Dominick yup, I've been watching on Flixzone} for years myself =)

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

    Awesome video Catalin! Very clean and beautiful! Keep it going!

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

    You made so much with just native react native's resources, this is amazing, thank you very much.

  • @ChandlerVanDeWater
    @ChandlerVanDeWater 3 года назад +3

    Your tutorials are so quick and have such a clean approach. Thank you for making these!

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      I’m glad that you found them useful and easy to follow. Thanks a lot for sharing this with me Chandler ✌️

  • @TheSalaho1
    @TheSalaho1 3 года назад +1

    holly shit, you're incredible, there's a fine line between a nice engaging animation and a frustrating one and the ones you're teaching are very engaging ! always appreciate your content!

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Thanks a lot for sharing such an amazing feedback! ✌️

  • @DivineZeal
    @DivineZeal 8 месяцев назад

    Perfect video! Helped me finally understand animated!

  • @admiralicic
    @admiralicic 3 года назад

    This channel deserves much more subscribers, great content

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

    Hi, I'm waching your vedio in Korea! I think your tutorials are very very eaaaasy to learn and helpful for beginners like me !! Thank you so much !!

  • @erlanakylbekovich4586
    @erlanakylbekovich4586 3 года назад

    Thank you Catalin for this guid and other! You are the best teacher ever!

  • @ejdatertas21
    @ejdatertas21 7 месяцев назад

    you are not human, you are an angel :)) thanks for your effort

  • @saziknows
    @saziknows 3 года назад

    You are God's gift to react native

  • @arjuntt2604
    @arjuntt2604 3 года назад

    Sure this guy will reach million viewers in no time.

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

    Thanks for all the amazing videos and tutorials. Many thanks

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

    you are the best bro ......... i can't thank you enough 🙏

  • @akbarsheikh5690
    @akbarsheikh5690 3 года назад

    Your design is amazing,beautiful.loved it ....please make more videos like this

  • @sarcasticdna
    @sarcasticdna 3 года назад

    I just discovered your channel
    Loved it
    Subbed it
    Looking forward for more 😍❤️.
    BTW I am new to RN is there a beginner series for animations?

  • @joze.rios44
    @joze.rios44 3 года назад

    Greeting from Argentina!

  • @kevinjeanmichel3824
    @kevinjeanmichel3824 3 года назад

    Your tutorials are just awesome thanks for what you're doing

  • @JeanPierreCasanovaFuentes
    @JeanPierreCasanovaFuentes 3 года назад

    I gonna buy you a cup of coffee! you deserve it! I've learn a lot from you!

  • @zohrekhedmati1110
    @zohrekhedmati1110 3 года назад

    Wowww😍😍😍
    It was amazing way to do that, thank you😍

  • @ehtishamtahir2187
    @ehtishamtahir2187 3 года назад

    Your explanation though 👌👌👌

  • @alexkey9372
    @alexkey9372 3 года назад

    I discovered your channel late but I'm so glad! Out of curiosity, as I'm new to react native animations, all the Animated API functions work the same with with reanimated1 or reanimated2 framework?

  • @khalidkhan5308
    @khalidkhan5308 3 года назад

    Congratulation on 9k

  • @지울최
    @지울최 3 года назад

    thank so mush , you are the best Teacher

  • @bedirhanaygul805
    @bedirhanaygul805 3 года назад

    Thank you for your awesome videos Catalin, you rockkk!! 💯💯✌👏👏

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Thanks for sharing this kind words with me Bedirhan ✌️

  • @SaadKhan-xf3ry
    @SaadKhan-xf3ry 3 года назад +1

    as always amazing content, can someone explain what's going on with the input range? is (index - 1) * width means the previous item, index * width = currentItem and (index + 1) * width = next item in flatlist? Thanks!

  • @myrelaxpoint
    @myrelaxpoint 3 года назад

    Wow. That was awesome.

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      I’m glad that you found it useful. Thanks Bhaskar ✌️

  • @turnbrain3049
    @turnbrain3049 3 года назад

    Thank you so much! Your tutorials are so quick and have such a clean approach, How I can make the Flatlist loop?

  • @CarlitosUlloa20
    @CarlitosUlloa20 3 года назад

    Great, what a great job; Thank you very much for your contribution.

  • @ayoubbelouadah7195
    @ayoubbelouadah7195 3 года назад

    Amazing as always *-*

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

    its very good

  • @pranavkumar1818
    @pranavkumar1818 3 года назад

    C'est tres jolie. Merci !!!

  • @amitmehta8554
    @amitmehta8554 3 года назад

    You are genuine person

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Wow, thank a lot Amit! It means a lot to me. ✌️

  • @shawwalmuhammad
    @shawwalmuhammad 3 года назад

    This looks awesome 😎 👍🏻

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Thanks for sharing such positive feedback, I'm glad that you like it! Thanks Shawwal ✌️

    • @shawwalmuhammad
      @shawwalmuhammad 3 года назад

      @@CatalinMironDev you're most welcome. I really enjoy it and it help me to learn a lot.

  • @alon77777
    @alon77777 3 года назад

    Short and useful, thanks!

  • @ManHaru1
    @ManHaru1 3 года назад

    Awesome!!!! 👍👍
    Very useful!!

  • @riz-l2123
    @riz-l2123 3 года назад

    Your tutorials are absolutely amazing, they've really helped me so much. Do you think you'll release a full project tutorial any time soon? Thanks!

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Thanks a lot! I’m working on a full course. Stay tuned ✌️

    • @riz-l2123
      @riz-l2123 3 года назад

      @@CatalinMironDev Thanks! You're the best :)

  • @enableDeepak
    @enableDeepak 3 года назад

    You're amazing. I love watching your videos more than OTT shows :D. If possible, please make a video on a full-screen image carousel with a masking effect.

  • @vitorrazdorov6017
    @vitorrazdorov6017 3 года назад

    Realy cool, thanks man for you job)

  • @cristiancamilosanchezardil9730
    @cristiancamilosanchezardil9730 3 года назад

    Awesome !!!

  • @cfboski2587
    @cfboski2587 3 года назад +3

    You've taught me so much during the pandemic.. One day i'll repay you!

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      I’m really happy to hear that my videos helped you. Thanks a lot Bosco ✌️

  • @dilipsuthar2817
    @dilipsuthar2817 3 года назад

    This is awesome :)
    Can you please let me know which fonts and theme you have used in vscode?

  • @LeandroSimoesArt
    @LeandroSimoesArt 3 года назад +3

    Amazing! Do you have any complete course about react-native animations or are planning to do that sometime?

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Hi Leandro, I’m working on it. I’ll let you know once it’s ready. Thanks ✌️

    • @AkshatKumawat
      @AkshatKumawat 3 года назад +1

      Thank you for asking.. i'm waiting for it 🔥

    • @LeandroSimoesArt
      @LeandroSimoesArt 3 года назад

      @@CatalinMironDev Thanks! Looking forward to it!!!

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

    SALVOU DEMAIS!!!!

  • @amanngoel
    @amanngoel 3 года назад

    This is magic ❤️

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Wow, thanks Aman, I’m glad you think so ✌️

  • @karemhz
    @karemhz 3 года назад

    Really nice, Thanks

  • @tanujupreti
    @tanujupreti 3 года назад

    That is indeed an amazing one ❤

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Thank you Tanuj, I'm glad that you enjoyed the tutorial! ✌️

  • @Zahid110-r7u
    @Zahid110-r7u 2 года назад

    Keep doing this more videos please

  • @missinglyrics1918
    @missinglyrics1918 3 года назад

    always great

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Thanks Gan, I’m glad that you liked it ✌️

  • @PCPalacetech
    @PCPalacetech 3 года назад

    Hey man, which font are you using. Its cool !

  • @-leovinci
    @-leovinci 3 года назад

    Learn so much!
    Question: Can we implement backdrop blur like CSS(backdrop-filter: blur) without other libraries?

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Unfortunately no, you need to use BlurView for it:(

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

    Neat!💎✨👌

  • @theintrovertedguy73
    @theintrovertedguy73 3 года назад

    Awesome stuff brother. There is a lot to learn from you. pls, keep teaching :D
    btw I know you showed an animation way of doing it, but if we do it with imageBackground, is there any problem?

  • @charithagoonewardena3095
    @charithagoonewardena3095 3 года назад

    Waiting for your next vid.. :D

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

    Hi Catalin, can you make video for Image slider with zoom in/out in react native

  • @r_alisher
    @r_alisher 3 года назад

    Thank you a lot of

  • @charithagoonewardena3095
    @charithagoonewardena3095 3 года назад

    I think for android you have to use elevate to get the shadow effect yeah?

  • @haibertbarfian6343
    @haibertbarfian6343 3 года назад

    Hey Awesome video but can this be done in Reanimted V2 ? the community is moving toward Reanimated to be able to harness the power of having animations run on the UI thread. Unfortunately I cannot see any videos covering carousels using reanimatedV2

  • @lifegrowth9389
    @lifegrowth9389 3 года назад

    Shall we.... Let go Sir

  • @programmersohel
    @programmersohel 10 месяцев назад

    Thanks

  • @leamsilee9284
    @leamsilee9284 3 года назад

    I learned so much from this video! Thank you!
    I have a question. It doesn't recognize the useRef (that refers to the flatlist) in android.
    The next and previous button is acting weird because of that. Is there another way to do it?

  • @phannam7211
    @phannam7211 3 года назад

    Great!

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Thank you Phan ✌️

    • @phannam7211
      @phannam7211 3 года назад

      @@CatalinMironDev
      Succulent can be picked up and made animated picked on android like ios

  • @Gabriel-zt7pk
    @Gabriel-zt7pk Год назад

    what is the font family in vscode in this video?

  • @npaul1440
    @npaul1440 3 года назад

    Im not sure why but im getting error as "InputRange must be monotonically non-decreasing " for the input range for background Image map range

  • @MJ-vx5cz
    @MJ-vx5cz 2 года назад

    where did you learn all of this ?

  • @donirizki2717
    @donirizki2717 3 года назад

    Awesome Carousel animation with React Native

  • @willenleal1099
    @willenleal1099 3 года назад

    Thank you so much for this video! I tried to follow your tutorial on the Animation for the Flatlist for the movies video. I could not make it work there. But using the opacity technique with the map function made the backdrop work on android. Idk why but Flatlist items with absolute position do not work on android. :-(

  • @joze.rios44
    @joze.rios44 3 года назад

    Hello boss, well i copy the exactly code and my Android App does not work..it just close after the first Scroll...and it isn't a Expo issue...because i use npx react native init...can you say me which is problem?

  • @mohammadsadman8567
    @mohammadsadman8567 3 года назад

    great one brother! i have one question if i use your animation tutorials in low end android mobile! will it support low end android mobile! will it hang or stutter?

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Even on low end android devices this will run at 60fps. Thanks Mohammad ✌️

    • @mohammadsadman8567
      @mohammadsadman8567 3 года назад

      @@CatalinMironDev Thank you for your resources ❤️

  • @hetpatel958
    @hetpatel958 3 года назад

    Vs code Theme please. Nice work. Keep it up. Love from India.

    • @CatalinMironDev
      @CatalinMironDev  3 года назад

      Hi Het, VSCode theme: Palenight, font: Operator Mono. Cheers ✌️

  • @I-MM-O-R-T-A-L
    @I-MM-O-R-T-A-L 4 месяца назад

    love you

  • @vicheanath9412
    @vicheanath9412 3 года назад

    Please compare about expo and react native cli

  • @oscarparedez1417
    @oscarparedez1417 3 года назад

    Is there a way to make this flatlist move through the images automatically?

  • @all-in-all7862
    @all-in-all7862 3 года назад

    I love this video, Please can you create drag and sort or rearrange image in Flatlist.Thanku

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Great suggestion, I’ll think about it and see what I can come up with. Thanks Pradeep ✌️

    • @all-in-all7862
      @all-in-all7862 3 года назад

      @@CatalinMironDev
      Thanks brother

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

    how if the pics of data already set in folder?

  • @floodyboy5307
    @floodyboy5307 3 года назад

    Big wooow 😍👌🏼

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      I'm glad that you liked it! Thanks Floody boy ✌️

  • @inthefuture946
    @inthefuture946 3 года назад

    Really nice videos. Thanks a lot. Can you also make a video for auto swiping of carousels in addition to the scroll function.

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

    Wow, How to make a VS CODE Theme like that??? ⭐⭐⭐⭐⭐

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

    What is your vscode font name

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

    Without background can you repost this carousel videoo animation please

  • @ahsanfarooq6755
    @ahsanfarooq6755 3 года назад

    how to add infinite scroll on this Flatlist?
    i want to repeat my content when data in FlatList ends

  • @NaveenKumar-fo4kz
    @NaveenKumar-fo4kz 3 года назад +1

    Bro bro please make expo with full firebase.

    • @CatalinMironDev
      @CatalinMironDev  3 года назад +1

      Maybe in the near future I'll shift to something else other than animations. Right now there are so many things that I'd like to tackle that I can't do other type of tutorials. Cheers and thanks for your great suggestion Naveen! ✌️

    • @NaveenKumar-fo4kz
      @NaveenKumar-fo4kz 3 года назад

      Ya but please make complete firebase , expo with function based components tutorial because no one make a video about this type perfectly. why I am saying means because lots of person's are working in real time project ,so we get more viewers for our channel 🤗

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

    hello. your editor font is not good for programming

  • @charithagoonewardena3095
    @charithagoonewardena3095 3 года назад

    Bro, your contents are amazing 🤩🤩🤩🤩❤ but your intro is so annoying 🤣

  • @everystack
    @everystack 10 месяцев назад

    none of the tutorials work nowadays

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

    This is not run in Android only run ios

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

    Awesome!