Reproducing Popular iOS Controls

Jul 10 2018 · Intermediate · Video Course · 2 hrs, 38 mins

In this course you'll learn how to combine the Swift and UIKit knowledge you've gained from our other other courses to reproduce some cool iOS apps!

Version

  • Swift 4, iOS 12, Xcode 10

Snapchat

Introduction

3:47 Free

Have you ever used an app where everything you did and touched felt great? In this video, we look at the four great apps we'll learn to build in this course.

1

Snapchat is a design pioneer. This video teaches you about Snapchat's groundbreaking scrolling navigation, and how to implement it.

2

In this video you'll learn how to implement Snapchat's scrolling navigation by embedding your view controller navigation inside a scrollview.

3

Scrolling is a really useful vehicle for animations. In this video, find out how to use it with interactive interpolation and normalization.

4

In this challenge you'll animate the background color for the left and right screens as the user scrolls.

5

This video explains how to build a control like the lens filters in Snapchat.

6

In this video you'll learn how to create a custom flow layout.

7

This video will teach you some nifty tricks for dealing with scrolling content.

8

In this challenge you'll enhance the control by letting the user tap on a cell to select it.

9

Conclusion

0:52

In this video we'll review what we learned, what you can do to learn more, and what awaits in the next section.

10

Robinhood

In this video you'll learn about the next app we're dissecting, Robinhood, and the three key UI component that you'll learn to build.

11

First up is the newsfeed, and in this video we discuss that control and card-like UIs in general, then figure out how to build it.

12

In this video you'll learn how to create a custom UICollectionLayout that looks just like the Robinhood newsfeed.

13

This video will teach you how to set up gestures and animations in a scalable way.

14

In this challenge your task is to interactively animate the bottom cell that appears when the user swipes on the top one.

15

This video is all about data. We'll learn when it makes sense to add a graph and how to plot one with UIBezierPaths.

16

This video will teach you how to create an interactive graph that lets the user move through its data with their finger.

17

In this video you will be challenged to figure out a cool Auto Layout issue.

18

The Ticker

1:43

In this video we'll discuss the ticker control and see how to implement it.

19

This video will teach you how to hook up the interactive graph with the ticker and create a seamlessy scrolling price.

20

Conclusion

1:12

In this video we'll review what we learned, what you can do to learn more, and what awaits in the next section.

21

App Store & Maps

In this video we'll talk about two interesting Apple apps - the App Store and Maps and how their custom presentations make them shine.

22

In this video you'll learn about custom transitions, particularly as they pertain to the App Store app.

23

In this video you'll learn how to set up a scalable stage for the presentation transition.

24

In this video you'll implement the animatons for the custom modal presentation as seen on the App Store app.

25

In this challenge you'll tackle the custom modal dismissal of the App Store app.

26

In this video, we'll discuss and implement another way to dismiss our modal and learn about view snapshots.

27

In this video you'll learn about the pull-up control in Maps and why card UIs are so darn popular.

28

In this video you'll learn how to implement a custom UIPresentationController.

29

In this challenge you'll implement the half-way dragged anchor point for the draggable controller.

30

Conclusion

1:26

In this video we'll review what we learned and what you can do to learn more about the specific topics.

31

Contributors

Comments