Upgrade to Pro — share decks privately, control downloads, hide ads and more …

【gotanda.unity #7】uGUIのインプット拡張してる？

Avatar for kase kase
July 25, 2018
Programming
0
1.8k

【gotanda.unity #7】uGUIのインプット拡張してる？

登壇者：かせ（https://twitter.com/KaseliaePenguin）

Avatar for kase

kase

July 25, 2018
Tweet

More Decks by kase

See All by kase
ゲーム案件にZenjectを導入した経験を語る
Avatar for kase kaseliaepenguin
1
12k

Other Decks in Programming

See All in Programming
Range on Rails ―「多重範囲型」という新たな選択肢が、複雑ロジックを劇的にシンプルにしたワケ
Avatar for RIZAPテクノロジーズ rizap_tech
0
6.7k
Devvox Belgium - Agentic AI Patterns
Avatar for Kevin Dubois kdubois
1
140
コードとあなたと私の距離 / The Distance Between Code, You, and I
Avatar for YAMAOKA Hiroyuki hiro_y
0
190
『毎日の移動』を支えるGoバックエンド内製開発
Avatar for yutautsugi yutautsugi
2
280
Go言語の特性を活かした公式MCP SDKの設計
Avatar for hond hond0413
1
490
3年ぶりにコードを書いた元CTOが Claude Codeと30分でMVPを作った話
Avatar for 小島舞子 / Maiko Kojima maikokojima
0
630
他言語経験者が Golangci-lint を最初のコーディングメンターにした話 / How Golangci-lint Became My First Coding Mentor: A Story from a Polyglot Programmer
Avatar for uMa uma31
0
340
Six and a half ridiculous things to do with Quarkus
Avatar for Holly Cummins hollycummins
0
210
React Nativeならぬ"Vue Native"が実現するかも？_新世代マルチプラットフォーム開発フレームワークのLynxとLynxのVue.js対応を追ってみよう_Vue Lynx
Avatar for Yuto Nagai(Future) yut0naga1_fa
2
540
なんでRustの環境構築してないのにRust製のツールが動くの？ / Why Do Rust-Based Tools Run Without a Rust Environment?
Avatar for TOMIKAWA Sotaro ssssota
14
45k
その面倒な作業、「Dart」にやらせませんか？ Flutter開発者のための業務効率化
Avatar for YomEngine yordgenome03
1
140
EMこそClaude Codeでコード調査しよう
Avatar for shibayu36 shibayu36
0
370

Featured

See All Featured
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
116
20k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.5k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
32
1.2k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
514
110k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
44
7.8k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
Avatar for Morgane Peng morganepeng
132
19k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
31
9.7k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
285
14k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
23
1.5k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
16k
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.7k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
15k

Transcript

  1. uGUIのインプット拡張してる？ Gotanda.unity #7 かせ @KaseliaePenguin

  2. None

  3. がっつりエンジニア向けの話です 詰め込んでます、ごめんね

  4. EventSystemsって知ってますか？ タップやドラッグの判定を管理しています uGUIの各コンポーネントに対して通知を送ってくれます Canvasを作成すると自動で作られます

  5. None

  6. 通知について・1 Canvas以下に存在するオブジェクトの、Graphicクラスを見て通知を送ります Graphicクラスは uGUI用の基底クラスです

  7. 通知について・2 Graphicクラスには RaycastTarget というプロパティがあります RaycastTarget がtrueの時、オブジェクトに対して通知が送られます

  8. Imageコンポーネントの例

  9. uGUIのButtonってどういう仕組み？

  10. 生成するとこんな感じ

  11. Buttonとは Graphicクラスを継承したImageコンポーネントのRaycastTargetがtrueの時 オブジェクトに対して送られてくる OnPointerDown という通知を使ってクリックされた判定を取っているのです

  12. じゃあ自分のクラスで通知受け取りたいよ！ っていう話の前に 本当に通知の仕組みが合っているのか確かめてみよう

  13. ImageのRaycastTargetをオフに・・・

  14. おん？

  15. ヒエラルキーを見てみる Buttonの子供になんかいますね

  16. Textを見てみる

  17. 1.親子関係のあるオブジェクトで 2.子供もGraphicクラスを持っていて 3.子供のRaycastTargetがtrueで 4.子供が通知を受け取る仕組みを持っていなかった場合

  18. 通知は親に対してブロードキャストされます！！！ 気を付けよう

  19. ここまで前置きなんです。。。

  20. OnPointerDown Graphic領域内をタップ 、クリックすると通知される

  21. OnPointerUp OnPointerDownが通知された後 指を離すと通知される オブジェクトが非アクティブの時は通知されない

  22. OnPointerEnter Graphic領域内に触っている判定が入ると通知される スマホとかはドラッグした時とか、領域内をタップしたとき PCはカーソルがフォーカスしてるかどうか

  23. OnPointerExit Graphic領域外に出た時に通知される(色々略)

  24. OnInitializePotentialDrag Graphic領域内で、タップされた際に通知される OnPointerDownと同じタイミング

  25. OnBeginDrag Graphic領域内で EventSystemsのDrag Thresholdの値以上 ドラッグすると通知される

  26. OnDrag OnBeginDragが呼ばれた後 指を動かすと毎回通知される

  27. OnEndDrag Drag中に指を離すと通知される オブジェクトが非アクティブだと通知されない

  28. 他にもいろいろあるんじゃが この世界で生まれいづる仕様は ほぼ全てこれでカバーできるじゃろう

  29. 自分のクラスでそれ受け取りたいよ

  30. PointerEventData 通知の引数で渡ってくる ユニークなタップIDやポジションの情報が入っている

  31. 拡張したら何ができる？ ボタンの長押し 複数ボタンにまたがる連打防止 ドラッグするとバナーとかが切り替わるアレ ゲームパッドのインプットとスマホのインプット機能の共通化 etc

  32. ここから拡張トラブル実例集

  33. OnPointerDown中に他の指でタップされる 同じ領域を他の指でタップされるとOnPointerDownが二回走る PointerEventDataのpointerIdをキャッシュ 処理の最初でバリデーションして弾こう

  34. 非アクティブ中に指を離す or 離さない 長押し機構とか作って、ある程度数値上昇させたら非アクティブにするとか 非アクティブ中に離すとOnPointerUpとOnEndDragが呼ばれない 非アクティブ -> 再度アクティブで指を押しっぱなしにすると呼ばれる

  35. 非アクティブ中に指を離す or 離さない 非アクティブになったらOnDisableで初期化する 押しっぱなしで再度アクティブになるとOnDragなどが走るので 非アクティブ初期化が走っていたら復帰処理をする

  36. ドラッグ中にアプリがバックグラウンドに OnEndDragが呼ばれない OnApplicationPauseでドラッグを強制終了させる Unity 2018.2から呼ばれるようになるらしい 対応してたら気を付けろ

  37. RaycastTargetを切っても通知が来る 通知のブロードキャストのせい 拡張クラスのAwakeで子供のGraphicコンポーネントを検索して RaycastTargetを切る

  38. 動的に子オブジェクトを追加する Graphic.RaycastTargetの初期値はtrue 都度RaycastTargetは切る

  39. 時間がないので ここまで！

  40. もっと話せること EventSystemにくっついてくるInputModuleを拡張する ScrollRectをベースに拡張して音ゲーのセレクト画面ぽいのを作る etc

  41. ありがとうございました 懇親会、ぜひ話しかけてね！