Reproducing Popular iOS Controls Part 2: Robinhood

Jul 17 2018

In part two, you’ll dissect three UI components of the Robinhood app: the card-like newsfeed, the animated ticker control, and the interactive graph. By Lea Marolt Sonnenschein.

Leave a rating/review
Save for later
Share
Contents

Contents

Hide contents

Reproducing Popular iOS Controls Part 2: Robinhood

3 mins

Part two of our new course, Reproducing Popular iOS Controls, is ready for you today! In this part of the course, you’ll study and recreate three UI elements of the Robinhood app:

  • Card-like newsfeed control
  • Animated ticker control
  • Interactive graph

Take a look at what’s inside:

Part 2: Robinhood

  1. Introduction: 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.
  2. Newsfeed Control: 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.
  3. Card-Swipe Collection View Layout (Swipe-to-Remove): In this video you’ll learn how to create a custom UICollectionLayout that looks just like the Robinhood newsfeed.
  4. Animating a Card Stack: This video will teach you how to set up gestures and animations in a scalable way.
  5. Challenge: Number Indicator: In this challenge your task is to interactively animate the bottom cell that appears when the user swipes on the top one.
  6. Plotting Data: This video is all about data. We’ll learn when it makes sense to add a graph and how to plot one with UIBezierPaths.
  7. Interactive Graph: This video will teach you how to create an interactive graph that lets the user move through its data with their finger.
  8. Constraining the Timestamp: In this video you will be challenged to figure out a cool Auto Layout issue.
  9. The Ticker: In this video we’ll discuss the ticker control and see how to implement it.
  10. Showing the Data: This video will teach you how to hook up the interactive graph with the ticker and create a seamlessy scrolling price.
  11. Conclusion: In this video we’ll review what we learned, what you can do to learn more, and what awaits in the next section.

Where To Go From Here?

Want to check out the course? You can watch the course Introduction and Interactive Interpolation and Normalization for free!

The rest of the course is for raywenderlich.com subscribers only. Here’s how you can get access:

  • If you are a raywenderlich.com subscriber: The first two parts of the course are ready for you today! The rest of the course will be released later this week. You can check out the course here.
  • If you are not a subscriber yet: What are you waiting for? Subscribe now to get access to our new Reproducing Popular iOS Controls course and our entire catalog of over 500 videos.

Stay tuned for more new and updated courses to come. I hope you enjoy the course! :]