| Name |
海外一人FLASH
|
| Date |
2005年03月26日 (土) 00時49分 |
| Message |
憲ちゃん師匠、お久しぶりです。
初めてメールさせていただいてから、1ヶ月弱。。
本当はもっとFLASHにのめりこんでからActionScriptの質問をしようと
思っていたのですが、放物線を書いて！と言われて自分なりに作って
いたところ、質問が二つでてきました。flaのアップロード方法が
わからないので、すみません、今回は文章で質問させていただきま
す。わかりにくくてすみません。
１．以前教えていただいた直線描画をもとに、曲線がかけないかと、
MovieClip.curveToというのを使用しようとしましたが、どうしても
書き方がわからず変な曲線になってしまったので、素直に方程式に
代入して直線を結んでいったら、放物線っぽくなりました。これで
いいのでしょうか？
// v_kataは、画面上で入力している傾きです。-3,-2,-1,0,1,2,3
から選べるようになっています。スライダー使用
on (Press) {
lineMC = this.createEmptyMovieClip("line", 1);
//中点の座標x0，y0、一目盛はa
x0 = 340;
y0 = 220;
a = 20;
//描画のクリア
lineMC.clear();
//線の太さ、色、アルファ値
lineMC.lineStyle(1, 0x006666, 100);
//描画の開始点
lineMC.moveTo(x0, y0);
//指定座標まで直線を引く(xが正の部分、グラフが大きくな
いので一応30まで（正確に言うとxを0.1ごとに3.0まで）に
対応するyを求めて線をつなげています。それにbreakは
グラフからはみださないようにしているだけなので、無視
してください。）
for (i=1; i<=30; i++){
if ( v_kata*i*i/100 > 5 || v_kata*i*i/100 < -5) {
break;
}
lineMC.lineTo(x0+v_kata*a*i/10, y0-ata*a*i*i/100);
}
//描画の開始点（今度はxが負の部分）
lineMC.moveTo(x0, y0);
//指定座標まで直線を引く
for (i=1; i<=30; i++){
if ( v_kata*i*i/100 > 5 || v_kata*i*i/100 < -5) {
break;
}
lineMC.lineTo(x0-v_kata*a*i/10, y0-v_kata*a*i*i/100);
}
}
2.以上は、傾きを選んでボタンをクリックすることによって描画は
うまくいったのですが、ボタンを押さなくても動的に傾きを変化
させるに従って(スライダーを使用して、とりあえず1.0ずつ変化
させました。）放物線も動的に動く（開いたりしぼんだり）ように
描画したかったのです。そこでグラフ自体をムービークリップに
してonClipEvent (enterFrame) {として記述すると、うまくいきま
せん。いい方法があるでしょうか？
よろしくお願いいたします。 |
Response
01
|
| 2005年03月26日
(土) 02時57分＞ 憲ちゃん
|
|
こんばんわ、海外一人FLASHさん♪
また急に難しそうなスクリプトに挑戦されてびっくりします（笑）
これを解読するの大変ですので、憲ちゃんなりに放物線を描くとすれば・・・
中学校で習った放物線の方程式「Ｙ＝ａＸ2」を素直に使います(^^;
parabola0.fla ※MX仕様
まず「描画用MC」の基準点となる「基準点MC（インスタンス名：”mc”）」を枠中央に配置し、
それに以下の描画用スクリプトをクリップアクションで記載。
onClipEvent (load) { 最初に
this.createEmptyMovieClip("parabola", 1)；←”parabora”という名前の描画用MCを生成
function paraDrow(a) { 変数aを引数とする”paraDrow”という放物線メソッドを以下に定義
parabola.clear()；←まず描画を消して
parabola.lineStyle(2,0x00FF00)；←線の太さと色を設定
begin = true；←”moveTo”を実行するためのスイッチ用変数beginを「真」に設定
for (X = -300; X <= 300; X++) { 基準点MCの原点から左右300pxのX幅だけ以下を実行
Y = a * X*X；←変数Yに放物線方程式を適用
if (Y > -300 && Y < 300) { ※枠から大きくはみ出る部分は描画しない
if (begin) { 変数geginが「真」なら（線の引き始め）
parabola.moveTo(X,Y)；←最初の座標を描画開始位置に設定
begin = false；←再びここに来ないよう変数beginを「偽」に設定
} else { そうでない（線の引き始めでない）なら
parabola.lineTo(X,Y)；←以降連続して線を引く
}
}
}
}
paraDrow(0)；←まず”開度0”で上記paraDrow()メソッドを実行して初期の線を引く
}
onClipEvent (mouseMove) { マウスがムービー上で動くたびに（※「enterFrame」でも構わない）
paraDrow(value)；←変数valueを引数とする上記paraDrow()メソッドを実行
}
※XYの有効座標値の「-300〜300」は、角度45度の場合の対角線pxに適当に値を代入したもの。
小さすぎると、枠に中で尻切れトンボになりますし、限度を設けない場合、
計算不能領域に入り、よきしない線が表示されます。
としておいて・・・
ここの引数valueの値を、スライダーから指定できるようにします。
「スライダー開度」MCの中には、ドラッグ用ボタンを包み込んだ「つまみMC」が入っています。
「つまみMC」ドラッグの範囲は、「スライダー開度」MCの座標で、「-90〜90」としています。
その「つまみMC」のクリップアクションで・・・
onClipEvent (mouseMove) {
_root.mc.value = this._y*Math.abs(this._y)/10000；←”mc”の変数valueに開度※を代入
updateAfterEvent()；←ドラッグボタンがスムーズな動きになるようにする”おまじない”
if (this._y > -5 && this._y < 5 && zero) { つまみが中央付近でピタッと吸着させる処理
this._y = 0;
}
}
※「/10000」は調整値。バランスを図るために適当に値を設定してください。
そして、ここは「this._y/調整値」だけで構いません！！
サンプルでは、バランスの問題で値が小さいときと大きいときとで、グラフでの開き度合いが異なり、
できるだけ等間隔で開きたかったため、this._yの２乗の値として調整しています。
そして一方を絶対値「Math.abs()」にしたのは値の正負を反映したかったためです。
ややこしい表現ですが、よ〜く考えていただければご理解いただけるかと思います。
それ以降の「updateAfterEvent()」及び「if文」はこれも付録です。
記載しなくても特に支障はなく、目的はスマートに表現したかっただけです（笑）
もうひとつの「スライダー回転」MCは、「基準点MC」自体をスライダーと連動して、
「_rotation」で回転させてみました♪
本題ではありませんので、これも具体的な内容はflaファイルを分析してください(^^g/~~
|
|
Response
02
|
| 2005年03月26日
(土) 08時52分＞ 海外一人FLASH
|
|
憲ちゃん師匠
さすがプロのグラフ、美しい動きに溜息がでました。本当にありが
とうございます。今、復活祭で１週間休みのうちの課題だったので、
これから師匠のソースを解析します。そうか、マウスの動きに連動さ
せればいいのかあ。。
こっちは順序だててFLASHの構造からﾏｽﾀｰしたいのに、敵（？）はすぐ
ActionScriptの技で挑戦仕掛けてくるので前途多難です。あとは、私
にはセンスがないので見た目が素人っぽいところ（素人なのですが）
も悩みの種です。
が、初心者の分際なので師匠のページをみながら精進します。
ちなみにActionScript講座の球の回転はまだ制覇していません。
Functionやクラスも、まだぴんときません。さて、がんばるぞ！
ありがとうございました。
|
|
Response
03
|
| 2005年03月27日
(日) 23時38分＞ 山口 |
|
突然横入りをして申し訳ありません。
はじめまして私、愛知県のとある高校の教師をしております。
かねてよりFLASHを教材に使えないかといろいろ参考図書を購入し、またFLASH関係のサイトを訪れては自分なりに研究してはおりますが、なかなか思うようなことができずに困り果てておりましたところ、偶然にもこの記事を拝見させていただいて、まさにこれだ！と感じ入りました。
管理人様のシンプルな構成と素人にも分かりやすいご説明を拝見し、これなら私でもできると思い、実はこのサンプルを活用させていただいて「正弦波」を表現しようと試みました。
が、角度からY座標を求める、Y＝sinθ の式にX座標を、ここの放物線を応用するとしてどのように組み込めばよいかどうしても分かりません（涙）
お忙しいとは思いますが、よければご教示いただければありがたく存じます。
よろしくお願いします。
|
|
Response
04
|
|
Response
05
|
| 2005年03月30日
(水) 01時16分＞ 海外一人FLASH
|
|
憲ちゃん師匠
久しぶり（２日ぶり）に見たらまたまた高度な技がでていて
びっくりしました。これも参考にさせていただけそうです。。
ところで放物線の描画の教えていただいたスクリプトの中で
一つ質問があります。
===================================
onClipEvent (mouseMove) {
_root.mc.value = this._y*Math.abs(this._y)/10000；←”mc”の変数valueに開度※を代入
updateAfterEvent()；←ドラッグボタンがスムーズな動きになるようにする”おまじない”
if (this._y > -5 && this._y < 5 && zero) { つまみが中央付近でピタッと吸着させる処理
this._y = 0;
}
}
※「/10000」は調整値。バランスを図るために適当に値を設定してください。
そして、ここは「this._y/調整値」だけで構いません！！
===============================
というご説明をいただいたのですが、この調整値の10000の意味
がわかりません。座標の単位と実際のグラフのドットの割合か
何かでしょうか？
例えばa=1の時、X=1ならY=1になるように調整してみたところ
（9000でうまく行きました）この放物線はうまくいきました。
でも次にY=aX2＋bXを同じように作成しようとしたときに、やはり
この調整値の意味がわからないとうまく描けないようなので。。。
（ちなみにY=aX2+bを同じように作成してみたところ、おかげさまで
うまくいきました！）
ご伝授、よろしくお願いいたします！！
|
|
Response
06
|
| 2005年03月30日
(水) 03時09分＞ 憲ちゃん
|
|
「Y=aX2」をそのままムービー画面の１px単位の座標に適用すると非常に縦長の放物線になります（笑）
調整値の目的は、この単位の幅を調整して、描画を体裁よく画面に納めるためのものです。
10000がよいのか9000がよいのかそれは値を設定してから実際に目で見て確認しないと分かりません。
いろいろな数値を設定しては何度も確認しながら調整します。”勘”の数値化です。
世の中には理屈ではなく、”感性”を伴った経験則とか経験値という漠然としたものが存在します！
よく、なんとか白書とかいう分厚い書物に・・・
前置きがあって、統計や理屈を一杯並べて、その数式の最後に「×0.8」とか訳の分からない数字が
書かれてあるのをご覧になったことがあると思います。
この根拠は何？と尋ねると…大抵その著者や組織の自信の度合いだったりする（笑）
それとは少し違いますが、似たようなものです(*^-^*
「Y＝aX2+b」の「b」はそのままY軸方向に平行移動することですから・・・
「基準MC」を回転させたように、「基準MC」を上下移動させることで代用することもできます。
柔軟に考えてください(*^.^*)
|
|
Response
07
|
| 2005年03月30日
(水) 04時42分＞ 海外一人FLASH
|
|
憲ちゃん師匠
なるほど、安心しました。
私は実はあまりに柔軟すぎて、勘で9000くらいにしたら
ぴったりいったので、隠された何かがあるのか、心配に
なったのでした。（以外と血液型Aなので。。。）
では、またまた次なる図形へチャレンジします！
それにしても今は日本は早朝のはず・・師匠はいつ
眠るのだろうか、、、安眠を妨げると新たなアイデアが
沸いてこないはずなので、しばし自分の頭の中で格闘
することにします。ありがとうございました。
|
|
