2.11 Tutorial - Creating Resizable @IBDesignable Controls in Xcode

Learn Auto Layout Fast

Module 1: Auto Layout 101

1.1 Lecture - Welcome to Learn Auto Layout Fast (4:04)
1.2 Lecture - Auto Layout 101 (1:05)
1.3 Source Code - Download All the Design Assets and Xcode Projects (1:26)
1.3.2 - How to Get Help
1.4 Tutorial - iPhone App UI Design in Storyboard from Scratch (28:26)
1.5 Tutorial - Auto Layout for Beginners (21:10)
1.6 Lecture - UI Design Inspiration (2:27)
1.7 Lecture - Auto Layout for iPhone 8 and iPhone 8 Plus (30:38)
1.8 Tutorial - Auto Layout for iPhone X Safe Area (4:21)
1.9 Tutorial - iPhone X Stretch Graphics to Fill (10:37)
1.10 Tutorial - Auto Layout for iPhone SE (Percentage Based Layouts) (14:30)
1.11 Bug Fix - Decoding Auto Layout Colors (10:44)

Module 2: Resizable Graphics for iOS Apps

2.0 Lecture - Resizable Graphics for iOS Apps (1:54)
2.1 Download - Design and Xcode Project Files
2.2 Tutorial - Sketch for iPhone App UI (14:13)
2.3 Tutorial - How to Import Images and Vectors into Xcode (6:04)
2.4 Tutorial - Design the Login Screen UI (10:19)
2.5 Tutorial - Auto Layout for Login Screen (34:46)
2.6 Bug Fix - Login Screen Problems and Solutions (8:54)
2.7 Tutorial - Resizable Graphics in Xcode 9 and Password TextField Tweaks (14:21)
2.8 Tutorial - Create Resizable Buttons in Sketch (21:03)
2.9 Tutorial - Import Resizable Buttons into Xcode 9 (19:05)
2.10 Tutorial - Creating Resizable @IBDesignable Controls in Sketch (11:24)
2.11 Tutorial - Creating Resizable @IBDesignable Controls in Xcode (40:14)

Module 3: Auto Layout Quick Tips

3.0 Lecture - Quick Auto Layout Tips for iOS Apps (0:52)
3.1 Download - Design and Xcode Project Files
3.2 Tutorial - How to Center 3 Equal Width Buttons (6:58)
3.3 Tutorial - How to Use Stack Views (6:06)
3.4 Tutorial - When to Use Stack Views (15:04)
3.5 Tutorial - Speed Test Stack View vs Auto Layout (10:46)
3.6 Tutorial - 3 Ways to Preview Layout Constraints (6:40)
3.7 Tutorial - Frame Based Layouts vs. Constraint Based Layouts (3:45)
3.8 Tutorial - How to Rotate Your Auto Layout Constraints with Size Classes (4:19)
3.9 Tutorial - Hide and Show a View with a Stack View (5:22)

Module 4: Auto Layout for Table Views and Collection Views

4.0 Lecture - Table View and Collection Views (1:30)
4.1 Download - Design and Xcode Project Files
4.2 Tutorial - Auto Layout for Table Views and Prototype Cells (19:56)
4.3 Tutorial - How to Create Custom Table View Cells (25:44)
4.4 Tutorial - Auto Layout for Fullscreen Collection Views Cells (25:39)
4.5 Tutorial - Auto Layout for Image Grid Collection Views Cells (24:11)
4.6 Tutorial - Create a UIScrollView using Auto Layout in Storyboard for Xcode 9 (14:12)

Module 5: Programmatic Auto Layout with Swift 4

5.0 Lecture - How to Create UI and Auto Layout in Swift Code (1:02)
5.1 Download - Design and Xcode Project Files
5.2 Tutorial - Create a ViewController without the Storyboard in Swift (5:44)
5.3 Tutorial - 3 APIs to Create Auto Layout Constraints with Code (17:45)
5.4 Tutorial - How to Use the Auto Layout Visual Constraint Language (24:05)
5.5 Tutorial - More Visual Constraints and How to Fix Common Layout Problems (30:37)
5.6 Tutorial - How to Use the Auto Layout Anchors in Swift Code (26:18)
5.7 Tutorial - How to Use the NSLayoutConstraint in Code (8:02)
5.8 Tutorial - Create a UITableView App Using Only Swift Code - Part 1 (39:07)
5.9 Tutorial - Cleanup the UITableViewCell and Test Resizing - Part 2 (15:05)
5.10 Tutorial - Login App UI in Swift Code - Part 1 (27:02)
5.11 Tutorial - Login App UI in Swift Code - Part 2 (47:47)
5.12 Tutorial - Animating Two Types of Auto Layout Constraints (15:41)

BONUS

Bonus 1 - How to Diagnose and Fix Auto Layout Constraints Quickly (11:15)
Bonus 2 - How to Update Auto Layout Constraints without Breaking Your UI (11:47)
Bonus 3 - Auto Layout Workbook 1
Bonus 4A - 3 Calculator UI Challenges (2:35)
Bonus 4B - Fix the Bug Challenges (0:27)
Bonus 4A - Solution Calculator with Manual Auto Layout (15:23)
Bonus 5 - Case Study - 3 App Store Tear Downs (15:31)

Additional Workshops

Lecture contents locked

Enroll in Course to Unlock

If you're already enrolled, you'll need to login.