１ページ目
２ページ目
アクションスクリプトつかってみる？ † 
Flashでちょっと複雑な処理をする際に必要になってくるアクションスクリプト。
サンプルと解説をしてみますね。
目次 †
「小物がランダムで流れてくる」に挑戦 †
黒猫さん作のこの作品、背景小物が流れてきます。
こやすの墓や卒塔婆はあれランダムで来てるのかな
何気に高度な事やってるのかそれとも簡単なのか…フラッシュ挫折組みの俺にはわからん
背景ランダムくさいな
どうなんだろう、ラクにできるのかなこれ
確かに見る度に背景の出現パターンが違っていますね。恐らくアクションスクリプトで制御していると思われます。
実際に似た様な事をしたサンプルを作成してみました。lzhファイルを解凍すると、swfファイルとcfsファイルの二つが出てきます。
csfファイルをSuzukaで開くと、どのような仕組みになっているか覗いてもらえます。
以下、延々とサンプルプログラムの解説になっていて、読むとうんざりするかもしれません。
実際にアクションスクリプトのリストを覗いて、もうちょっと解説が欲しい時にその行に対応した節を読む程度がいいかもしれないです。
素材とステージ配置物の確認 †
アクションスクリプトの話を始める前に、それ以外の構造の確認をしましょう。
素材は４つ、ステージへの配置物は２つ。
素材のうち１つは、見た目を変化させる為に他の３つの素材を内包しています。
素材 †
Suzukaの画面上段左側がシンボルリスト、素材置き場です。
「そんなに」「や医だな」「まめしば」の三つのテキスト素材と、
それを使った「配置：文字ブロック」というスプライト素材、合計４つのシンボル(素材)が用意されています。
レイヤーリスト＆タイムライン †
Suzukaの画面上段右側がレイヤーリスト＆タイムラインです。
「文字移動_1」「文字移動_2」「背景」の３つのシンボルが並んでいます。
二つの「文字移動」というレイヤーは、それぞれ「配置：文字ブロック」を配置して名前をつけたものです。
「配置：文字ブロック」の構造 †
もういちどシンボルリストへ、「配置：文字ブロック」を選択して【編集】ボタンをクリックし、構造を見てみましょう。
難しいことはしていません。レイヤーリストに３種類の文字素材が、タイミングをずらして一コマずつ並んでいるだけです。
確認が出来たら、レイヤーリストの上にピンクで表示されている「配置：文字ブロック（ID4）」をダブルクリックしてメインタイムラインに戻りましょう。
ピンクの「配置：文字ブロック（ID4）」表示が、青の「メイン（略）」の表示に切り替われば、メインタイムラインに戻れて居ます。
アクションスクリプト †
さてアクションスクリプト（以下ASと表記）に話を移しましょう。
ASが使えるようになれば、ただ垂れ流すだけのFlash作品から一歩抜け出せます。
プログラムを組むのは難しそう？確かに難しいプログラムを組むのは大変です。
命令を全部暗記なんて面倒くさいです。
でも、必要なトコをちょっとずつ抑えていけばどうにかなりますって。
AS何処に書く？ †
ASを記述できる場所は３種類あります。タイムライン上のASレイヤー、スプライト、ボタンの３種類です。
それぞれ出きる事がちょっとずつ違うんですけど、今回はスプライトの中に仕込みます。
中に仕込むとかエロいですね。
さてスプライトですが、シンボルリストでいえば「配置：文字ブロック」がスプライトシンボルになっています。
でもこれには直接書き込めません。レイヤーリストに配されたスプライトにASを書き込む事になります。
どんな事をさせたいのか †
では今回はASを使ってどんな事をしたいのか、纏めてみましょう。
「色々なものがランダムに次々流れてくる」ですね。
これを「色々なものが」「ランダムに」「次々」「流れてくる」に分けて考えてみます。
このうち「色々なものが」「次々」はASではなく、素材や配置で工夫して表現します。
「次々」はステージに配置する数で表現。今回は「文字移動」を二つ配置して表現しました。
「色々なものが」はテキストを３種類用意して表現しています。
スクリプトエディタを開く †
そろそろどんなASが記入されているか見てみましょうか。
レイヤーリスト上の「文字移動_1」を選択し、画面右下にある【スクリプトを編集】ボタンを押してください。
スクリプトエディタが表示されます。
23行に渡り、なにやら書き込まれていますね。これがASです。
見やすいように一行ずつ間を空けていますので、実際には１１行分しかありません。
初めて見るという人には長く感じるかもしれませんが、慣れてしまえば大した長さではありません。
因みに、もしもスクリプトエディタが画面左下に細長く表示されているのであれば、
【＜＜】ボタンを押して切り離すと見やすいと思います。
AS解説 †
では順番に何をしているのか解説していきますね。
発動条件！（１行目・19行目） †
１行目には次のような命令が書かれています。
onClipEvent(enterFrame){
これは15行目の
}
と一組になっています。
この命令は対戦カードゲームでいう「発動条件」にあたり、( )内の enterFrame は「このスプライトが再生される度に」を意味します。
「このスプライトが再生される度に」、｛ ｝で括った効果を発揮しますよ、という意味になります。
「このカードが場に存在する間、常に次の効果を得る。」とでもいいましょうか。
19行目も同じく発動条件。
onClipEvent(load){
こちらの load は「このスプライトが初めて登場した時に」効果を発揮するという条件。
カードゲームで言えば「手札から場に出された時に次の効果を発動する。」といったところでしょう。
こちらも、23行目の
}
と一組になっています。
効果その１！（21行目） †
行数の順でいけば１行目以降の効果が先のようにも思えますが、
実は「手札から場に出された時に」である、19行目から23行目の効果内容が先に処理されます。
その効果は次のように書かれています。
this.gotoAndStop(1);
この行の頭についている this. の部分は、何処に対して効果を発揮するのかの指定です。
this. すなわち「このカード」に対する効果ですよ、という指定です。
そして続く gotoAndStop(1); は、タイムラインの１コマ目にジャンプして、そこで停止せよという命令です。
( ) で括られた数値のコマにジャンプするんですね。
事前に this. と指定されているので、メインタイムラインではなく、「配置：文字ブロック」の１コマ目「そんなに」の表示にジャンプして、そこで見た目を固定します。
まとめその１ †
つまり19〜23行のASの内容は次のようになります。
「このスプライトがステージに登場した時、これの見た目は１コマ目の「そんなに」になる。」
です。
効果その２！擬似スクロール（３行目） †
では次に、１〜15行目の発動条件 enterFrame に囲まれたASが何をしているかを見て行きましょう。まずは３行目です。
this._x += 8;
となっていますね。
先述したとおり、this は「これの」「このスプライトの」です。
効果対象先として自分自身を指定したという事ですね。
その後は . で区切られたあと _x とあります。
_x は配置されたシンボルが画面横方向のどこにいるか、位置情報がしまわれているプロパティで、位置を確認したり位置を変えたりする際に登場します。
因みに _y ならば縦方向を示しますよ。
さらにその後は += 8; と続きます。
- = は計算式で、これの左側にある内容に右側の内容を加算、足し算してくれます。
つまり _x += 8 は横方向に+８動かすという意味。
一番お尻の : は、この行の命令はここでオワリですよという合図です。
この３行目のASは１〜15の EnterFrame で囲まれていますので、ステージ上に存在している限りずっと処理され続けます。
「このスプライトがステージに配置されている限り、これは毎ターン右に８移動する」
という訳です。
行き過ぎ、戻れ †
ずっと右に移動し続けると、やがてこのスプライトは表示範囲外にはみ出してしまいます。
はみ出した後も放って置くとどんどん右に移動し続けますが、表示外ですので見えません。(実際は表示外もある程度見えたりします)
はみ出した所でこっそり反対側の舞台袖まで移動してもらえば、
さも新しい小物が左から流れてきたかのように見せかけられますよね。
少ない役者で大人数に見せる術です。リサイクルです。
はみ出した事を確認する（５行目） †
でははみ出した事を確認するにはどうすればいいでしょうか。
ここでは前述した _x で、スプライトの位置を確認する方法を使います。
_xの内容を参照し、それがステージ幅（512）＋スプライト幅(64)よりも大きければ、はみ出したと判断できますね。
５行目のASは次のようになっています。
if(this._x >= 576){
この命令は条件によって処理を分けたい時に便利な命令。ifは「もしも」といった意味で、
「もしも（ ）内の条件の通りならば { } で括った内容の効果を発揮する」という能力を持っています。
（ ）内の式は this._x >= 576 となっています。this._xは「このスプライトの横位置」ですね。
= は、左辺が右辺よりも大きいか等しければ、という意味なので、
「もしもこのスプライトの横位置が576以上になった場合、次の効果が発動する」となります。
この５行目のif命令は、13行目の } と一組になっています。
「次の効果」は ｛ ｝ で囲まれた７・９・11行目に記されている訳です。
左端にワープ！（７行目） †
画面からはみ出した時に発動する効果の一つ目は、はみ出したスプライトを反対側の端にワープさせる事です。
this._x = 0;
というASが記述されていますが、これは「this._xと0が等しい」という意味ではありません。
＝は「等しい」ではなく、「左辺の内容を右辺の通りに書き換える」という意味になります。
つまり、「このスプライトは横位置０に移動する」という事です。
サイコロころがそう（９行目） †
さていよいよお待ちかね、ランダム命令の登場です。ちょっとややこしいですよ。
読むのメンドクセー！ってこやすさん！そう、そこのあなた！
ぶっちゃけ９行目のAS丸暗記でいいと思います。丸暗記して次に進もう！
９行目は次のような命令が記述されています。
aa = math.floor(math.random()*3)+1;
このASで何をしているのかというと、「出目が１〜３のサイコロをひとつ振る」をしています。
切り分けて見て行きましょう。
まずは aa = math.flo（略）ですが、前述の通りこれは＝の左辺「aa」の内容を、右辺の内容に書き換えるという事。
aaというのは製作者個人が用意する変数です。
変数というものは色々な数値や文字をひとつ書いておけるメモのようなもの。
aaというのは私が勝手につけた適当な名前で、どの程度適当かというとキャラクタの名前を「ああああ」にする位適当な名前です。
適当に好きなように名付けれるのですが、一応制約があって、
- 半角英数とアンダーバーのみしか使えない
- 先頭の文字はアルファベットである必要がある
- 大文字小文字は区別されない
- ASの命令ワードと同じ名前は使えない
- （今まで出てきた「this」「if」「gotoAndStop」などは使えない訳です）
というルールに従って命名する必要があります。
さて、肝心の右辺を見てみましょう。
math.floor() に囲まれて math.random() があります。これがランダム、擬似乱数を生み出す素なのです。
このランダム命令は０以上１未満の数字を発生させる命令で、そのままでは必要な数字を吐き出してくれません。
今回欲しいのは１〜３の数字です。その結果を得るようにするため、math.random()の後に*3と書き加えてあります。
これによってこのランダム命令は０以上３未満の数字を小数点以下のオマケもつけて吐き出すようになります。
もしも*6とした場合は０以上６未満、*100とした場合は０以上１００未満が吐き出されます。
で、実はこの小数点以下が結構邪魔者なんですよこやすさん。
そこで登場するのがランダム命令を囲んでいる math.floor() です。小数点以下をスッパリ切り落としてくれる頼もしい味方です。ヤッタネ！
floorさんのおかげで無事０・１・２のいずれかの数字が取り出せる訳です。
…駄目じゃん！我が求める数字は１・２・３じゃん！とお嘆きのあなた、最後についている+1を忘れないであげて下さい。
これで漸く、「出目が１〜３のサイコロをひとつ振り、結果をaaに記録する」が達成されました。
サイコロの出目に合わせて自分の見た目を変更する（11行目） †
ああ、ランダム部分長かった。残すは一行のみ。あと一息ですよこやすさん。
11行目の命令は次のようになっています。
this.gotoAndStop(aa);
どこかで見たようなASですよね？そう、先に解説した21行目とほぼ同じ内容なんです。
違いは、前回が（1）として「１コマ目の見た目に変化させる」だったのに対し、今度は（aa）となって変数aaの示したコマの見た目に変化させている事です。
aaには１〜３の整数、ランダムさいころを振って出た目が記録されていますよね。
はい、解説にすると凄く長かったですが９・11行目合わせて「サイコロの出目にあわせて見た目を変化させる」効果の完成です。
まとめその２ †
解説文は長いですが、AS自体はほんの数行のシンプルなものです。
何度か作っているうちに慣れちゃうレベルなので大丈夫。
ではここまでのASがどういうものか、改めて纏めますね。
「このスプライトがステージに配置されている間、これは毎ターン右に８移動する。
ただし、表示範囲外にはみ出した時にこれはステージ左端に戻され、サイコロの目に従い見た目が変化する。」
こういう感じですね。
全体まとめ †
「このスプライトがステージに登場した時、これの見た目は１コマ目の「そんなに」になる。」
「このスプライトがステージに配置されている間、これは毎ターン右に８移動する。
ただし、表示範囲外にはみ出した時にこれはステージ左端に戻され、サイコロの目に従い見た目が変化する。」
ASによって、このような効果を持ったスプライトが完成しました。
「文字移動_2」にもほぼ同じ内容のASが記述されています。
相違点は21行目、初期の見た目設定が違っている事です。
ASではありませんがもう一点、文字移動の１と２は初期の_x値をずらして設定し、
均等に画面に小道具が登場するように調節しています。
さて、これでサンプルASの解説はおしまいです。
ここまで読んでくださったこやすさんありがとう、お疲れ様でした。
楽しげなFlash作品が出来たら是非見せて下さいね。
一応コメント欄 †
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")