web-dev-qa-db-ja.com

UIImageViewのUIGestureRecognizer

UIImageViewがあり、これをサイズ変更や回転などができるようにしたい。

UIGestureRecognizerをUIImageViewに追加できますか？

実行時に作成されるUIImageViewに回転およびピンチレコグナイザーを追加したいと思います。

これらのレコグナイザーをどのように追加しますか？

iosobjective-cuiimageviewuigesturerecognizer
175
jarryd

userInteractionEnabledのYESがUIImageViewであることを確認します。次に、ジェスチャー認識機能を追加できます。

imageView.userInteractionEnabled = YES;
UIPinchGestureRecognizer *pgr = [[UIPinchGestureRecognizer alloc] 
    initWithTarget:self action:@selector(handlePinch:)];
pgr.delegate = self;
[imageView addGestureRecognizer:pgr];
[pgr release];
:
:
- (void)handlePinch:(UIPinchGestureRecognizer *)pinchGestureRecognizer
{
  //handle pinch...
}
420
user467105

はい、UIGestureRecognizerをUIImageViewに追加できます。他の回答で述べたように、userInteractionEnabledプロパティをYESに設定することにより、画像ビューでのユーザーインタラクションを有効にすることを忘れないでください。 UIImageViewは、ユーザーインタラクションプロパティがデフォルトでYESに設定されているUIViewを継承しますが、UIImageViewのユーザーインタラクションプロパティはデフォルトでNOに設定されます。

IImageView docs： から

新しいイメージビューオブジェクトは、デフォルトでユーザーイベントを無視するように構成されています。 UIImageViewのカスタムサブクラスでイベントを処理する場合は、オブジェクトを初期化した後、userInteractionEnabledプロパティの値を明示的にYESに変更する必要があります。

とにかく、答えの大部分で。 UIImageView、UIPinchGestureRecognizer、およびUIRotationGestureRecognizerでUIPanGestureRecognizerを作成する方法の例を次に示します。

まず、viewDidLoadまたは選択した別の方法で、画像ビューを作成し、それに画像、フレームを与え、ユーザーとの対話を可能にします。次に、次の3つのジェスチャーを作成します。デリゲートプロパティを使用してください（ほとんどの場合、selfに設定されます）。これは、同時に複数のジェスチャーを使用するために必要になります。

- (void)viewDidLoad
{
    [super viewDidLoad];

    // set up the image view
    UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"someImage"]];
    [imageView setBounds:CGRectMake(0.0, 0.0, 120.0, 120.0)];
    [imageView setCenter:self.view.center];
    [imageView setUserInteractionEnabled:YES]; // <--- This is very important

    // create and configure the pinch gesture
    UIPinchGestureRecognizer *pinchGestureRecognizer = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(pinchGestureDetected:)];
    [pinchGestureRecognizer setDelegate:self];
    [imageView addGestureRecognizer:pinchGestureRecognizer];

    // create and configure the rotation gesture
    UIRotationGestureRecognizer *rotationGestureRecognizer = [[UIRotationGestureRecognizer alloc] initWithTarget:self action:@selector(rotationGestureDetected:)];
    [rotationGestureRecognizer setDelegate:self];
    [imageView addGestureRecognizer:rotationGestureRecognizer];

    // creat and configure the pan gesture
    UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panGestureDetected:)];
    [panGestureRecognizer setDelegate:self];
    [imageView addGestureRecognizer:panGestureRecognizer];


    [self.view addSubview:imageView]; // add the image view as a subview of the view controllers view
}

ビューのジェスチャが検出されたときに呼び出される3つのメソッドを次に示します。その中で、ジェスチャの現在の状態を確認し、開始または変更されたUIGestureRecognizerStateのいずれかである場合、ジェスチャのscale/rotation/translationプロパティを読み取り、そのデータをアフィン変換に適用し、画像ビューへのアフィン変換、およびジェスチャのスケール/回転/変換をリセットします。

- (void)pinchGestureDetected:(UIPinchGestureRecognizer *)recognizer
{
    UIGestureRecognizerState state = [recognizer state];

    if (state == UIGestureRecognizerStateBegan || state == UIGestureRecognizerStateChanged)
    {
        CGFloat scale = [recognizer scale];
        [recognizer.view setTransform:CGAffineTransformScale(recognizer.view.transform, scale, scale)];
        [recognizer setScale:1.0];
    }
}

- (void)rotationGestureDetected:(UIRotationGestureRecognizer *)recognizer
{
    UIGestureRecognizerState state = [recognizer state];

    if (state == UIGestureRecognizerStateBegan || state == UIGestureRecognizerStateChanged)
    {
        CGFloat rotation = [recognizer rotation];
        [recognizer.view setTransform:CGAffineTransformRotate(recognizer.view.transform, rotation)];
        [recognizer setRotation:0];
    }
}

- (void)panGestureDetected:(UIPanGestureRecognizer *)recognizer
{
    UIGestureRecognizerState state = [recognizer state];

    if (state == UIGestureRecognizerStateBegan || state == UIGestureRecognizerStateChanged)
    {
        CGPoint translation = [recognizer translationInView:recognizer.view];
        [recognizer.view setTransform:CGAffineTransformTranslate(recognizer.view.transform, translation.x, translation.y)];
        [recognizer setTranslation:CGPointZero inView:recognizer.view];
    }
}

最後に、非常に重要なこととして、 IGestureRecognizerDelegate method gestureRecognizer: shouldRecognizeSimultaneouslyWithGestureRecognizerを使用して、ジェスチャーを同時に機能させる必要があります。これらの3つのジェスチャがデリゲートとしてこのクラスを割り当てられた3つのジェスチャのみである場合、以下に示すようにYESを返すことができます。ただし、このクラスがデリゲートとして割り当てられている追加のジェスチャがある場合、すべての連携を許可する前に、このメソッドにロジックを追加して、どのジェスチャがどれであるかを判断する必要があります。

- (BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer
{
    return YES;
}

クラスが IGestureRecognizerDelegate プロトコルに準拠していることを忘れないでください。そのためには、インターフェイスが次のようになっていることを確認してください。

@interface MyClass : MySuperClass <UIGestureRecognizerDelegate>

動作中のサンプルプロジェクトのコードを自分で再生したい場合は、このコードを含む私が作成したサンプルプロジェクト ここにあります

75
Mick MacCallum

Swift 4.2

myImageView.isUserInteractionEnabled = true
let tapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(imageTapped))
tapGestureRecognizer.numberOfTapsRequired = 1
myImageView.addGestureRecognizer(tapGestureRecognizer)

タップしたとき：

@objc func imageTapped(_ sender: UITapGestureRecognizer) {
   // do something when image tapped
   print("image tapped")
}
12
ayalcinkaya

Swift 2.0ソリューション

同じマナーでタップ、ピンチ、またはスワイプジェスチャレコグナイザーを作成します。以下に、レコグナイザーを起動して実行するための4つのステップを説明します。

4ステップ

1。）クラス署名に追加することにより、UIGestureRecognizerDelegateから継承します。

class ViewController: UIViewController, UIGestureRecognizerDelegate {...}

2。）画像からviewControllerへのドラッグを制御して、IBOutletを作成します。

@IBOutlet weak var tapView: UIImageView!

。） viewDidLoadに次のコードを追加します。

// create an instance of UITapGestureRecognizer and tell it to run 
// an action we'll call "handleTap:"
let tap = UITapGestureRecognizer(target: self, action: Selector("handleTap:"))
// we use our delegate
tap.delegate = self
// allow for user interaction
tapView.userInteractionEnabled = true
// add tap as a gestureRecognizer to tapView
tapView.addGestureRecognizer(tap)

4。）ジェスチャ認識エンジンがタップされたときに呼び出される関数を作成します。 （選択した場合、= nilを除外できます）。

func handleTap(sender: UITapGestureRecognizer? = nil) {
    // just creating an alert to prove our tap worked!
    let tapAlert = UIAlertController(title: "hmmm...", message: "this actually worked?", preferredStyle: UIAlertControllerStyle.Alert)
    tapAlert.addAction(UIAlertAction(title: "OK", style: .Destructive, handler: nil))
    self.presentViewController(tapAlert, animated: true, completion: nil)
}

最終的なコードは次のようになります。

class ViewController: UIViewController, UIGestureRecognizerDelegate {

    @IBOutlet weak var tapView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        let tap = UITapGestureRecognizer(target: self, action: Selector("handleTap:"))
        tap.delegate = self
        tapView.userInteractionEnabled = true
        tapView.addGestureRecognizer(tap)
    }

    func handleTap(sender: UITapGestureRecognizer? = nil) {
        let tapAlert = UIAlertController(title: "hmmm...", message: "this actually worked?", preferredStyle: UIAlertControllerStyle.Alert)
        tapAlert.addAction(UIAlertAction(title: "OK", style: .Destructive, handler: nil))
        self.presentViewController(tapAlert, animated: true, completion: nil)
    }
}
11
Dan Beaulieu

Swift4で、3つのジェスチャーを1つのビューに追加することでこれを実行しました

  1. IPinchGestureRecognizer：ビューをズームインおよびズームアウトします。
  2. IRotationGestureRecognizer：ビューを回転します。
  3. IPanGestureRecognizer：ビューをドラッグします。

ここに私のサンプルコード

class ViewController: UIViewController: UIGestureRecognizerDelegate{
      //your image view that outlet from storyboard or xibs file.
     @IBOutlet weak var imgView: UIImageView!
     // declare gesture recognizer
     var panRecognizer: UIPanGestureRecognizer?
     var pinchRecognizer: UIPinchGestureRecognizer?
     var rotateRecognizer: UIRotationGestureRecognizer?

     override func viewDidLoad() {
          super.viewDidLoad()
          // Create gesture with target self(viewcontroller) and handler function.  
          self.panRecognizer = UIPanGestureRecognizer(target: self, action: #selector(self.handlePan(recognizer:)))
          self.pinchRecognizer = UIPinchGestureRecognizer(target: self, action: #selector(self.handlePinch(recognizer:)))
          self.rotateRecognizer = UIRotationGestureRecognizer(target: self, action: #selector(self.handleRotate(recognizer:)))
          //delegate gesture with UIGestureRecognizerDelegate
          pinchRecognizer?.delegate = self
          rotateRecognizer?.delegate = self
          panRecognizer?.delegate = self
          // than add gesture to imgView
          self.imgView.addGestureRecognizer(panRecognizer!)
          self.imgView.addGestureRecognizer(pinchRecognizer!)
          self.imgView.addGestureRecognizer(rotateRecognizer!)
     }

     // handle UIPanGestureRecognizer 
     @objc func handlePan(recognizer: UIPanGestureRecognizer) {    
          let gview = recognizer.view
          if recognizer.state == .began || recognizer.state == .changed {
               let translation = recognizer.translation(in: gview?.superview)
               gview?.center = CGPoint(x: (gview?.center.x)! + translation.x, y: (gview?.center.y)! + translation.y)
               recognizer.setTranslation(CGPoint.zero, in: gview?.superview)
          }
     }

     // handle UIPinchGestureRecognizer 
     @objc func handlePinch(recognizer: UIPinchGestureRecognizer) {
          if recognizer.state == .began || recognizer.state == .changed {
               recognizer.view?.transform = (recognizer.view?.transform.scaledBy(x: recognizer.scale, y: recognizer.scale))!
               recognizer.scale = 1.0
         }
     }   

     // handle UIRotationGestureRecognizer 
     @objc func handleRotate(recognizer: UIRotationGestureRecognizer) {
          if recognizer.state == .began || recognizer.state == .changed {
               recognizer.view?.transform = (recognizer.view?.transform.rotated(by: recognizer.rotation))!
               recognizer.rotation = 0.0
           }
     }

     // mark sure you override this function to make gestures work together 
     func gestureRecognizer(_ gestureRecognizer: UIGestureRecognizer, shouldRecognizeSimultaneouslyWith otherGestureRecognizer: UIGestureRecognizer) -> Bool {
         return true
     }

}

質問がある場合は、コメントを入力してください。ありがとうございました

4
Leang Socheat

Swift 3の例

override func viewDidLoad() {

         self.backgroundImageView.addGestureRecognizer(
             UITapGestureRecognizer.init(target: self, action:
                 #selector(didTapImageview(_:))
             )
         )
         self.backgroundImageView.isUserInteractionEnabled = true
     }

     func didTapImageview(_ sender: Any) {
          // do something
     }
}

必要に応じて、ジェスチャ再認識のデリゲートやその他の実装はありません。

3
mourodrigo

タップジェスチャ認識ツールをストーリーボードの画像ビューにドラッグすることもできます。次に、Ctrlキーを押しながらコードにドラッグしてアクションを作成します...

2
goggelj

ブロック愛好家の場合、 ALActionBlocks を使用して、ブロックにジェスチャーのアクションを追加できます

__weak ALViewController *wSelf = self;
imageView.userInteractionEnabled = YES;
UITapGestureRecognizer *gr = [[UITapGestureRecognizer alloc] initWithBlock:^(UITapGestureRecognizer *weakGR) {
    NSLog(@"pan %@", NSStringFromCGPoint([weakGR locationInView:wSelf.view]));
}];
[self.imageView addGestureRecognizer:gr];
0
dimo hamdy