ささきち流 Suzuka & ParaDraw 講座
Suzuka & ParaDraw
TOP
PROFILE
ActionScript Editor
LINK
BBS


フリーのFlash作成ソフト SuzukaParaDraw でFlashな生活を楽しもうというサイトです。
Suzuka 基礎・基本 ★ ターゲットパス(&階層)

 このページは,ターゲットパス と 階層 に関しての説明をするだけのページなので,ダウンロードしてもらうサンプルファイルは用意していません。

 ターゲットパス 及び スプライト(Adobe Flash のムービークリップ)の階層は ActionScript(アクションスクリプト) を使用する上で常につきまとう最重要基礎事項ですから,タイトルに★マークを付けて他の物とは少し区別しています。

 Suzuka 0.7.4 以降では,スクリプトエディタにターゲットパスを挿入するボタンが付いて,レイヤーに配置したインスタンスへのパスを自動記入してくれる機能が付きました。
 下の図のような機能です。

ターゲットパスの挿入

 ターゲットパスを挿入するボタンは銃の照準のようなマークのボタンで,おそらくターゲットを狙い撃つ機能のボタンなのでそういう形をしているのだと思います。

 スプライトインスタンス(スプライト シンボル を レイヤー に配置したもの)は階層を持ちます。
 一方,ボタンインスタンスやテキストフィールドは階層を持ちません。
 Suzuka や Flash でわからなくなったりケアレスミスをする箇所は,タイムラインではなく,この階層やターゲットパスに関する部分が多いと思います。

 

 スプライトインスタンスは,一種のフォルダのようなもので,その中にさらにスプライトインスタンスやボタンなどを配置することができます。
 フォルダのようなものなので,違うスプライトインスタンスの中に同じインスタンス名のものを配置することもできます。

 また,メインのタイムラインもインスタンスを入れるフォルダのようなもので,_root または _level0 という広義のスプライト(ムービークリップ)と考えて差し障りがありません。
 したがって _root.gotoAndPlay(2); などのように,MovieClipクラスのメソッドやプロパティの多くが _root に対しても使用可能です。

 この階層があるから面倒なのではなくて,階層があるからこそ構造管理がしやすいのです。
 たとえば,日本にはおそらく「鈴木鈴子さん」という名前の方がたくさんいらっしゃると思いますが,
もし,日本-大阪府-吹田市-鈴鹿台-9-15 という住所に 「鈴木鈴子さん」がいらっしゃったとしても,
その住所にはおそらく1人しか 「鈴木鈴子さん」 はいらっしゃらないと思うので,
郵便物配達員の方も,日本-北海道 の 「鈴木鈴子さん」と間違えることは普通ありません。

 ターゲットパスとは,インスタンスに対するフォルダ(階層)住所のようなものだと思っていただければわかりやすいと思います。
 ActionScript を,スプライトやボタンやアクションフレームなど,あるインスタンスに書くとき,違う階層のインスタンスに命令をしたり,違う階層のプロパティを変更する場合は,このターゲットパスが必要になります。
 また,ターゲットパスには,HTML にリンクするときのパスと同じように,絶対パス と 相対パス があります。

 Suzuka 0.7.4.1 では,ターゲットパスを挿入するボタンでの相対パスは,"子階層に限って" 自動記入してくれます。親階層に対しての相対パス自動記入がされないのは,オブジェクトがシンボルである状態では,インスタンス階層を特定することが不可能であるためです。これは当然のことです。
 将来的に,もし,スプライト「インスタンス」を編集できるような仕様に変われば,親階層に向けての相対パス自動記入も可能になるかもしれません。

 スプライトインスタンスの階層が次のようなものであったとします。

_root (メインのタイムライン)
 ├mcA (スプライトのインスタンス名)
 │ ├mcX (スプライトのインスタンス名)
 │ └mcY (スプライトのインスタンス名)
 └mcB (スプライトのインスタンス名)
   ├mcX (スプライトのインスタンス名)
   └mcY (スプライトのインスタンス名)

 これをイメージ図で示すと次のようになります。

スプライト(ムービークリップ)の階層

 この ターゲットパス を,日本-大阪府-吹田市-… のような絶対パスで示すと次のようになります。

スプライト(ムービークリップ)のターゲットパス(絶対パス)

 例えば,

_root (メインのタイムライン)
 └mcA (スプライトのインスタンス名)
   └mcX (スプライトのインスタンス名)

 この絶対パスは,_root.mcA.mcX になるということです。
例えば _root.mcA.mcX のタイムラインの再生ヘッドを停止させたい場合は,

_root.mcA.mcX.stop();

 と書けば良いということで,
 例えば _root.mcA.mcX のアルファ(不透明度)プロパティを 50 にしたい場合は,

_root.mcA.mcX._alpha = 50;

 と書けば良いということです。

 

 ターゲットパスの表し方にはもう1つ,相対パスがあります。
 使い勝手はこちらの方が良い場合があるというか,HTMLのファイルリンクパスのように,相対パスにしないとシンプルに書けないような場合も多々出てきます。
 しかし,絶対パスに比べて少々ややこしいのが難点です。
 絶対パスで言うところの,_root.mcA.mcX からの相対パスを示すと次の図のようになります。

スプライト(ムービークリップ)のターゲットパス(相対パス)

 例えば,

_root (メインのタイムライン)
 └mcA (スプライトのインスタンス名)
   └mcX (スプライトのインスタンス名)

 から,

_root (メインのタイムライン)
 └mcB (スプライトのインスタンス名)
   └mcX (スプライトのインスタンス名)

 を見た相対パスは,

this._parent._parent.mcB.mcX

 になるということです。
 parent は英語でそのまま「親」ですね。

 _root.mcA.mcX をクリックしたとき,_root.mcB.mcX の x座標 を右に 10px 移動させたい場合は,
_root.mcA.mcX 自体に次のように書きます。

on(release){
	this._parent._parent.mcB.mcX._x += 10;
}

 

 次の図は Flash です。視点(始点)である「目」マークと,ターゲットである「照準」マークがドラッグで移動できます。そしてそれぞれのパスが確認できます。
 ターゲットパス の理解を深めるためにも,よろしければドラッグして遊んでみてください↓。

 

◎スプライト階層に対するthis に関してですが,

_parent._parent.mcB.mcX

 のように this を略して説明されているサイトも見かけることがありますし,実際普通に使うのであれば,この this は省略可の場合が多いです。
 つまり,上で書いた

on(release){
    this._parent._parent.mcB.mcX._x += 10;
}

この場合では,

on(release){
	_parent._parent.mcB.mcX._x += 10;
}

 としても差し障りはありません。
 しかし,スプライト(ムービークリップ)に対して,

_root.mcA.mcX.onRelease = function() { };

 などを使った場合,{ }; 内で this を省略して相対パスを書くと,
_root.mcA.mcX から見たパスではなく,そのスクリプトを書いた階層から見た相対パスとして Flash が動作してしまいます。

 例えば,メイン(_root)のフレームのスクリプトとして次のように書けば上と同様に無事動作します。

_root.mcA.mcX.onRelease = function() {
	this._parent._parent.mcB.mcX._x += 10;
};

 しかし,次のように書くと何も動作しません。

_root.mcA.mcX.onRelease = function() {
	_parent._parent.mcB.mcX._x += 10;
};

 これは,this を省略したために,このスクリプトを書いた _root に対する _parent の _parent 内の mcB 内の mcX の x座標を右に動かそうとするからです。
 そんなところには何もないので,何も動作しません。

 this は省略可の場合と不可の場合がありますから,もしややこしいと思われる場合は,「 this は省略しないほうが良い」と思っておく方が良いと思います。

 昨今は本当に,on(releace){ } など onハンドラ ではなく,○○.onRelease = function() { }; のような onハンドラメソッド が使われる場合が多くなりましたから "this は省略した場合と省略しない場合とでは意味が変わる" ときが多々あります。
 とにかくこの this の省略に関しては要注意です。

 あと,この this について深く書いていると,ターゲットパスと階層に関する基本説明ではなくなってくるので深くは追究して書きませんが,
this はいつもスプライトの階層を示すものではありません。
 もし this が何なのかわからなくなれば, trace(this); を書いてから,[ウィンドウ]→[プレビュー]するなどして,this とは何かを確認しながらスクリプトを書いて行くことをお薦めします。

 

 

 

---ダウンロード用サンプルファイルは用意していません---