Edge Animate 基本ワークフロー講座

Edge Animate APIのご紹介イベントとアクション

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

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
「◯◯が◯◯された時、◯◯する」といった制御を司るのが、イベントとアクションという機能です。ユーザーの行動によって、アニメーションの制御を行うことが可能です。これを理解すると、ゲームといったコンテンツも作成できるようになります。また、Edge Animate の特有の機能にアクセスするためのEdge Animate APIについても、その基本をご紹介します。
講師:
05:14

字幕

このレッスンでは、EdgeAnimateのイベントとアクションそして、Edge AnimateAPI についてそれらがどんな様なものであるかその基本を解説していきます。まず、イベントとアクションとは例えば、ある特定の要素に対して丸々がされたら、丸々を実行するといったEdge Animate上でのプログラムでの制御のことを指します。実際に、サンプルを作りながら解説していきます。まずは、ステージ上に要素を 設置します。この様に設置します。そして、ここからエベントとアクションの登録に入っていきますがその登録方法はこちらの「エレメント」パネルの該当する要素の左端にあるこのカギ括弧のアイコンこちらをクリックすることによってできます。クリックしてみましょう。すると、この様な画面になります。今、ここにメニューが表示されていてここのメニューの中にはこの要素が丸々された時の丸々に当たる部分の選択が可能です。例えば、一番上ですとClick要するに、この要素がクリックされた時何かの処理を行うという意味ですね。その下がdbclickその下がmouseoverこの様に、いくつか選択肢があって例えば、スマートフォンやタブレット端末向けの選択肢もありますね。 touchstartやtouchmovetouchendそして、こちらにはスワイプもありますね。今回は、例として一番上のClickを選択しておきます。そうすると、この様にコードパネルが開きここに、「マウスクリックのコードをここに挿入します」と書いてあります。これは、この要素がマウスクリックされた時に行う処理をこのエリッタの部分に書いてください、という意味ですね。今回は、例えばalertを出してみましょう。JavascriptでAlertと書いてこちらに「これはテストです」と書いてみましょう。この状態で、一度ブラウザーからプレビューしてみましょう。そうすると、この様に要素が表示されていますが先ほどイベントに登録したClickをしてみるとこの様に、「これはテストです」というAlertが表示されました。この様に、ある特定の要素に対して丸々されたら、丸々の処理を行うの設定を行うのがイベントとアクションという機能ですね。さて、ちなみに先ほどのコードパネルのこちらのエリッタ部分実は、Edge Animateではここに、jQueryを使って記述することも可能ですので例えば、Edge Animateの中でピュアされている要素などにjQueryを使って直接アクセスすることも可能です。 また、こちらのエリッタ部分ここには、Edge Animate APIと呼ばれるEdge Animate専用に用意されたプログラムを書いていくことができます。Edge Animate APIはJavascriptでEdge Animateの特有の機能にアクセスするための機能でシンボルの操作やタイムラインの操作などができるようになっています。ちなみに、こちら右にあるこの「スニペット」パネルこちらには、Edge AnimateAPIの中でもよく使うものが登録されていてこちらをうまく活用していくことでスムースに開発していくことが可能です。例えば、「再生」タイムラインの「再生」やタイムラインの「停止」他にも、要素の「表示」といったようなことがEdge Animate APIで用意されておりこの様に、「スニペット」パネルの中に登録されています。一方で、この「スニペット」パネルに登録されていないプログラムや更に複雑のプログラムの記述が必要となる場合はインターネット上にEdge Animate APIのドキュメントが用意されております。こちらですね。かなり詳細な情報が掲載されていますのでこちらも参考にしてみるとよいでしょう。 以上で、レッスンは終了です。今回は、Edge Animateのイベントとアクションそして、Edge Animate APIの内容についてその基本を解説致しました。別のレッスンではEdge Animate APIを利用してアクションで、タイムラインを制御する方法も取り上げていますのでそちらも合わせて参考にしてみてください。

Edge Animate 基本ワークフロー講座

このコースではEdge Animateでアニメーションを制作していくさいの基本的なワークフローを実際に作りながら学習していきます。新規プロジェクトの作成からタイムラインアニメーションの制作、シンボルの使い方やオーディオの利用、各種デバイスに対応させる方法などについて解説します。

2時間54分 (24 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2014年06月30日

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

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

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