[SwiftUI]スケールアニメーションをするには？

どうも、ちょげ(@chogetarou)です。

ビューを拡大・縮小するアニメーションをする方法を紹介します。

方法

スケールアニメーションをするには、scaleEffect修飾子を使います。

まず、ビューにscaleEffect修飾子を付与します。

scaleEffect修飾子の引数に、ビューの拡大率を指定します。

次に、ビューにアニメーションを付与します。

ExampleView(・・・)
   .scaleEffect(拡大率)
   .animation(・・・)

あとは、scaleEffectの引数に指定している拡大率を変化させます。

使用例

struct ContentView: View {
    @State var isBig = false
    var body: some View {
        VStack {
            Spacer()
            Rectangle()
                .frame(width: 100, height: 100)
                .scaleEffect(isBig ? 2.0 : 1.0)
                .animation(.easeInOut, value: isBig)
            Spacer()
            Button("Switch") {
                self.isBig.toggle()
            }
            Spacer()
        }
    }
}

オススメの記事

[SwiftUI]アニメーションを移動に追加するには？

[SwiftUI]Buttonにタップアニメーションを付けるには？

[SwiftUI]Toggleでアニメーションをするには？

[SwiftUI]フェードインのアニメーションをする方法