RotationGestureで回転させる
Published by @SoNiceInfo at 6/24/2020
RotationGestureは2本指で行う操作で、SwiftUIから回転角度が提供されるので簡単に回転を実装することができます。
RotationGestureによる実装
SwiftUIで2本指でViewを回転させるにはrotationEffectを使います。
ここでは例として画像を回転させています。あらかじめiceという名前の画像をプロジェクト内に保存しています。
画像の扱いに関しては画像を表示するを参考にしてください。RotationGestureではonChanged内で角度が提供されます。
提供される角度を利用するために変数angleを最初に宣言しておきます。
角度を変更するrotationEffectにその角度(angle)を渡してあげれば簡単に回転します。onChanged内で提供される角度は0から始まります。
そのためそのまま角度をrotationEffectに渡す実装だと、再度回転させたときにViewは最初に回転してない状態に戻ります。
前の回転の位置から回転を始めるにはコード内のコメントアウトを外して変数lastAngleを有効にしてください。
そしてself.angle = angleをコメントアウトします。onEnded内で前回の最後の角度をlastAngleに保存してonChanged内で取得できる角度にプラスすることで前回の回転位置から始まるように実装できます。
//
// ContentView.swift
//
import SwiftUI
struct ContentView: View {
@State private var angle: Angle = .degrees(.zero)
// @State private var lastAngle: Angle = .degrees(.zero)
@State private var length : CGFloat = 400
var body: some View {
Image("ice")
.resizable()
.aspectRatio(contentMode: .fill)
.clipShape(Circle())
.frame(width: length, height: length)
.rotationEffect(self.angle)
.gesture(RotationGesture()
.onChanged{ angle in
self.angle = angle
// self.angle = angle + self.lastAngle
}
// .onEnded { angle in
// self.lastAngle = self.angle
// }
)
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
