Days I learn SwiftUI

Developed with Xcode Version 12.0 Beta 2

Day 1: Text/Typography

• font size / custom font
• font color / font family

Day 2: Colors&Images

• .frame()
• .resizable()
• .ClipShape()

Day 3: Stacks with Colors

• VStack and HStack
• Random colors.

Day 4: LazyStacks

LazyStacks which print out current loaded items in the console.

Day 5: Grid

Grids with random colors.

Day 6: Navigation View

NavigationView() and NavigationLink().

Day 7: TabView

NavigationView() nested in a TabView().

Day 8: Clock & DateFormatter

• timeFomatter
• dateFormatter
• Timer to update the time;

Day 9： Property Wrapper @Transaction

Custom property wrapper @Transaction to commit or rollback changes to a value.

Credit: Ian Keen

Day 10: ProgressView

Default circular style and linear style.

Day 11: Forms & Pickers

• Pickers
• DatePickers
• Nested in a Form

Day 12: Custom Circular ProgressView

Custom Circular ProgressView.

Credit: Josh Kannenberg .

Day 13: Slider+CircularProgressView

Credit: (2) SwiftUI - Circular Progress View - YouTube

Swift Packages:

• dawigr/BarChart: SwiftUI Bar Chart

• honkmaster/TTProgressHUD: TTProgressHUD is a light weight HUD written in SwiftUI meant to display the progress of an ongoing task on iOS.

• maustinstar/shiny: Shiny uses your gyroscope to simulate lighting and motion effects on colors. Works on almost every SwiftUI View.

• maustinstar/swiftui-drawer: A SwiftUI bottom-up controller, like in the Maps app. Drag to expand or minimize.

• Cay-Zhang/SwiftSpeech: A speech recognition framework designed for SwiftUI.

• exyte/Grid: The most powerful Grid container missed in SwiftUI

Readings:

• Understanding Function Builders in Swift • Andy Ibanez
• Using CSS-like Grid Layout in SwiftUI 2020

Day 14: UIBlurView

Create UIBlurView with UIViewRepresentable. (Just a normal view wrapped in a UIView, IMO.)

An AppleTV Dashboard mockup with:

• TextView
• IconView
• ModuleView

Credit to Jordan Singer.

Day 15: Alert + Stepper

Credit: Paul Hudson

• Stepper`
• Alert
• DatePicker()
• NavigationView()
• Button()

Day 16: PKCanvasView

Draw and save drawings. (Lot of bugs, dunno why.)

PencilKit Canvas View, i think it is.

• view created with UIViewRepresentable
• different inking tools;
• ColorPickerView()
• Eraser etc..

Day 17: Custom "gif" view

Swift Package:

• add support pkg; (https://github.com/airbnb/lottie-android)
• Create LottieView with UIViewRepresentable;
• use LottieView like any other SwiftUI View.

Can find more lottie files: https://lottiefiles.com/ .

Day 18: .matchedGeometryEffect

• A button to show and hide a view;
• Matching Animation to animate the process (with matchedGeometryEffect).

Someday: UISearchBar

Todo: Building a Search Bar in SwiftUI | Mastering SwiftUI