AC/Bounce

起動時のスプラッシュ画面が欲しくて追加してみた。

下記、コードのBounceが、コードが複雑にならず簡単に使えそうなので流用させてもらった。

SwiftUI Text Animation Library

説明

スプラッシュ画面で、アニメーションさせた後に、ホーム画面のViewを起動する。

L.2

@Stateを使用し、アニメーションの終了判定のためのフラグを監視させる。

L.4

isLoading でアニメーション表示判定。

L.5~8

背景色を設定するためZStackで、背景をZ軸方向に重ね合わせ。背景は、Color で色指定を行う。

L.10~21

VStackを使用し、ロゴの下にBounce View のアニメーションを配置。0.5秒ずつずらして、３つアニメーションを動かす。.padding使って上方向に30px余白追加。

L.23~27

もっとスマートな方法がある気がするが、アニメーションを指定秒表示させるため、View表示開始時に .onAppearで、非同期タスク起動させ 指定秒遅らせて、その後isLoadingをtoggleさせることで、アニメーション表示を抜けるようにした。

L.29~33

アニメーション処理終了後にホーム画面を呼び出す。EnrionmentObjectでデータ共有するためにUserData()オブジェクトをを初期化して、EnvrironmentObjectでContentViewに渡す。

struct Bounce: View {
    @State private var isLoading = true
    var body: some View {
        if isLoading {
            ZStack {
                Color.white
                    .opacity(0.9)
                    .ignoresSafeArea()
                
                VStack {
                    Image("LaunchScreen")
                        .resizable()
                        .aspectRatio(contentMode: .fit)
                        .padding()
                    
                    BounceAnimationView(text: "仮想通貨", startTime: 0.0, color: Color.black)
                    BounceAnimationView(text: "貴金属", startTime: 0.5, color: Color.black)
                        .padding(.top, 30)
                    BounceAnimationView(text: "外貨資産", startTime: 1.0, color: Color.black)
                        .padding(.top, 30)
                }
            }
            .onAppear {
                DispatchQueue.main.asyncAfter(deadline: .now() + 2.2) {
                        isLoading = false
                }
            }
            
        } else {
            ContentView()
                .environmentObject(UserData())
                
        }
    }
}