We’ve arrived at day 89 of the 100 Days of SwiftUI! Yesterday, we learned how to design a single card view and stack them. Today, we’re learning how to add a countdown timer and how to color views as we swipe. Let’s dive in!
Coloring views as we swipe
Users can swipe left or right in our app, depending on if the question was being answered correctly or not. Much like other apps where swiping between cards is used, one side represents good and the other bad.
We’ll solve this problem in two ways: for a phone with default settings we’ll make the cards become colored green or red before fading away, but if the user enabled the Differentiate Without Color setting we’ll leave the cards as white and instead show some extra UI over our background.
Counting down with a timer in SwiftUI
If we bring together Foundation, SwiftUI, and Combine, we can add a timer to our app to add a little bit of pressure to the user. A simple implementation of this doesn’t take much work, but it also has a bug that requires some extra work to fix. Paul explains it all in his article.
Ending the app with allowsHitTesting()
We can disable swiping when the time has run out. This adds a bit of pressure to the users, which results in a more fun experience. By checking when our timer hits zero, we can use that to set allowsHitTesting()
to false
, so that swiping will no longer be possible.
Wrap up
And that’s it for day 89! Tomorrow, we’ll go back to vibrations as we look to making iPhones vibrate when a user answers wrong. We’ll also add functionality to add and delete cards and fix the final bugs. Time to recharge and get ready!
100 Days of SwiftUI – Day 89