Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Apple Pencilのホバー機能を試す / pencil hover
Search
USAMI Kosuke
October 31, 2022
Programming
0
1k
Apple Pencilのホバー機能を試す / pencil hover
※ Docswell に移行しました
https://www.docswell.com/s/usami-k/5ENQN8-pencil-hover
USAMI Kosuke
October 31, 2022
Tweet
Share
More Decks by USAMI Kosuke
See All by USAMI Kosuke
Onsager代数とその周辺 / Onsager algebra tsudoi
usamik26
0
590
Apple HIG 正式名称クイズ結果発表 / HIG Quiz Result
usamik26
0
150
ゆめみ大技林製作委員会の立ち上げの話 / daigirin project
usamik26
0
300
@ViewLoadingプロパティラッパの紹介と自前で実装する方法 / @ViewLoading property wrapper implementation
usamik26
0
450
これからUICollectionViewを実践活用する人のためのガイド / Guide to UICollectionView
usamik26
1
710
Xcodeとの最近の付き合い方のはなし / Approach To Xcode
usamik26
2
640
UICollectionView Compositional Layout
usamik26
0
730
Coding Swift with Visual Studio Code and Docker
usamik26
0
480
Swift Extension for Visual Studio Code
usamik26
2
980
Other Decks in Programming
See All in Programming
5分で理解する SOLID 原則 #phpcon_nagoya
shogogg
1
390
PHPのバージョンアップ時にも役立ったAST
matsuo_atsushi
0
230
Bedrock Agentsレスポンス解析によるAgentのOps
licux
3
930
たのしいSocketのしくみ / Socket Under a Microscope
coe401_
8
1.4k
データの整合性を保つ非同期処理アーキテクチャパターン / Async Architecture Patterns
mokuo
55
19k
AWS Step Functions は CDK で書こう!
konokenj
4
650
Honoのおもしろいミドルウェアをみてみよう
yusukebe
1
240
ソフトウェアエンジニアの成長
masuda220
PRO
12
2.1k
ML.NETで始める機械学習
ymd65536
0
240
CSS Linter による Baseline サポートの仕組み
ryo_manba
1
160
XStateを用いた堅牢なReact Components設計~複雑なClient Stateをシンプルに~ @React Tokyo ミートアップ #2
kfurusho
1
990
Jakarta EE meets AI
ivargrimstad
0
550
Featured
See All Featured
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
Building Your Own Lightsaber
phodgson
104
6.2k
Designing for humans not robots
tammielis
250
25k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
4
380
Building Applications with DynamoDB
mza
93
6.2k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
114
51k
Music & Morning Musume
bryan
46
6.4k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
The Language of Interfaces
destraynor
156
24k
Being A Developer After 40
akosma
89
590k
Speed Design
sergeychernyshev
27
810
Transcript
Apple Pencil のホバー機能を試す 宇佐見公輔 / 株式会社ゆめみ
自己紹介 宇佐見公輔(うさみこうすけ) 株式会社ゆめみ / iOSテックリード iOSDC Japan 2022で登壇、パンフレット記事執筆 Apple Pencil
のホバー機能を試す / 宇佐見公輔 / 株式会社ゆめみ 2
Apple Pencil のホバー検出 Apple PencilをiPadに直接タッチしていない状態を検出できるように なった 必要なもの: iPadOS 16.1(リリース日:2022-10-25) M2
iPad Pro(発売日:2022-10-26) Apple Pencil 2nd gen(これは以前からある) Apple Pencil のホバー機能を試す / 宇佐見公輔 / 株式会社ゆめみ 3
実機での挙動 検出されるのは、タッチパネルから約1cm以内にペン先があるとき iPadOS標準のメモアプリの例: 手書きモードで、ペン先が浮いている状態でペンのタッチ位置がプ レビュー表示される ボタンなどのUIコントロールの上にかざすと、そのコントロールが ハイライト表示される Apple Pencil のホバー機能を試す
/ 宇佐見公輔 / 株式会社ゆめみ 4
アプリでの検出方法 UIHoverGestureRecognizer を使えば良い let hover = UIHoverGestureRecognizer(target: self, action: #selector(hovering(_:)))
button.addGestureRecognizer(hover) @objc private func hovering(_ recognizer: UIHoverGestureRecognizer) { // 検出時の処理 } Appleのサンプル:Adopting hover support for Apple Pencil Apple Pencil のホバー機能を試す / 宇佐見公輔 / 株式会社ゆめみ 5
UIHoverGestureRecognizer UIHoverGestureRecognizer はiPadOS 13.0から存在している Viewの上をマウスポインターがホバーしたことを検出する iPadOS 16.1からApple Pencilのホバーも検出する つまり、マウスポインターのホバーと同じ挙動が期待されている UIコントロールのハイライト表示など
標準のUIコントロールは自動的に対応する Apple Pencil のホバー機能を試す / 宇佐見公輔 / 株式会社ゆめみ 6
zOffset UIHoverGestureRecognizer プロパティ zOffset がiPad16.1で追加 0〜1の値でタッチパネルからの距離が取得できる Apple Pencilでない場合は常に0の値 ペン先のタッチ位置のプレビュー表示に活用できる Apple
Pencil のホバー機能を試す / 宇佐見公輔 / 株式会社ゆめみ 7
プレビュー表示 どのようなプレビュー表示をするかは、現在はガイドラインがない 標準メモアプリは単純にポイント位置を点で表示している? サンプルコードでは距離によってアルファ値を変えている これは意味があるかどうか? 単純な表示でも、ユーザーにとっての使い勝手は向上する Apple Pencil のホバー機能を試す /
宇佐見公輔 / 株式会社ゆめみ 8
ホバー検出の有効化・無効化 Apple Pencil のホバー機能を試す / 宇佐見公輔 / 株式会社ゆめみ 9
まとめ M2 iPad Proのみの機能 UIHoverGestureRecognizer で検出できる 標準のUIコントロールなら何もしなくてもハイライト表示される Pencilのタッチ操作を想定するならプレビュー表示対応すると良い プレビュー表示のガイドラインはまだない Apple
Pencil のホバー機能を試す / 宇佐見公輔 / 株式会社ゆめみ 10