[SwiftUI] タップや長押しの認識、onTapGestureとonLongPressGesture


Viewのタップや長押しを認識してアクションを起こす機能が Modifiers の onTapGesture, onLongPressGesture の設定で可能です。
Storyboardでは画面タッチや長押しの機能が UITapGestureRecognizer, UILongPressGestureRecognizer がありました。似たような名前ですがそのまま置き換えはできません

Swift 5.1
Xcode 11.3.1

 

Gesture

 

  • onTapGesture:タップ
  • onLongPressGesture:長押し

これらはViewのModifier設定なので Text や Image などViewそれぞれ個別に設定できます。
 

 

onTapGesture

 
例えばTextのModifierに「Add Modifier」から on Tap Gesture を追加しアクションを設定すると簡単なタップを受けて文字をプリントする機能が実現できます。これはSimulatorで実行すると確認できます。


 

 
タップするたびにテキストが変わるように作ってみると
ContentView.swift

 
Toggleを使ってタップされるとフラグが反転するようにしました。
 

 

これはTextですがButtonのような感じですね。

onTapGestureの定義としてはこれ以外にタップ回数を数えるcountがあります

countを使えば、例えばダブルタップでのに発火するようにすることも可能です。

 

onLongPressGesture

 
Tapと同じよう .onLongPressGesture を追加すると機能します。
 

 
ContentView.swift

 

LongPressですがTapとの違いは持続時間によるのですが、デフォルトでは0.5secですが例えばこれを2.0secに変更することができます。

 
onLongPressGestureの定義は以下のようになって、最小判定時間以外にもいくつかの設定が可能です。
 

  • minimumDuration:最小判定時間、デフォルト0.5sec
  • maximumDistance:最大判定距離、デフォルト10 (CGFloat)
    • これは判定範囲が広がるのではなく判定計測が始まってからPress位置が移動しても判定継続される範囲のこと
  • pressing:判定の開始と終了をBoolで取り出せる、デフォルトはnil
  • perform:LongPressでのアクション

 
 
References:
onTapGesture(count:perform:) – Text | Apple Developer
onLongPressGesture(minimumDuration – Apple Developer
minimumDuration – LongPressGesture | Apple Developer
maximumDistance – LongPressGesture | Apple Developer

一人でアプリ開発の限界を感じたら

アプリ開発を始めたけどわからないところがあり、誰かに聞きたいけど周りにはそんな人はいない…あるいは、会社で働いていて日中そんなに時間をとれないなど、オンライン・スクールがいいと思います。


TECH ACADEMY
自宅にいながら1時間でプログラミング基礎を習得

こういうものではアプリ作れないと言う意見もありますが、それは結局本人のやる気があるかないかです。やる気があっても独学では突破しにくいところは教えてもらうのが一番早い。


侍エンジニア塾
侍エンジニア塾 無料体験レッスン



とても簡単なことなのに本やネットの画像だけでは分かりにくいことはあります。実際に質問してピンポイントで教えてもらうと、なんだそんなこと、と言うのがけっこうあります。


CodeCamp
~約20,000名の受講生と300社以上の導入実績~
現役エンジニアのオンライン家庭教師CodeCamp




直接(ネットで)誰か分かる人に聞いた方が早く解決して、上達も早いと思います。


Play Ground
本業と並行してやるには月額制なのがありがたいです。


無料で転職まで
これはiOSアプリ限定ではありませんが無料です
その代わり就職することを前提にしたスクールで「エンジニアになって職を得たい」のであれば手っ取り早いかもしれません

受講料無料:社会人転職コース


誤字脱字、意味不明などのご意見は 謙: e-mail まで
ブックマークしておくと便利です このエントリーをはてなブックマークに追加
Twitter:


シェアする

  • このエントリーをはてなブックマークに追加

フォローする