MILLEN BOX

音楽好きの組み込みソフトエンジニアによるプログラミング(主にiOSアプリ開発)の勉強の記録

タッチ時にUIImageViewの分身を作成して(いるように見せて)移動する (swift1.2)

UIImageViewの分身を作成して移動したくなりました。こんな感じに。
(成果物の画像です)

f:id:anthrgrnwrld:20150524093833g:plain

Githubは以下です。

github.com

自分ポイント1

まずどうやって分身を作ろうかというところ。分身させたい画像を画像A、分身した画像を画像Bと定義します。
初め、画像Aをタッチ時に画像BのUIImageViewを新規生成する という方法を考えました。
しかしこの方法だと、動かあしたいのは画像Bなのに、touchesMovedで認識されているのは画像Aとなり、分身画像を動かすことが出来ないんです。少なくとも私には。
なので分身画像は予め作成しておいて、重ねて置いておこうと考えました。こんな風に。
f:id:anthrgrnwrld:20150524100827p:plain

自分ポイント2

あとは前々回やったこととほぼ共通です。が、1点だけ改良を加えています。
今まではイメージ移動の座標の管理の際、Viewのtagが共通するか否かでコントロールする画像を判別していました。 しかし今回は、ControlImageClass(イメージ移動の座標管理)に直接viewを保管しておくことで管理しています。

//二つのCGPointを持つクラス (イメージ移動の座標管理)
class TwoCGPoint {
    var imagePoint: CGPoint!    //イメージの座標保存用
    var touchPoint: CGPoint!    //タッチ位置の座標保存用
}

//タッチスタート時と移動後の座標情報を持つクラス (イメージ移動の座標管理)
class ControlImageClass {
    var start: TwoCGPoint = TwoCGPoint()            //スタート時の画像座標とタッチ座標
    var destination: TwoCGPoint = TwoCGPoint()      //移動後(または移動途中の)画像座標とタッチ座標
    var draggingView: UIView?                       //どの画像を移動しているかを保存 (改良点!!!!)
    
    //startとdestinationからタッチ中の移動量を計算
    var delta: CGPoint {
        get {
            let deltaX: CGFloat = destination.touchPoint.x - start.touchPoint.x
            let deltaY: CGFloat = destination.touchPoint.y - start.touchPoint.y
            return CGPointMake(deltaX, deltaY)
        }
    }
    
    //移動後(または移動中の)画像の座標取得用のメソッド
    func setMovedImagePoint() -> CGPoint {
        let imagePointX: CGFloat = start.imagePoint.x + delta.x
        let imagePointY: CGFloat = start.imagePoint.y + delta.y
        destination.imagePoint = CGPointMake(imagePointX, imagePointY)
        return destination.imagePoint
    }
}

やりたいなーと思うことを、どうすれば実現するかを考えるの楽しいです。