Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Cocos2d-x(JS) ハンズオン #04「タッチイベントの使い方」

1,043 views

Published on

2016/2/5 イベント&コミュニティスペース dots.にて開催したCocos2d-x(JS) ハンズオン #04 「タッチイベントの使い方」の資料です。Cocos2d-xにおけるイベント関連を紹介しました。

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Cocos2d-x(JS) ハンズオン #04「タッチイベントの使い方」

  1. 1. Cocos2d-x(JS) ハンズオン #4 タッチイベントの使い方 株式会社TKS2 清水友晶
  2. 2. 清水 友晶  株式会社TKS2 アプリ開発コンサル Cocos2d-xサポート スマホアプリ開発  プライベートでも Cocos2d-xに関するゲーム開発 講演活動 執筆活動  マイブーム: ゲームエンジン調査  チラ裏開発メモ: http://tks2.net/memo  SlideShare: http://www.slideshare.net/doraemonsss  Facebook: http://www.facebook.com/doraemonsss
  3. 3. http://line.me/S/sticker/1085672
  4. 4. もくじ  おさらい  Cocos2d-x(JS)の開発環境構築  Cocos2d-xにおけるイベントの紹介  cc.EventListenerクラス  cc.EventManagerクラス  イベントの種類  実際にさわってみる  シングルタッチイベント  マウスイベント  キーボードイベント
  5. 5. イベントの紹介
  6. 6. 新しい画像ファイルの追加  新しい画像は「res」フォルダに配置する  cat1.png  cat2.png  cat3.png を配置しよう http://tks2.net/handson/20160205/cat1.png http://tks2.net/handson/20160205/cat2.png http://tks2.net/handson/20160205/cat3.png
  7. 7. cc.EventListenerクラス  タッチイベント  cc.EventListener.TOUCH_ONE_BY_ONE  cc.EventListener.TOUCH_ALL_AT_ONCE  キーボードイベント  cc.EventListener.KEYBOARD  マウスイベント  cc.EventListener.MOUSE  加速度センサイベント  cc.EventListener.ACCELERATION  カスタムイベント  cc.EventListener.CUSTOM
  8. 8. cc.eventManager  ユーザが作成したリスナーの登録  addListener  見た目順(ZOrderの降順)にイベントが発生 setSceneGraphPriority  優先順の昇順にイベントが発生 setFixedPriority  リスナーの削除  removeListener
  9. 9. イベントの種類  シングルタッチイベント  cc.EventListener.TOUCH_ONE_BY_ONE  onTouchBegan  onTouchMoved  onTouchEnded  onTouchCancelled  マルチタッチイベント  cc.EventListener.TOUCH_ALL_AT_ONCE  onTouchesBegan  onTouchesMoved  onTouchesEnded  onTouchesCancelled
  10. 10. イベントの種類  キーボードイベント  cc.EventListener.KEYBOARD  onKeyPressed  onKeyReleased  マウスイベント  cc.EventListener.MOUSE  onMouseDown  onMouseUp  onMouseMove  onMouseScroll
  11. 11. イベントの種類  加速度センサイベント  cc.EventListener.ACCELERATION  onAccelerationEvent  カスタムイベント  cc.EventListener.CUSTOM  onCustomEvent
  12. 12. 実際にさわってみる
  13. 13. シングルタッチイベント  cc.EventListener.TOUCH_ONE_BY_ONE  タッチ開始: onTouchBegan  戻り値 true, false  スワイプ: onTouchMoved  タッチ終了: onTouchEnded  タッチキャンセル: onTouchCancelled  手順  リスナーの作成  リスナーの登録
  14. 14. シングルタッチイベント
  15. 15. シングルタッチイベント
  16. 16. 画面をタッチすると ログ
  17. 17. ノードに対するタッチイベント
  18. 18. 画面をタッチすると ログ スプライト以外 をタッチしても、 先ほどと同じ
  19. 19. onTouchBeganにて判定が必要
  20. 20. 画面をタッチすると ログ スプライトをタッ チした場合のみ イベントが有効
  21. 21. 複数ノードに対する タッチイベント
  22. 22. 画面をタッチすると ネコをタップする と移動できる しかし、ネコが重 なっている箇所を タップすると複数 のネコが移動する
  23. 23. 単一のノードのみタッチする
  24. 24. 画面をタッチすると ネコが重なってい る箇所をタップす ると最前面のネコ が移動する
  25. 25. マウスイベント
  26. 26. キーボードイベント
  27. 27. 作業はここまで
  28. 28. 参考になるサイト  Cocos公式Wiki http://www.cocos2d- x.org/wiki/Cocos2d-JS  Cocos2d-JS APIリファレンス http://cocos2d-x.org/wiki/Reference  Qiita (tag: cocos2d-js) https://qiita.com
  29. 29. おわり  ありがとうございました

×