PanGesture slide-in half modal Bottom Card tutorial for UIKit + Swift

Опубликовано: 12 Октябрь 2024
на канале: Aivars Meijers
21,654
647

I spent the whole day creating a slide-out half modal screen for one of the freelance projects and just had to create a tutorial about it. Partly because you asked when I shared the result on Instagram, but mostly for future self do not browse documentation and tutorials again a few months later :)
-
⚠️ Link to the GitHub project: https://github.com/aivars/SlideOverTu...
-
Works fine and tested on Xcode 11 & 12
Used UIKit, UIPresentationController, and GestureRecognizer to get this result.
Documentation and tutorials:
----------------------------------------------------------------------------------------------------
UIPresentationController : https://developer.apple.com/documenta...
raywenderlich tutorial: https://www.raywenderlich.com/3636807...
PanGesture + Codable slider UI tutorial:   / pangesture-slidable-view-swift-5  
Draggable modal view:    • How to make a Dissmisable, Draggable ...  
----------------------------------------------------------------------------------------------------

Other links:
📸:   / aivars_meijers  
🐦   / aivars_meijers  

🖥 Gear I'm using for programming:
----------------------------------------------------------------------------------------------------
Grovemade desk shelf: https://glnk.io/7yrj/aivarsmeijers
Big 49” Monitor: https://amzn.to/2VPeXZk
24” 4K Monitor: https://amzn.to/2C457vP
Monitor mount (I got x2 40cm pole set): https://amzn.to/30zlTvc
eGPU Closure + Win gaming card: https://amzn.to/3ejW9ry
Radeon Video Card for eGPU: https://amzn.to/2W4opby
16” MBP: https://amzn.to/2W4iRhe

🎥 YouTube video gear:
----------------------------------------------------------------------------------------------------
Big Full Frame camera: https://amzn.to/3gG17AK
Full Frame Youtube & all-around lens: https://amzn.to/2ZZSmup
Small vlogging camera: https://amzn.to/3031CxW
Affordable but great vlogging lens: https://amzn.to/3gG1j2W
Fast YouTube & vlog lens: https://amzn.to/2W8ul3e
💡 Lights:
Great affordable light what I use in videos: https://amzn.to/3fiFczn
Soft-box for light: https://amzn.to/3gOj5ks
🎤 Sound:
Affordable & good Shotgun microphone: https://amzn.to/2ZRIrac
Wireless microphone: https://amzn.to/2DxCCYb
----------------------------------------------------------------------------------------------------
Some of the links above are affiliate links, and I earn a small commission if you click on the link and purchase.
You are not obligated to use them, but it does help fund my videos and hopefully bringing value to you!

Timestamps/chapters:
0:00 Intro
1:00 Documentation and Tutorials
1:33 Tutorial Start
2:20 Custom UIPresentationController
5:51 Slider View UI
9:57 Adding Gesture handler to the Slider View
12:08 Trigger Slider from the main screen
13:34 Test the result
13:51 Outro