対象(ImageView)の回転について

#はじめに
iPhoneアプリ開発における目標物の**回転**についての記事です。
ImageViewの回転について実装したので、自分で思い出すためにも記事にしておきます。

#実装
回転を実装するにはanimateプロパティにおいて、*"CGAffineTransform"*を用います。CGAffineTransform(rotationAngle:CGFloat.回転角)とすることで実装できます。

```swift:viewController.swift
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°となっているので半回転します。
![ezgif.com-gif-maker.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/694640/6a2fa419-388c-3676-742b-54354f246276.gif)
※ここで注意したいのが、角度の指定にはpiを用いなければならないので、

```swift:viewController.swift
    self.rouletteView.transform = CGAffineTransform(rotationAngle: CGFloat.45)
```

などとするとエラーが返されます。
なので、細かい角度まで調整したいときは、

```swift:viewController.swift
    self.rouletteView.transform = CGAffineTransform(rotationAngle: CGFloat.pi/4)
    self.rouletteView.transform = CGAffineTransform(rotationAngle: 45*CGFloat.pi/180)//などでも正常に動作します。
```

と記述すれば動作します。
![ezgif.com-gif-maker (1).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/694640/fc1f82d0-f927-7611-d692-1cb6e8823857.gif)

もう一つ問題があります。
例えば、以下のように240°回転させるような記述をしたとします。

```swift:viewController.swift
    self.rouletteView.transform = CGAffineTransform(rotationAngle: 240*CGFloat.pi/180)
```

すると...
![ezgif.com-gif-maker (2).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/694640/86450cd7-6e57-c2b2-a67d-c378b8c35fd8.gif)
このように、120°逆回転しています。
この記述は、確かに240°回転するように書かれています。ただ、機械からすると**240°回転したときの"到達点"への回転移動**を行っていることになります。したがって、240°右回転するよりも120°左に回ってしまった方が、速く処理できますから左回転してしまうわけです。

ということはもちろん以下の記述をしたときは...

```swift:viewController.swift
    self.rouletteView.transform = CGAffineTransform(rotationAngle: 360*CGFloat.pi/180)
```

![sample.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/694640/eb9fa109-52d3-b719-cfb5-fbeae99379ff.png)
見事ですね！微動だにしません笑

###解決方法
では、181°~360°での右回転はどのようにしたらいいのかというと...

```swift:viewController.swift
    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°の地点は右回転が最短ルートになるので、そのまま右回転を続けるというわけです。
![ezgif.com-gif-maker (3).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/694640/6ca76629-708a-09fe-3154-ffbbabe8ff44.gif)

また、ルーレットのように複数回回転するような場合は、以下のように制御構文を用いてあげれば問題ないです。

```swift:viewController.swift
    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))
            
        })
         
    }
```

![ezgif.com-gif-maker (4).gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/694640/173a0299-be5f-a345-10f8-d592a256b340.gif)

#まとめ
今回、初めてのQiita投稿になったので思っていたよりも時間がかかってしまいましたが、なんとか投稿できてよかったです。文章やコードなど、おかしい点などありましたらコメントいただけると助かります。