Recognizerの使い方。上下左右のスワイプを検知する。Recognizerの使い方。上下左右のスワイプを検知する。Recognizer(スワイプリコグナイザー)の使い方について説明する。スワイプリコグナイザーとは、スワイプを検知する部品である。スワイプとは、画面に触れた指を上下左右いずれかの方向に素早く動かす動作のことをいう。スワイプと似た言葉に「フリック」がある。「フリック」は画面内の部品に指を置いて上下左右いずれかの方向に弾く動作のことをいい、キーボード入力やスイッチ操作などの表現で使われる。「スワイプ」は画面内の特定範囲に指を置いて上下左右いずれかの方向に弾く動作のことをいい、ページめくりやスクロールなどの表現で使われる。Swiftではフリックもスワイプもスワイプリコグナイザーで実装するので、本サイトでは特に使い分ける必要がない限りスワイプと表現する。スワイプリコグナイザーを使ってみる実際にスワイプリコグナイザーを使ってみよう。ラベルをスワイプすると、方向がラベルに表示されるものを実装する。デバイス画面にラベルを配置する(下図赤矢印)。黄緑枠のアシスタントエディタボタンを押してViewController.swiftを表示する。Ctrlキーを押しながらラベルをソースコードまで運んで吹き出しの設定画面を表示させる(青矢印)。Connectionに「Outlet」、Nameに「testLabel」を入力しConnectボタンを押す。これでラベルをソースコードで操作できるようになった。Enabledにチェックを入れる。スワイプリコグナイザーはスワイプする方向(上下左右)によってリコグナイザーを分ける必要があるので、仮に、上下左右の4方向のスワイプを検知したい場合は4つのスワイプリコグナイザーを登録しなければならない。ストーリーボードで4回も登録するのが面倒なので、今回はソースコードでスワイプリリコグナイザーを登録する。ViewController.swiftを以下のコードに変更する。4個のスワイプリコグナイザーの呼び出しメソッドは全て同じで、引数をもとにスワイプ方向を判別し、ラベルに表示している。//4方向のスワイプリコグナイザーをラベルに登録する。//スワイプした方向をラベルに表示する。{//4方向のスワイプリコグナイザーをラベルに登録する。{//スワイプした方向をラベルに表示する。"左"}}}以下は実際のプレイ動画。動画を見ると分かるように、指をゆっくり移動させるとスワイプリコグナイザーに検知されなくなる。スワイプで部品を動かすせっかくなので、スワイプの感じを出すためにスワイプした方向にラベルが移動するものを作ってみよう。デバイス画面のラベルを選択したあとに、下図赤枠のAlignボタンを押して吹き出しの設定画面を表示させる。Constraints」ボタンを押す。これでアプリ起動時にラベルが必ず画面中央に配置されるようになった。次に紫枠のPinボタンを押して吹き出しの設定画面を表示する。Constraints」ボタンを押す。これでラベルのサイズの制約が追加された。centerY)をCtrlキーを押しながらドラッグ&ドロップでソースコードまで運んで吹き出しの設定画面を表示させる。Connectionに「Outlet」、Nameに「yConstraint」を入力してConnectボタンを押す。centerX)も同じように吹き出しの設定画面を表示させ、Connectionに「Outlet」、Nameに「xConstraint」を入力してConnectボタンを押す。これで位置の制約をソースコードから操作できるようになった。ViewController.swiftを以下のコードに変更する。ラベルが画面の外に飛び出さないようにしながら、スワイプした方向にラベルをアニメーションで移動させている。//4方向のスワイプリコグナイザーをラベルに登録する。//スワイプした方向に応じてラベルの制約を変更する。//画面の下半分にいれば上に移動する。//画面の上半分にいれば下に移動する。//画面の左半分にいれば右に移動する。//画面の右半分にいれば左に移動する。//アニメーションさせる。{//4方向のスワイプリコグナイザーをラベルに登録する。{//スワイプした方向に応じてラベルの制約を変更する。UISwipeGestureRecognizerDirection.Up://画面の下半分にいれば上に移動する。UISwipeGestureRecognizerDirection.Down://画面の上半分にいれば下に移動する。UISwipeGestureRecognizerDirection.Right://画面の左半分にいれば右に移動する。testLabel.frame.size.width/2}default://画面の右半分にいれば左に移動する。testLabel.frame.size.width/2}}//アニメーションさせる。ドラッグでコンテナビューを出し入れする。Recognizerの合わせ技。1ドラッグで出来るようにする。Recognizerの使い方。画面端のドラッグを検知する。Recognizerの使い方。部品の長押しを検知する。Recognizerの使い方。キーボード以外の場所をタップしてキーボードを閉じる。コメントをキャンセルメールアドレスが公開されることはありません。