Swift3.0を使って簡単なiPhoneアプリを作ってみます
画面に表示された画像をドラッグ可能にして座標を取得します
#1. 部品を用意します
- イラストレーターなどで①②③のような画像(ここでは例としてcircle1.jpg、circle2.jpg、circle3.jpgとします)と画面を仕切る縦横軸の画像(同lines.jpg)などを用意します
#2. アプリを準備します
- Xcodeを起動し、Single Viewアプリケーションを作成します
- Assets.xcassetsに前項で作成した①②③の画像(circle1.jpg,circle2.jpg,circle3.jpg)と縦横軸の画像(lines.jpg)をドラッグ&ドロップして登録します
- 画面下部にそれぞれのx座標、y座標を表示するラベル(ここでは、lc1x, lc1y, lc2x, lc2y, lc3x, lc3yとします)を準備します
- 下記のViewController.swiftを作成し、前項のラベルを接続します
import UIKit
let imageView0 = UIImageView()
let imageView1 = UIImageView()
let imageView2 = UIImageView()
let imageView3 = UIImageView()
var c1x : CGFloat!
var c1y : CGFloat!
var c2x : CGFloat!
var c2y : CGFloat!
var c3x : CGFloat!
var c3y : CGFloat!
class ViewController: UIViewController {
@IBOutlet weak var lc1x: UILabel!
@IBOutlet weak var lc1y: UILabel!
@IBOutlet weak var lc2x: UILabel!
@IBOutlet weak var lc2y: UILabel!
@IBOutlet weak var lc3x: UILabel!
@IBOutlet weak var lc3y: UILabel!
override func viewDidLoad() {
super.viewDidLoad()
let screenWidth:CGFloat = view.frame.size.width
let screenHeight:CGFloat = view.frame.size.height
imageView0.image = UIImage(named:"lines.jpg")!
let newRect0 = CGRect(x:0, y:0, width:300, height:400)
imageView0.frame = newRect0
imageView0.center = CGPoint(x:screenWidth/2, y:screenHeight/2)
self.view.addSubview(imageView0)
imageView0.isUserInteractionEnabled = true
imageView1.image = UIImage(named:"circle1.jpg")!
let newRect1 = CGRect(x:0, y:0, width:50, height:50)
imageView1.frame = newRect1
imageView1.center = CGPoint(x:screenWidth/4, y:screenHeight/4)
self.view.addSubview(imageView1)
imageView1.isUserInteractionEnabled = true
imageView2.image = UIImage(named:"circle2.jpg")!
let newRect2 = CGRect(x:0, y:0, width:50, height:50)
imageView2.frame = newRect2
imageView2.center = CGPoint(x:screenWidth/2, y:screenHeight/2)
self.view.addSubview(imageView2)
imageView2.isUserInteractionEnabled = true
imageView3.image = UIImage(named:"circle3.jpg")!
let newRect3 = CGRect(x:0, y:0, width:50, height:50)
imageView3.frame = newRect3
imageView3.center = CGPoint(x:screenWidth*3/5, y:screenHeight*2/3)
self.view.addSubview(imageView3)
imageView3.isUserInteractionEnabled = true
let panGestureRecognizer06 = UIPanGestureRecognizer(target: self, action: #selector(panGesture06(sender:)))
let panGestureRecognizer07 = UIPanGestureRecognizer(target: self, action: #selector(panGesture07(sender:)))
let panGestureRecognizer08 = UIPanGestureRecognizer(target: self, action: #selector(panGesture08(sender:)))
imageView1.addGestureRecognizer(panGestureRecognizer06)
imageView2.addGestureRecognizer(panGestureRecognizer07)
imageView3.addGestureRecognizer(panGestureRecognizer08)
}
@objc func panGesture06(sender:UIPanGestureRecognizer) {
if sender.state == UIGestureRecognizerState.began {
c1x = imageView1.frame.origin.x
c1y = imageView1.frame.origin.y
}
let point: CGPoint = sender.translation(in: self.view)
let movedPoint: CGPoint = CGPoint(x: sender.view!.center.x + point.x, y: sender.view!.center.y + point.y)
sender.view!.center = movedPoint
sender.setTranslation(CGPoint.zero, in: self.view)
print(c1x,c1y)
lc1x.text = c1x.description
lc1y.text = c1y.description
}
@objc func panGesture07(sender:UIPanGestureRecognizer) {
if sender.state == UIGestureRecognizerState.began {
c2x = imageView2.frame.origin.x
c2y = imageView2.frame.origin.y
}
let point: CGPoint = sender.translation(in: self.view)
let movedPoint: CGPoint = CGPoint(x: sender.view!.center.x + point.x, y: sender.view!.center.y + point.y)
sender.view!.center = movedPoint
sender.setTranslation(CGPoint.zero, in: self.view)
print(c2x,c2y)
lc2x.text = c2x.description
lc2y.text = c2y.description
}
@objc func panGesture08(sender:UIPanGestureRecognizer) {
if sender.state == UIGestureRecognizerState.began {
c3x = imageView3.frame.origin.x
c3y = imageView3.frame.origin.y
}
let point: CGPoint = sender.translation(in: self.view)
let movedPoint: CGPoint = CGPoint(x: sender.view!.center.x + point.x, y: sender.view!.center.y + point.y)
sender.view!.center = movedPoint
sender.setTranslation(CGPoint.zero, in: self.view)
print(c3x,c3y)
lc3x.text = c3x.description
lc3y.text = c3y.description
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
#3. iPhoneで稼働を確認します