とがみんブログ
大学院の中退を決断し、徹底的に自分と向き合い就職活動をする中で、心理学や脳科学に興味を持つ。挙げ句の果てに、この世界の仕組みにも興味を持つ。そんなとがみんの考えや経験を綴ったブログです。
swift

【Swift4】ジェスチャー 機能を用いたUIImageViewのドラッグ機能の実装

どうも。とがみんです。

現在セブ島のNexSeedというプログラミングと英語を勉強できる学校で、エンジニア留学卒業後、ティーチングアシスタントとして、インターンをしています。

>エンジニア留学|NexSeed

今回は、ジェスチャー機能を用いて、UIImageViewのドラッグ機能を実装したので、紹介します。

作成するサンプルアプリ

今回作成するアプリについてです。

実装する機能としては、

  1. ボタンを押すとペンギンの画像を表示する機能
  2. 画像をドラッグする機能
  3. 画像長押しで、長押しした画像を削除する機能

です。

これから、実装手順の詳細について紹介していきます。

スポンサードリンク

実装手順

実装手順を紹介していきます。

ペンギン画像の表示

まず、ボタンが押された時に、ペンギンの画像が画面の中央に表示されるプログラムを書きます。

UIButtonを配置し、ボタンが押された時に動作する関数の中に、下記のコードを記述します。

ボタンが押されるたびに上記コードが実行されます。なので、ボタンを押すたびに、画面中央にペンギンの画像(penguin.png)が表示されます。

UIImageView画像をドラッグする機能の実装

次に、先ほど表示したペンギンの画像をドラッグする機能を実装していきます。

この機能を実装するに当たって、以下3つの関数を使用します。

それぞれの関数が呼ばれた時に、実行させる処理について説明していきます。

画面タッチ時

画面をタッチした際に、そのタッチした位置にペンギンの画像があるかどうかを判定します。

その判定に、タグを利用します。

全てのオブジェクトはデフォルトでタグの値が「0」になっています。画像にタグ「1」を設定し、画面をタップしたときに、タップしたオブジェクトが持つタグの値が「1」なら画像、「0」なら画像以外といった風に判定します。

まず、生成した画像全てにタグ「1」を設定するために、以下のコードを、
画像を生成した後に記述します。GitHubにあげているサンプルコードを見ればわかると思います。

また、画像がタップされた時に、それが検出されるように、isUserInteractionEnabledtrueにする必要があります。

次に、画面をタッチされた時に呼ばれる関数の中に、以下のコードを記述します。

上記のコードは、画面をタッチした時に、タッチしたViewを取得し、取得したViewのタグが「1」なら、そのサイズを「幅:120,高さ:120」とし、タッチした位置にそのViewの中心が配置されるようにしています。

画面移動時(ドラッグ時)

画面ドラッグ時は、ドラッグに合わせてペンギンの画像も移動するようにします。

この時、画面タッチ時と同じ処理を行うので、ドラッグ時に呼ばれる関数の中に下記のコードを記述します。

ドラッグ終了時

ドラッグ終了時、画像のサイズを元に戻します。

以上でペンギンの画像をドラッグすることができるようになります。

画像長押しで削除する機能の実装

ペンギンの画像を長押しした時に、削除する機能を追加します。

この機能の実装にはUILongPressGestureRecognizerを使います。

下記のように、変数を宣言し、UILongPressGestureRecognizer()をインスタンス化します。

生成したペンギン画像それぞれに、このUILongPressGestureRecognizer()を適用させたいので、ペンギン画像を生成した後の部分に下記のコードを追加します。

また、longPress関数をViewControllerクラスの中に記述します。

ペンギンの画像が長押しされた際に、以下の関数が呼ばれます。

これで、ペンギン画像を長押しした際に、画像を削除することができます。

GitHub

サンプルコードはGitHubにあげています。参考にしながら実装してみてください。

>http:////github.com/togamin/gestureSample.git

まとめ

タッチジェスチャー 機能、ロングプレスジェスチャー機能を用いた簡単なアプリケーションを実装しました。GitHubにあげているコードを参考にしながら、実装してみてください。

また、下記がインターンをしているNexSeedという「プログラミング×英語」の勉強ができるセブにある学校です。

起業志向の人や、フリーランスを目指す人等、意識の高い人が多く、自分も良い刺激をもらっています。

留学を考えているけど、英語だけじゃ物足りないと感じる人、起業やフリーランスとして働くことを見据えている人は是非見てみてください!