2

Swift でティッカーのようなものを作成しています。

UILabelanimationWithDuration によって画面右外から左端へ流れてきて、一定時間停止した後、画面左外へ消え、次の UILabel がまた右から流れてくるという単純なものです。

UILabel をタップした際に、イベントが上手く取得できず悩んでいます。

TopicsLabel:

import UIKit
class TopicsLabel: UILabel {

required init(frame: CGRect, tag: Int, topics: String) {
    super.init(frame: frame)
    self.text = topics
    self.tag = tag
    commonInit()
}
required init(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    commonInit()
}
func commonInit() {
    self.textAlignment = NSTextAlignment.Left
    self.userInteractionEnabled = true
}
override func touchesEnded(touches: NSSet, withEvent event: UIEvent) {
    super.touchesEnded(touches, withEvent: event)
    println(self.tag)
}
}

これを、親である ViewController から、複数個 addSubview し、下記アニメーションで順番に流すように動かしています。

UIView.animateWithDuration(
        0.3,
        delay: show_delay,
        options: .CurveEaseInOut | .AllowUserInteraction | .AllowAnimatedContent,// | .BeginFromCurrentState
        animations: {() -> Void in
            target.center = CGPoint(x: 0+target.bounds.width/2, y: 0+target.bounds.height/2)
            return
        },
        completion: {(Bool) -> Void in
            UIView.animateWithDuration(
                0.1,
                delay: 3.0,
                options: .CurveLinear | .AllowUserInteraction | .AllowAnimatedContent,// | .BeginFromCurrentState
                animations: {() -> Void in
                    target.center = CGPoint(x: -self.bounds.width, y: 0+target.bounds.height/2)
                    return
                },
                completion: {(Bool) -> Void in
                    target.center = CGPoint(x: self.bounds.width + self.bounds.width/2, y: target.bounds.height/2)
                    self.showAnimation(target_tag + 1)
                }
            )
        }
    )

アニメーション自体は上手くいくのですが、色々と調べていたところアニメーションの仕様で、アニメーションが始まる前にすでに設定された位置にオブジェクトは移動しているが、見た目上はまだ移動していないように見えるだけということで、タッチイベントが発生する位置が、アニメーション後のまだティッカーの存在していないエリアになっています。

ちなみに、 UILabel が左端に来た際に一旦イベントを終了すれば良いかと思い、 completion ブロックの中に次のイベントを書くのではなく、右から左端にくるアニメーション(A)と、左端から画面外に出て行くアニメーション(B)を別々に設定し、Bで行っていたdelayの代わりにAとBの間に sleep を入れてみましたが、 sleep の間もイベントは発生しませんでした。
タッチイベント自体が動いてないようにも思います。

何か足がかりをいただければと思います。

1 件の回答 1

1

足がかりだけでよいなら、

  • アニメーション中のビューの動的な座標は UIView.layer.presentationLayer().frame で取得できます
  • CGRectContainsPoint(rect:, point:) で、タッチ座標が移動中のビューのフレーム内か判定することで、移動中のビューのタッチを擬似的に実装できます
  • ラベルの親ビューに対して UITapGestureRecognizer など UIGestureRecognizer のサブクラスを仕込んで行えば、タッチされた座標は UIGestureRecognizer の locationInView(view:) で取得できます。特別な事情があるなら touches...系のオーバーライドでもいいと思いますけど……

ポイントは、タッチは移動アニメーションをしない親ビューに仕込み、その座標と移動中のビューのフレームを比較できる構造を作ることです。じぶんだったら、ラベルの上階層にコンテナ用のビューを作り、それをビューコントローラのルートビューに張り付けます。

簡単な検証コードを追記しておきます

import UIKit

class ViewController: UIViewController {

  override func viewDidLoad() {
    super.viewDidLoad()

    self.view.addGestureRecognizer(UITapGestureRecognizer.init(target: self, action: "tapped:"))
    self.view.addSubview(TopicsLabel(frame: CGRectMake(0, 20, 100, 40), tag: 1, topics: "topic 1"))
  }

  func tapped(sender: UIGestureRecognizer) {
    let location = sender.locationInView(sender.view)
    let target: UIView! = self.view.viewWithTag(1)

    if (CGRectContainsPoint(target.layer.presentationLayer().frame, location)) {
      println("Yes !!")
    }

    UIView.animateWithDuration(5,
      delay: 0,
      options: .CurveEaseInOut | .AllowUserInteraction | .AllowAnimatedContent,
      animations: {() -> Void in
        target.frame = CGRectMake(self.view.frame.width - target.frame.width, 20, 100, 40)
        return
    }, completion: nil)
  }
}
3
  • ご回答、具体的な構造の案頂きましてありがとうございます! ちょうどUILabelをUIButtonに変更してhitTest等で判定する方法を試してみようと思っていたところでした。 教えていただいた方法だとUILabelのままでできますね! こちらも試してみたいと思います。 しかし直接イベントを取得できれば楽だと思ったのですが、難しいみたいですね。。
    – ika
    Commented 2015年1月13日 10:40
  • 簡単な検証のコードを追加しておきました
    – user5443
    Commented 2015年1月13日 10:46
  • コードありがとうございました!無事Yesが取得できました! あとはTopicsLabelの数だけ回して、どれがフレーム内にいるか判定すれば良いのですね。丸2日悩んでいたので本当に助かりました。ありがとうございました!
    – ika
    Commented 2015年1月13日 11:27

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。