SwiftUIで少し凝ったアニメーションを実装した話 - Kyash Product Blog

はじめに はじめまして。KyashのモバイルチームでiOSアプリの開発を担当している emoto です。 Kyash Advent Calendar 2022の12/11担当分です。 今回、下のような少し凝ったアニメーションを SwiftUI で実装しましたので、その概要を紹介します。 このアニメーションを実装したのは、Kyashアプリでカード発行を申し込む際に最初に表示される画面です。 Kyashで発行するカードは利便性だけでなく、デザインにもこだわっているので申し込み時に実際のデザインや選んだカラーを表面と裏面で切り替えて確認できるようにしています。 実装のポイント この記事のポイントは下記の2つです。 アニメーションを2つに分割する アニメーションの完了を判定する方法 こちらのサンプルアプリでコードを一部紹介します。 前提 まず前提から。 Viewの「Z軸方向の上下」と「位置」を変え