gihyo.jp » DEVELOPER STAGE » 連載 » ActionScript 3.0で始めるオブジェクト指向スクリプティング » 第24回 インスタンスの管理と配列の並べ替え

ActionScript 3.0で始めるオブジェクト指向スクリプティング

第24回 インスタンスの管理と配列の並べ替え

前回の第23回「クラスのデザインとループ処理」では,EllipticMotionクラスのデザインを将来の拡張も考えて整理し,タイムラインのフレームアクションでは繰返し処理により複数のインスタンスを配置した(図1)。

図1 複数のインスタンスが楕円軌道でアニメーションする

図1 複数のインスタンスが楕円軌道でアニメーションする

今回の課題は,まずインスタンスの回転するスピードを,マウスポインタの位置によって変えることにする。つぎに,インスタンスの重ね順を,3次元風の表現に対応するよう修正しよう。

図2 インスタンスの重ね順が3次元風の表現に一部対応していない

図2 インスタンスの重ね順が3次元風の表現に一部対応していない

マウスポインタの位置に応じてインスタンスの回転スビードを変える

まずは,インスタンスが回転するスピードを,マウスポインタの位置によって変えるため,前回のスクリプト2で修正定義したEllipticMotionクラスにもう少し手を加えよう。

今のところ,インスタンスのアニメーションは,コンストラクタメソッドEllipticMotion()の本体で,インスタンスごとのDisplayObject.enterFrameイベント(定数Event.ENTER_FRAME)にリスナー関数rotate()を登録して処理している。

public class EllipticMotion extends MovieClip {
  // ...[中略]...
  public function EllipticMotion(nDegree:Number, myCenter:Point, myRadius:Point) {
  degree = nDegree;
  center = myCenter;
  radius = myRadius;
  addEventListener(Event.ENTER_FRAME, rotate);   // 後に削除
  setRotation();
}

しかし,同じマウスポインタの座標値を,すべてのインスタンスからいちいち確かめるのは効率がよくない。また,のちにインスタンスの重ね順をコントロールする際には,それぞれの仮想の奥行きの値をメインタイムラインから調べる必要がある。

そうだとすれば,タイムラインに配置したインスタンスは,タイムラインのフレームアクションで管理することにしたい。そのうえで,EllipticMotionクラスのrotation()メソッドはタイムラインから呼出し,マウスポインタの座標に応じた回転角の値をその引数として渡そう。

Flashムービー(FLA)ファイルのフレームアクションとして作成した前回のスクリプト3には,タイムラインに配置するEllipticMotionインスタンスが納められるべき配列を新たに変数として宣言し,初期化する。そして,続くforループのコードブロック{}の中で,生成したインスタンスを表示リストに入れるとともに,この配列にも加えることにする。

var instances_array:Array = new Array();   // 追加: 配列を変数として宣言・初期化
for (var i:int = 0; i < nCount; i++) {
  var _mc:EllipticMotion = new EllipticMotion(nDegree * i,myCenter,myRadius);
  addChild(_mc);
  instances_array.push(_mc);   // 追加: 配列にインスタンスを加える
}

これで,タイムラインのフレームアクションで,いつでも配列 (instances_array)からEllipticMotionインスタンスが取出せる。つまり,そのインスタンスを参照して EllipticMotionクラスのrotation()メソッドが呼出せるようになった。そこで,新たな関数rotate()をフレームアクションに定義して,これをタイムラインのDisplayObject.enterFrameイベント(定数Event.ENTER_FRAME)にリスナーとして登録しよう。

var deceleration:Number = 0.1;
// ...[中略]...
addEventListener(Event.ENTER_FRAME, rotate);
function rotate(EventObject:Event):void {   // 追加: リスナー関数
  var nSpeed:Number = (stage.mouseX - myCenter.x)*deceleration;
  var nLength:uint = instances_array.length;
  for (var i:int = 0; i<nLength; i++) {
    var _mc:EllipticMotion = instances_array[i];   // インスタンスの取出し
    _mc.rotate(nSpeed);   // インスタンスのrotate()メソッドを呼出す
  }
}

rotate()関数本体では,マウスポインタのステージ中央からの水平位置に応じた回転角(nSpeed)を求めたうえで,forループの処理によりEllipticMotionインスタンスを配列(instances_array)から順にすべて取出し,その回転角の値を各インスタンスのrotate()メソッドに渡して呼出している(※1)。

以上ふたつの修正を加えたフレームアクションが,次のスクリプト1だ。

スクリプト1 マウスポインタの中央からの水平位置に応じてインスタンスの回転スピードを変える

// タイムライン: メイン
var myCenter:Point = new Point(stage.stageWidth / 2, stage.stageHeight / 2);
var myRadius:Point = new Point(100, 50);
var nCount:uint = 6;
var nDegree:Number = 360 / nCount;
var instances_array:Array = new Array();
var deceleration:Number = 0.1;
for (var i:int = 0; i < nCount; i++) {
  var _mc:EllipticMotion = new EllipticMotion(nDegree * i, myCenter, myRadius);
  addChild(_mc);
  instances_array.push(_mc);
}
addEventListener(Event.ENTER_FRAME, rotate);
function rotate(EventObject:Event):void {
  var nSpeed:Number = (stage.mouseX - myCenter.x) * deceleration;
  var nLength:uint = instances_array.length;
  for (var i:int = 0; i < nLength; i++) {
    var _mc:EllipticMotion = instances_array[i];
    _mc.rotate(nSpeed);
  }
}
※1
マウスポインタのステージ中央からの水平位置に応じてアニメーションのスピードを変える処理については,第12回「マウスポインタとスクロールの連動」を参照してほしい。

著者プロフィール

野中文雄(のなかふみお)

ソフトウェアトレーナー,テクニカルライター,オーサリングエンジニア。上智大学法学部卒,慶応義塾大学大学院経営管理研究科修士課程修了(MBA)。独立系パソコン販売会社で,総務・人事,企画,外資系企業担当営業などに携わる。その後,マルチメディアコンテンツ制作会社に転職。ソフトウェアトレーニング,コンテンツ制作などの業務を担当する。2001年11月に独立。Web制作者に向けた情報発信プロジェクトF-siteにも参加する。株式会社ロクナナ取締役(非常勤)。

URLhttp://www.FumioNonaka.com/

著書

  • ActionScript 3.0プロフェッショナルガイド

    ActionScript 3.0プロフェッショナルガイド(毎日コミュニケーションズ)

  • ActionScript 3.0辞典 [FlashPlayer 10/9対応]

    ActionScript 3.0辞典 [FlashPlayer 10/9対応](翔泳社)

コメント

コメントの記入

パスサポ

多数の情報処理技術者試験対策書籍の発行実績を誇る技術評論社がお届けする,資格試験合格サイト「めざせ! 情報処理試験 パスサポ」が開設されました。

ピックアップ

サクセスストーリーに続く,快適サーバー運用管理のヒント!

データの増大,煩雑な管理,システムダウン,セキュリティなど,迫りくる課題からシステム管理者の負担を軽くするポイントを解説します。

gihyo.jp インフラエンジニア情報局

ネットワークやITにかかわるあらゆる業種で必要とされるインフラエンジニアに向けた技術情報や心構え,その魅力について多角的に紹介。

テストエンジニア ステーション

いま,ITに関わるあらゆる開発業務で注目されつつあるテスト系エンジニアをターゲットにしたコンテンツサイトを展開します。

一行クイックアンケート

gihyo.jpで取り上げてほしいネタは?

※検索はページ右上の検索ボックスをご利用ください。

その他の連載

2010年版SEO体得講座

本連載では,いまや企業サイトの戦略の1つとして欠かすことのできないSEOについて,最新トレンドからすぐに使えるTipsまでを紹介します。

小型Linuxサーバの最高峰 OpenBlockS 600活用指南

搭載メモリの増加,CPUクロックの向上など,あらゆる面が強化された期待の新モデルOpenBlockS 600。この記事ではOpenBlockS 600の紹介から,活用するためのさまざまなノウハウを紹介していきます。

はじめMath! Javaでコンピュータ数学

プログラミング言語入門者向けに,知っていると役立つ数学的トピックスを紹介します。簡単な演習問題と解説で,即活用できる知識を目指します。

教科書には載っていない ネットワークエンジニアの実践技術

ネットワークエンジニア,インフラエンジニアのトラブル対応には,時には「教科書通りにいかない」テクニックが必要となります。資格試験では得られないこうした実践的な技術について,実例を元に紹介します。

Googleケータイ,世に現る

2008年9月,Googleが中心となって開発されている「Android」を採用した携帯電話「T-Mobile G1」が発表されました。本連載ではT-Mobile G1を中心にGoogleケータイに迫ります。

モバゲーオープンプラットフォームに挑戦!――面白法人カヤック流モバゲーオープンプラットフォーム企画と開発のイロハ

2010年1月にリリースとなったモバゲーオープンプラットフォーム。その制作企業であるカヤックが,アイデアを企画に落とし込み,開発までのノウハウを紹介します。

プロトタイピングツールSketchFlowを用いた,Silverlightアプリ開発

SketchFlowプロトタイプ作成からアプリケーション開発までをExpression Blend 3を使って実践的に解説します。

Ubuntu Weekly Recipe

Ubuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。

連載一覧

gihyo.jp

  • DEVELOPER STAGE
  • ADMINISTRATOR STAGE
  • WEB+DESIGN STAGE
  • LIFESTYLE STAGE
  • SCIENCE STAGE
  • NEWS & REPORT

書籍案内

  • 新刊書籍
  • 書籍ジャンル一覧
  • 書籍シリーズ一覧
  • 新刊ピックアップ
  • ロングセラー
  • 電脳会議

定期刊行物一覧

  • Software Design
  • WEB+DB PRESS
  • Web Site Expert
  • 組込みプレス

最近のコメント