#はじめに
iPhoneアプリ開発における目標物の回転についての記事です。
ImageViewの回転について実装したので、自分で思い出すためにも記事にしておきます。
#実装
回転を実装するにはanimateプロパティにおいて、*"CGAffineTransform"*を用います。CGAffineTransform(rotationAngle:CGFloat.回転角)とすることで実装できます。
import UIKit
class ViewController: UIViewController {
@IBOutlet weak var rouletteView: UIImageView!
@IBOutlet weak var button: UIButton!
func rotation() {
UIView.animate(withDuration: 1, animations: {
self.rouletteView.transform = CGAffineTransform(rotationAngle: CGFloat.pi)
})
}
@IBAction func go(_ sender: Any) {
rotation()
}
}
以上のように記述すると、回転角が pi = 180°となっているので半回転します。
※ここで注意したいのが、角度の指定にはpiを用いなければならないので、
self.rouletteView.transform = CGAffineTransform(rotationAngle: CGFloat.45)
などとするとエラーが返されます。
なので、細かい角度まで調整したいときは、
self.rouletteView.transform = CGAffineTransform(rotationAngle: CGFloat.pi/4)
self.rouletteView.transform = CGAffineTransform(rotationAngle: 45*CGFloat.pi/180)//などでも正常に動作します。
もう一つ問題があります。
例えば、以下のように240°回転させるような記述をしたとします。
self.rouletteView.transform = CGAffineTransform(rotationAngle: 240*CGFloat.pi/180)
すると...
このように、120°逆回転しています。
この記述は、確かに240°回転するように書かれています。ただ、機械からすると240°回転したときの"到達点"への回転移動を行っていることになります。したがって、240°右回転するよりも120°左に回ってしまった方が、速く処理できますから左回転してしまうわけです。
ということはもちろん以下の記述をしたときは...
self.rouletteView.transform = CGAffineTransform(rotationAngle: 360*CGFloat.pi/180)
###解決方法
では、181°~360°での右回転はどのようにしたらいいのかというと...
self.rouletteView.transform = CGAffineTransform(rotationAngle: 180*CGFloat.pi/180)
self.rouletteView.transform = CGAffineTransform(rotationAngle: 240*CGFloat.pi/180)
このように、2回に分けて処理を行えば動作します。1行目の
self.rouletteView.transform = CGAffineTransform(rotationAngle: 180*CGFloat.pi/180)で
半回転させてしまえば、そこ(180°)の地点から181°~360°の地点は右回転が最短ルートになるので、そのまま右回転を続けるというわけです。
また、ルーレットのように複数回回転するような場合は、以下のように制御構文を用いてあげれば問題ないです。
func rotation() {
UIView.animate(withDuration: 1.5, animations: {
let number = Int.random(in: 1..<360)
for _ in 0...2{
self.rouletteView.transform = CGAffineTransform(rotationAngle: 180*CGFloat.pi/180)
self.rouletteView.transform = CGAffineTransform(rotationAngle: 360*CGFloat.pi/180)//360で1回転
}
self.rouletteView.transform = CGAffineTransform(rotationAngle: CGFloat.pi/180*CGFloat(number))
})
}
#まとめ
今回、初めてのQiita投稿になったので思っていたよりも時間がかかってしまいましたが、なんとか投稿できてよかったです。文章やコードなど、おかしい点などありましたらコメントいただけると助かります。