Back to Browse

Making Dating App Animation in SwiftUI - Full Tutorial | iOS

578 views
Feb 18, 2025
37:49

In this video, I’ll show you how to make dating app animation in SwiftUI. ➡ The first part is recreating a swiping card animations like in popular dating apps such as Tinder and Bumble. In this part, you’ll learn how to use drag gesture with @GestureState to move multiple views at once to create subtle animations. ➡ The second part, I’ll make a view showing people liking each other. I’ll walk you through the process on how I create complex animations. Furthermore, I’ll create a particle effect using a powerful SwiftUI library called Vortex, created by Paul Hudson from Hacking with Swift. ➡ Finally, I’ll combine those views together with SwiftUI navigation. What you’ll learn: ➡ How to use `DragGesture` and `@GestureState` to perform subtle animations ➡ SwiftUI translation and transformation view modifiers ➡ A process to create complex animations ➡ Installing package using Swift Package Manager ➡ How to use Vortex to create beautiful particle effects Chapters: 00:00 Introduction & Demo 00:40 Card UI 01:55 DatingView 22:10 MatchedView 30:15 Particle Effects using Vortex 33:28 Like Action and Navigation 💻 Source Code: ➡ https://github.com/appbeyond-io/DatingCardAnimation-iOS 🔔 Subscribe this channel for more videos: ➡ https://www.youtube.com/@appbeyond 🚀 Follow me on social: ➡ X / Twitter: https://x.com/yossabourne ➡ LinkedIn: https://www.linkedin.com/in/yossa-bourne-765865125/ 💻 Install and learn more about Vortex: https://github.com/twostraws/Vortex 📷 Photo References - https://unsplash.com/photos/a-man-standing-in-front-of-a-blue-wall-q2T4yv5_7Wk - https://unsplash.com/photos/a-woman-standing-on-the-beach-with-her-eyes-closed-KIJXFzFkWrE - https://unsplash.com/photos/a-woman-sitting-on-a-bench-with-her-hand-on-her-head-D0LtZUq5JCA?utm_content=creditShareLink&utm_medium=referral&utm_source=unsplash - https://unsplash.com/photos/a-woman-is-posing-for-a-picture-with-her-hand-on-her-chin-ZIRCZUqvl0g - https://unsplash.com/photos/a-woman-sitting-at-a-table-with-a-glass-of-wine-jv8a_A7_XjA - https://unsplash.com/photos/a-woman-taking-a-picture-of-herself-with-a-camera-ZI733w46T04 - https://unsplash.com/photos/a-woman-in-a-red-dress-standing-on-the-street-bGMXjkaYpG8 Dating App Animation | Card Animation | Card Swiping Animation | Card Swipe | Particle Effect | Tinder | Bumble | CMB | Coffee Meets Bagel | SwiftUI | Swift | iOS | Xcode | App Development | Animation | Full Tutorial | Code Along #apple #ios #swift #swiftui #xcode #animation #design #tutorial #codealong #coding

Download

0 formats

No download links available.

Making Dating App Animation in SwiftUI - Full Tutorial | iOS | NatokHD