Chapter 26
Creating an App Store like Animation From Scratch

You have likely used Apple's built-in App Store app. In the Today section, it presents users with headlines, various articles, and app recommendations. What interests many of us is the animated view transition. As shown in Figure 1, the articles are listed in a card-like format. When tapped, the card pops out to reveal the full content. To dismiss the article view and return to the list view, simply tap the close button. If you are unsure about what I mean, the best way to understand these views is to open the App Store app on your iPhone and try it out.

Figure 1. Apple's App Store app
Figure 1. Apple's App Store app

In this chapter, we will construct a list view and implement an animated transition using SwiftUI that is similar to the one we discussed earlier. Specifically, you will learn the following techniques:

  • How to use GeometryReader to detect screen sizes
  • How to create a variable-sized card view
  • How to implement an animated view transition similar to the one found in the App Store

Let's get started!

To access the full content and the complete source code, please get your copy at https://www.appcoda.com/swiftui.

results matching ""

    No results matching ""