StarlingフレームワークによるStage3Dを使った2次元表現

ドラッグのマウス操作とTouch.phaseプロパティ

全334コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
どのマウス操作が行われたかは、TouchオブジェクトのTouch.phaseプロパティプロパティで調べます。
講師:
11:51

字幕

Starling フレームワークにおける マウス操作の扱いというのは Action Script 3.0 定義済みとは 少しばかり勝手が違います 特にドラッグを念頭において Starling フレームワークにおける マウス操作の扱いについてご説明しましょう Starlingフレームワークには そもそも マウスイベントというクラスがありません TouchEvent と言うんですね これはマウスもタッチパネルも 全ての操作が TouchEvent です しかもマウスボタンを押すのも 離すのも動かすのも 全て DisplayObject.touch イベント addEventLister に渡す定数としては TouchEvent.TOUCH と これ 1 本に決まっています では どうやってマウスの操作 マウスボタンを押したのか離したのか マウスを動かしたのか区別するかというと EventListener のメソッドが受け取る Event オブジェクト これが TouchEvent オブジェクトなんですが その GetTouch というメソッドを使うと Touch オブジェクト というものが取得できます この Touch オブジェクトが マウス操作の内容を知っていますので この Touch オブジェクトに 聞くということになります 具体的には Touch オブジェクトの Touch.phase というプロパティがあります このプロパティを問い合わすと この操作がマウスボタンを押したのか マウスを動かしたのか マウスボタンを離したのか という値が取れます Touch オブジェクトの Phaseプロパティの値というのは Touch.phase クラスという中に 定数で定められていますので Touch オブジェクト Phase プロパティが TouchPhase クラスの どの定数と等しいかという 透過比較をすれば 現在の操作の内容が分かります Touch オブジェクトの Phase プロパティの値を調べた時に TouchPhase クラスの定数に あてはめますと マウスボタンを押した時が TouchPhase クラスの BEGAN という値になります ドラッグすると今度はそれが MOVED です TouchPhase.moved そして マウスボタンを離した時に TouchPhase クラスの ENDED という値になります ですから 押した 動かした 離したというのは この 3 つのどの phase どの定数に等しいかということを 調べれは分かります この Starling ルートクラスは ライブラリのビットマップを ステージの真ん中に配置しています 簡単に手順を確認すると ライブラリのビットマップには Pen という名前が付いているんですが そのコンストラクタを呼び出して BitmapData として変数に取得し その BitmapData を Texture.fromBitmapData というメソッドで Texture に変換します そうしたらそれを ステージに配置するためには image のコンストラクタに渡して imageオブジェクトにして そしてタイムライン この Starling ルートクラスの子どもに addChild すれば良い訳ですね 後 この 4 行は インスタンスの位置をステージ中央にして それから基準点を真ん中にしています この Starling ルートクラスには マウスをドラッグしたということを 確かめるための 簡単なテスト用ステートメントを 加えたいと思いますが その前に今現在の状態を 一応確認しておきましょう では フラファイルの方に切り替えて 制御メニューからムービープレビューです 先程ご説明した通り ビットマッップのインスタンスが ステージ中央に配置されています 動きませんしマウスのイベントに関する操作も 全く加えられていません これを これから加えます ではウインドウを閉じて Starling ルートクラスの方に切り替えて スクリプトをフルスクリーンにするために ファンクション 4 を 2 回押します 先に必要なクラスを インポートしておきましょう 必要なクラスは TouchEvent に関連して 3 つあります Starling の events の Touch です これが Touch オブジェクトのクラスです 更に Starling の イベントの events の TouchEvent です これが Listener の受け取る オブジェクトになります そして今度は 操作は 何の操作をしたかということを調べるための これも events なんですが TouchPhase と この定数でどんな操作をしたのか調べます ここまで先ず保存をしておきましょう ファイルメニューから保存です そうしたら次は EventListener を加えましょう 初期化のメソッド initialize という所ですね 戻り値の指定がしていないので しておきましょう void です では この addChild の後に addEventListener コピーしてしまいましょうね キーボードからコントロール若しくは コマンドキーを押しながらドラッグです そして Event は TouchEvent です これもコピーしてしまいましょう TouchEvent コントロール若しくはコマンドドラッグです その中の もう Touch と決まっています 1 個しかないですね Touchで テスト用のメソッドを定義します ではこれは onTouch にしましょう そのままですね そして このメソッドを定義していきます Listener のメソッドを定義します では この後に private で function ですね function と入力するのは ショートカットを使うと便利です エスケープキー 1 回 キーボードの f のキーを 1 回 n のキーを 1 回 この順番に入力します [esc] f n と これで function 丸括弧 () 中括弧 { まで入力できますので インデントを整えて メソッドはこの名前にしました タイプミスしないように コピーしておきましょう 引数に Event オブジェクトを受け取ります 型指定は TouchEvent です そして戻り値の型指定は void ここにステートメントを入力していきます 先ずは Touch オブジェクトを 取得するんでした 変数に取りましょう myTouch とします 型指定はもちろん touch ですね そしてTouchEvent は Event オブジェクトから 取得しますのでコピーします コントロール若しくはコマンドドラッグ メソッドは getTouch です そして この引数には どのオブジェクトから 検知するのかということがあります 今回はドラッグの場合には ステージから見たので良いと思います 子どもに対しては全部検出されますので 一番トップということで ステージにしておきます これで Touch オブジェクトが得られて その今 phase がどうなっているか ということを調べれば良いんですが もし検出したいのが 1 つだけ 今回ドラッグしているかどうか つまり定数が moved かどうかだけ 調べたいと思います そういう時には第 2 引数で 自分が欲しいのはこれだよ と指定することができます TouchEvent で TouchPhase ですね TouchPhase で moved の場合だけ知りたいんだと言うと 第 2 引数で指定します そうすると moved の時だけ オブジェクトが取得できます Touch オブジェクトが得られて moved でない場合 Touchマウスボタンを押した場合 離した場合は 空っぽになります null になりますので それがあるかどうかを 判別することになります ここで Touch オブジェクトを入れます もし空っぽであれば if 条件 if 文で弾かれます 中身があれば 今現在 moved の状態だ ということになりますので確かめましょう Trace 関数で このオブジェクトの Phase を確かめてみましょう moved に本当になっているかどうかですね 確かめてみたいと思います ではファイルは保存します ムービープレビューで確かめて見ましょう フラファイルの方に切り替えます そして制御メニューから ムービープレビューです 実はドラッグの操作は Action Script 3.0 定義済みよりも 捉えやすいです なぜかと言うと Action Script 3.0 で マウスを動かした場合 そのイベントは ともかく動かせば イベントが発生してしまいました ところが trace に何も出てこないですね 出力に なぜかと言うと phase という捉え方をします ですからインスタンスの上で マウスボタンを押して初めて 動かしたかどうかが調べられます 今 押しました 押して動かす この時 初めて moved という イベントが起こると つまり phase が moved だよ という風に確かめられる訳です そしてマウスを ボタンを離してしまうといくら動かしても Touch オブジェクトは moved という判定にはなっていません もう 1 回ちょっと消してみましょう 消去します 単純に いくら動かしても Touch オブジェクトが moved だ という phase にはなりません 押して 動かした時 初めて moved と判定されるので またマウスボタンを離してしまうと 何も起こらなくなると ですから これだけで ドラッグの判定ができてしまいます では このドラッグの 判定の仕方をまとめましょう Starling ルートクラスの方に移り スクリプトをフルスクリーンで見ますので ファンクション 4 番を 2 回押します Starling フレームワークで TouchEvent を使った ドラッグの捉え方をおさらいします 先ずは EventListener に Touch ですね TouchEvent.TOUCH というイベントに Listener を登録します そして この Listener ですが 受け取ったイベントオブジェクト Touch オブジェクトのイベントですけれども それに対して GetTouch というメソッドを呼び出します そうすると Touch オブジェクト というのが受け取られます その時 引数は どのオブジェクトから見るのかという 第 1 引数と 第 2 引数はオプションですけれども この phase の Touch オブジェクトが欲しいんだよ という指定ができます 今回は これを指定しましたので TouchPhase がmoved の時だけ Event オブジェクトが取れます そして この if 条件で Event オブジェクトが ちゃんと取れたかどうか確かめます 取れたということは TouchPhase が movedということが分かりますので それを trace してみました すると確かに moved という文字が出てきましたね 因みに この TouchPhase の定数というのは 全部文字列になっていますので 出力パネルに出力すれば 文字列が表示されます この様に Starling フレームワークでは ドラッグの操作は比較的簡単に取れます

StarlingフレームワークによるStage3Dを使った2次元表現

StarlingはFlash Player 11の新しい描画機能Stage3Dに基づいて作られた2次元の描画用フレームワークです。このコースではStarlingフレームワークによるクラス定義の基礎から、トゥイーンアニメーションやマウスインタラクション、そして最近のバージョンで実装された新しい機能まで解説していきます。

5時間09分 (40 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
カテゴリー
プログラミング
価格: 3,990
発売日:2014年01月26日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。