あなたのことを教えてください

ムービークリッププロパティ


AS講座第08回です。
今回は、第07回に比べると、やや簡単かもしれません。
しかも、ダン☆おにのどこに使われているのか、
簡単に想像がつきますしね。
今回のテーマは「ムービークリッププロパティ」。
名前だけ聞くと難しそうですが、
実はASを使わない時でもなじみが深いものだったりします。

では、今回もまずソースダウンロードをお願いします。

今回使うソースをダウンロード



さて、ではムービークリッププロパティとはなんぞや、
というお話からしたいと思います。

みなさん、pflをいじっていて、
ある絵をそのSWFの左下に置こうと思ったとき、
どのようにしますか？

まずはその絵のデータを左ペインにおきます。
そうですね。左ペインに読み込まないと何も始まりません。
では次は？

イベントに追加、で右ペインの入れたいところに追加、でしょう。
そうですね。右ペインに追加しなければ表示されませんからね。
では次は？

Y座標を正しいものに変更、ですか。
そうですね、SWFの高さから絵の縦幅を引き算した数字を
Y座標にすれば、左下の角がそろいます。
では次は？

･･･。

･･････。

あ、終わりですね、そうですね。

え？これが今回の話に何の関係があるのか、ですって？
いやいや、今あなたはムービークリッププロパティにかかわったじゃないですか。
ほら、3つめの作業で、Y座標変更しましたよね。
ムービークリッププロパティというのは、このY座標のように、
MCがどのような状態で置かれているのかを表す情報のことです。

例えばそのうち1つが、今いじった座標です。
いや、1つじゃなく2つありますね。X座標とY座標。
ASでこのMCのX座標を知りたいときには、
MCのパス._x
と書きます。
アンダーバーをxの前につけるのを忘れないでくださいね。
同様に、Y座標は
MCのパス._y
と書けばいいのです。
例を見てみましょう。
08_00.pflを開いてみましょう。
おにぎりがポツンと置いてあるMCの他に、テキストが1つ、
そしてなにやら長く1行書かれたスクリプト。




まず、_root.onigiripropertyは、ちょっと長くなってしまいましたが変数名。
そこに代入するのは、まずx=という文字列があって、
その次は今やった、おにぎりのX座標を読み取るASですね。
おそらくこのまま実行すれば100という値が出てくるでしょう。
そして、カンマとy=という文字列に次いで、最後におにぎりのY座標。
ということは、_root.onigiripropertyには、
"x=100,y=100"というのが代入されるにちがいありません。
では、プレビューしてみましょう。

おにぎりが真ん中にあります。
このSWFは横280、縦250で、おにぎりが横80、縦50ですから、
X=100、Y=100においたということは確かに真ん中です。
そして、右下の_root.onigiripropertyの中身を表示するテキストには
x=100,y=100という文字列。

どうやら、ちゃんとX座標が100、Y座標が100と読み取れたようです。

おにぎりの位置をずらして、再度プレビューしてみましょう。
ちゃんとその座標が出ましたか？
できたらさらに移動。また移動。
満足したら、おにぎりの座標を100,100に戻しておいてください。

なーんだ、これ簡単じゃん、と思ったかもしれませんが、
実はこれ、ちょっと注意しなければなりません。

いや、注意はちょっとでも、ややこしさはかなりのものです。
よーく注意して聞いてください。

まず、08_00.plfをプレビューしてください。
今100,100に戻したこの状態を覚えておいてください。
次に、08_01.pflを開いてプレビューしてみましょう。
さっきと同じSWFですね。
おにぎりがある位置もかわりませんね。
見た目の位置も、右下に表示されてるX座標やY座標も同じですね。
いいですね、確認しましたね。

では、08_01.pflのソースを見てみましょう。
おかしなことに気づいたでしょうか。




そう、このソース、おにぎりが置いてある位置は、X=140、Y=125なのです。
おにぎりのプロパティを見ればわかるかと思いますが、

このおにぎりは、画像の中心をSWFの中心に置くという方法で
SWFのまんなかに置かれたSWFなのです。
ですが、ムービークリッププロパティでは、位置はX=100、Y=100。
不思議なこともあるもんですね。
･･･ではなくて。
この2つの100という数字はどこから出てきた数字なのでしょうか。
察しのいい方はもうお分かりでしょう。
もちろん、この100,100という数字はさっきも表示した、画像の左上の座標です。
そう、ムービークリッププロパティのX座標とY座標は、
pflで表示されている座標と同じものではありません。
がんばって言うなら、ムービークリッププロパティの座標は、
そのMCの0,0の座標ってことになるでしょうか。


でも、おにぎりを中心においた時に、
もしx=140,y=125と表示させたい時があったら、
一体どうすればいいのでしょうか。

やり方は2通りあります。
08_02.pflと08_03.pflがその2つのやり方です。
どちらもちゃんと140,125に置かれたおにぎりが
SWF中央にあり、かつx=140,y=125と表示されています。
どういうやり方をしているのか、しばらくpflのあっちこっちを見てみましょう。








どうやってるか、おわかりになったでしょうか？
08_02.pflは、MCの基準位置をいじっています。
ただ、08_01.pflとは違い、左ペインで中央位置の設定をしています。
右ペインでいじる場合と違い、左ペインでいじった場合は、
中心位置がムービークリッププロパティにちゃんと反映されます。
ただし、そのMCが他の箇所でも使われている場合、
左ペインの設定をいじると全ての箇所の配置がずれたりしますので注意。
今はこの方法が何のメリットがあるかわからないと思いますが、
後で回転を扱うときに非常に重宝します。

08_03.pflは、今度はMC内のおにぎりの位置を変えています。
MCの左上が表示されるなら、おにぎりの中心をMCの左上にしてしまえ、
という発想ですね。
余談ですが、08_02.pflも、たぶんParaFla!の内部では
08_03.pflと同じようにみなされてると思います。
08_02.pflのようなやり方だと混乱する人は、
こっちのやり方のほうがいいかもしれません。
MC作る時右下しか見えませんけど。








さて、これが何がうれしいかって？
まあ、座標見れただけではうれしくもなんともないですよね。
じゃあ、何がうれしいか。
なんとこのムービークリッププロパティ、
値を変えることもできるんです。
タイトルは、「あなたのことを教えてください」になってますが、
「あなたは私の言うとおりにしてください」もできるわけですね。
実際、ダン☆おにの矢印は、毎フレーム_yを減らされることで
上へと移動してるわけですね。

例を見てみましょう。
08_04.pflを開いてください。
こんなSWFです。
SWFの境界を分かりやすくするために、こっちは背景がグレーですけど。
矢印キーの左右を押してみてください。
（動かない場合は一度SWFをクリックしてアクティブにしてください。）





この移動は、ASで制御しています。
つまり、ASでムービークリッププロパティを書き換えて
おにぎりを移動させています。
ソースはこんな感じ。




onイベントハンドラのkeyPressはこの講座では久々の登場ですが、
もう忘れたという方は復習してきてくださいね。
というか、本音は忘れないでほしいところですが。

ASを見てみましょう。
左キーを押したら、_xを20減らすということは、
これはMCを20左へ移動しろ、という命令です。
右キーは逆に_xを20増やすわけですから、
MCを20右へ動かすわけですね。

ただ、このままだと画面外どこまでもいっちゃって困ります。
これならまだどっちいったかだけわかれば戻ってこれるでしょうが･･･？








Training


上下キーで、おにぎりが上下にも移動できるようにしてみましょう。
移動幅は左右と同じ20で。

また、おにぎりが本格的に迷子になる可能性があるので、
スペースキーでもとの位置にもどってくるようにしておきましょう。
ムービークリッププロパティは、当然+=や-=だけじゃなく、
=で普通に値を代入することもできますからね。









今回は短めなので、もうほとんど折り返しです。

次は回転を扱ってみましょう。
回転のムービークリッププロパティは、_rotationです。
+が時計回りで、-が反時計回りです。
数学の極座標とは逆回転なので注意してください。
では、いきなりTrainingを。








Training


08_05.pflをひらいてください。
右矢印が、250×250のSWFのド真ん中においてありますね。
で、矢印キーのonイベントハンドラの枠だけ書いてあります。
矢印キーを押した時、矢印がそのキーの方向を向くようにしてください。









まぁ、簡単ですよね。
_rotationを0だの90だのを代入するだけですもんね。








今、うん、ってうなずいた方、Training飛ばしてるでしょ？
結局力がつかなくて、自分の思い込みでスクリプト組んで、
単純なところでミスして、他人に助けを求めることになるんですよね。
この講座は、Trainingは無意味につけてるわけじゃありません。
たまに自分での発見を促す問題や、
よくあるうっかりミスを体験させる問題も混ざってるので、
力をつけたければTrainingはちゃんとやってくださいね。

で、やった方は、「あれ？」と思ったと思います。
矢印がなぜか移動してしまう･･･？

原因に心当たりがあった方、すばらしいです。
原因に心当たりがない方、ASがはじめてなら仕方がないでしょう。
けっこうASいじったことあるのに心当たりがなかった人は
1から鍛えなおしてください。

座標のムービークリッププロパティのところで注意したことを思い出してください。
ムービークリッププロパティでは、右ペインでどこを基準にしていようと、
左上（正確には左ペインで指定したところ）が基準になるんでした。
だから、_rotationをいじったときも、左上が基準になるのです。
そりゃずれるわけですね。

じゃあどうするか。

キーを押した時に一緒に座標もいじれば･･･！
というのは、頭の悪い考えです。
いや、ASはじめてやる人なら、この発想が出てくるだけでも立派ですが、
もっといい方法があるので、ぜひそっちで修正しましょう、という意味で。

再び、座標のムービークリッププロパティのところで注意したことを思い出してください。
もし、座標のムービークリッププロパティで、ちゃんと画像中央の座標を見たい場合は、
ということで、2つほどやりかたを紹介したのを覚えてますか？。
その時に、「あとで回転やるときに重宝する」とも言ったと思います。
記憶にない人は最初に戻ってやり直し。

この2つのどっちかの方法を使えば、ムービークリッププロパティの基準点を、
矢印の中心にできます。
では、どちらでもやりやすい方でかまわないので、早速やってみてください。
あ、矢印が中心からずれると思うので、それもずらしてくださいね。








Training


では、上のをさらに改造して、こんな感じにしてみましょう。
矢印キーで、向きが変わると同時にそっちに20移動します。
SWFの範囲が分かりやすいように、背景をグレーにしていますが、
作るのは黒背景でかまいませんよ。
できれば矢印が画面外に出ないような工夫もしてください。






けっこうめんどくさいASになりますが、もう第08回なので、
できれば自力で頑張って欲しいところです。
ちなみに解答例は08_06.pflとしてつけておきますが、
自力で作るまで見ちゃだめですからね。
ちゃんとこれまでの内容でできますので、がんばってください。







以上、AS講座第08回でした。
次回で初級編も終わりです。
しかし、まだ1回初級が残っているとはいえ、
ダン☆おにのソースを今見てみたら、
意外と初級の内容でほとんどが構成されていることに驚くと思います。
あと残る初級の内容はonClipEventハンドラです。
onイベントハンドラの親戚なので、onイベントハンドラに自信がない人は、
次に進む前に一度復習しておくことをおすすめします。








PlusOne：その他のムービークリッププロパティ


よく使うムービークリッププロパティはせいぜいこの3つなので、
講座の本体ではそれ以外には触れませんでしたが、
一応見かけることもなくはないムービークリッププロパティを紹介します。

まず、_alpha。不透明度ですね。
0だと完全に透明、100で完全に不透明。
50とかだと半分後ろが透けます。
ちなみに、0と100の間の値になっていると、
かなり処理が重くなるので注意が必要です。

次、_xscale。
横幅の拡大倍率です。
0で横に完全につぶれ、100で普通どおり。
50なら横幅が半分に圧縮され、200なら横幅が倍に拡大されます。
拡大縮小の中心は、回転とかと同じくMCの左上または左ペインで指定した点。
_xscaleがあるということは、当然_yscaleもあります。
詳細は同様。

次、_currentFrame。
現在のMCが表示しているフレーム数です。
ちなみに、こいつは今まででてきたムービークリッププロパティと違い、
読み取り専用、つまり書き換えることができません。
正確には、書き換えるには違う方法を使わなければなりません。
そう、gotoAndStop()とか、gotoAndPlay()ですね。
ちなみに、ダン☆おにでは、_root._currentFrameを
毎フレーム各譜面データに書いてあるフレーム数と照らし合わせて、
矢印を生成したりスピード変化したりストップしたりしています。

最後に、ダン☆おにでこれを使ってる作品は片手で足りるほどしか知りませんが、
うまく使うと非常におもしろいムービークリッププロパティがあります。
それは、_xmouseと_ymouse。
そのMCのどこにマウスがあるかというムービークリッププロパティで、
普通は_rootに対してしか使いません。
で、何が面白いかというと、こんなことができます。
下のSWFにマウスを合わせても何も起きない場合は1回クリック。




ソースは08_07.pfl。
一行目だけは次回の内容なので分からないと思いますが、
{ }の中を毎フレーム実行するASです。
2行目は、近すぎる時はふらふらすることもあるので、
ある程度の距離があるときしか実行しないようにするためのif文。
距離は三平方の定理で計算。
Math.atan2()は前回のMathクラスの説明ででてきたのでそちらをどうぞ。




戻る　　　掲示板へ