説明

EaselJS 0.8.1のMovieClipクラスには、再生の尺つまり再生にかかる長さを示すプロパティが新たに加わりました。MovieClip.durationとMovieClip.totalFramesがそのプロパティで、いずれも再生し終えるまでのミリ秒数またはDisplayObject.tickイベント数を示します。デフォルト値は後者のDisplayObject.tickイベント数です。イベントごとにアニメーションは1フレーム進みますので、総フレーム数と捉えてもよいでしょう。

EaselJS 0.8.0でも、MovieClip.timelineプロパティの参照からTimeline.durationプロパティで同じ値は得られました(「EaselJS 0.8.0: Flash Pro CCでパブリッシュしたMovieClipオブジェクトの総フレーム数を参照する」参照)。そして、この値を参照するためのプロパティが、MovieClipクラスに備わったということです(後述「実装」参照)。プロパティ名のMovieClip.durationは、Timeline.durationからとったものでしょう。MovieClip.totalFramesは、ActionScriptになじみのあるユーザーがわかりやすい名前を、同じ値に対して与えたプロパティです。

Timeline.durationプロパティは読取り専用ですので、その値を参照するMovieClip.durationとMovieClip.totalFramesも値を書替えることはできません。なお、MovieClip.currentFrameプロパティの値は0から始まる連番整数ですから、最終フレーム番号は総フレーム数から1差引いた数値です。

例

つぎのスクリプトをMovieClipインスタンス(my_mc)に定めると、アニメーションは一度だけ再生されます。DisplayObject.tickイベントのリスナー関数が、プロパティMovieClip.currentFrameとMovieClip.totalFrames - 1を比べ、最終フレームになったら再生を止めてイベントリスナーを削除しています。

my_mc.addEventListener("tick", playOnce); function playOnce(eventObject) {   if (my_mc.currentFrame >= my_mc.totalFrames - 1) {     my_mc.stop();     my_mc.removeEventListener("tick", playOnce);   } }

実装

ふたつのプロパティはMovieClipクラスの実装で、Object.defineProperties()メソッドによりgetterとして定められています^[*1]。そして、内部的に呼出されるMovieClip.getDuration()メソッドが、MovieClip.timelineの参照からTimeline.durationプロパティの値を得て返しています。

Object.defineProperties(MovieClip.prototype, {   totalFrames: {get: MovieClip.prototype.getDuration},   duration: {get: MovieClip.prototype.getDuration} }); MovieClip.prototype.getDuration = function() {   return this.timeline.duration; };

なお、MovieClip.timelineプロパティの実装では、useTicksオプションをtrueに定めたTimelineオブジェクトが与えられます。つまり、MovieClip.timelineプロパティは、Timeline.durationの単位としてtickを用いるということです。

function MovieClip(mode, startPosition, loop, labels) {   this.timeline =   new createjs.Timeline(null, labels, {paused: true, position: startPosition, useTicks: true}); }

作成者: 野中文雄
更新日: 2015年6月5日 注[*1]を修正。
作成日: 2015年6月1日