SwiftUI Livestream: Bottom Sheet UI with Gestures
The Bottom Sheet is a popular new UI pattern for interactive content and detailed confirmation. This is a more interesting version of the modal with context of the content underneath. Many apps such as the Apple Maps and Uber use this pattern and there are many variations like the Share sheet, Music player and new iOS modals.
Source files: • SwiftUI Livestream: Bottom Sheet UI w...
Topics Discussed
Intro to the Bottom Card UI
Code Basic UI
Drag Gesture
On Release
Snap Position with Offset
Full Screen, Half and Minimized
Resources
📱 Bottom Sheet (Advanced): https://swiftwithmajid.com/2019/12/11...
🎨 Apple Design Resources: https://developer.apple.com/design/re...
🎨 Figma design tool: https://www.figma.com
📱 SF Symbols: https://developer.apple.com/sf-symbols
📱 Dynamic Type: https://developer.apple.com/design/hu...
🍔 Illustrations: https://shape.so
🤳 Phone Mockups: http://angle.sh
Learn UI Design
🖌 UI Design quick apps in Figma: https://designcode.io/quick-apps-figma
🖌 UI Design for developers: https://designcode.io/ui-design
🌈 Design system in Figma: https://designcode.io/figma
🎨 Figma Handbook: https://designcode.io/figma-handbook
📱 iOS Design Handbook: https://designcode.io/ios-design-hand...
Learn SwiftUI
📱 Build an app for iOS 15: https://designcode.io/swiftui-ios15
📱 Build quick apps with SwiftUI: https://designcode.io/quick-apps-swiftui
🛠 SwiftUI Handbook: https://designcode.io/swiftui-handbook
DesignCode
🐦 Twitter: / designcodeio
📸 Instagram: / mengto
#swiftui #iosdev