| Name |
みきお
|
| Date |
2004年07月10日 (土) 07時17分 |
| Message |
はじめまして、こんにちは。
こちらで色々と勉強させて頂いていまる「みきお」というものです。
宜しく願いします。
「スクロールフィールドのつまみと上下のボタンの連動」を参考に「左右」にし
「吸着」機能をもたせたものの、左右ボタンとの連動で行き詰まってしまいました。
下のswfを見ていただければわかると思いますが、左右にドラックができ
「1」「2」「3」「4」「5」の中心に吸着するようになっています。
で、私がわからないことは・・・
右端の「5」にある場合、左ボタンを押すと「4→3→2→1」の順番に移動。
左端の「1」にある場合、左ボタンを押すと「2→3→4→5」の順番に移動。
・・・っとしたいのですが、なかなかうまくいかず・・・。
わかりずらい文書で、申し訳ありませんが、宜しく願い致します。
Flash５/win98で作成。(flaもアップした方が良いですか？) |
Response
01
|
| 2004年07月10日
(土) 23時19分＞ 憲ちゃん
|
|
みきおさん、はじめまして(*^.^*)
ドラッグで、別のMCを移動させる方法はいろいろやり方があるので、
flaファイルがあると構造がわかって、あと説明しやすいのですが・・・
slider10.fla
とりあえず憲ちゃんは、以下のような構造で上記サンプルを作ってみました。
まず、シーン編集画面（_root）では、
上段の大きいMC（中身は５つの図形等）と「ゲージMC（インスタンス名：gauge）」を配置。
そのゲージMCの中は・・・
ターゲット（吸着の的）となる５つの「的MC」、
その上をドラッグ移動する「ドラッグMC（インスタンス名：btn）」と
今回ご質問の「左右ボタン」を配置しています。
右端の「的MC①」及び「ドラッグMC」の各基準点は、この「ゲージMC」の基準点に配置（X=0）。
「的MC②～⑤」は、－３０pxずつ等間隔に左に配置しています。
つまり、「的MC」の各座標は、右から左に「0,-30,-60,-90,-120」となります。
ドラッグMCの中は・・・
「ドラッグボタン」と
「ドラッグMC（btn）」の中心線である「ゲージ線MC（インスタンス名：line）」があります。
この「ドラッグMC」は「ゲージMC」の中を「的MC」の右端から左端に水平移動すればよいので、
「ドラッグボタン」のボタンアクションは・・・
on (press) {
this.startDrag(false,0,0,-120,0); 水平に０～－１２０の範囲
}
on (release, dragOut) {
this.stopDrag();
}
「ドラッグMC」を「的MC」に吸着させるための衝突判定は、どちらからでもできますが・・
サンプルはそれぞれの「的MC」から、中心線の「line」に衝突しているかどうかを判定しています。
そこで「ゲージMC」の中の各「的MC」に・・・
onClipEvent (mouseUp) { 押し込まれたマウスボタンが離れた瞬間
if (this.hitTest(_parent.btn.line)) { 「ドラッグMC」の中の「line：線」と衝突なら
_parent.btn._x = this._x; 「ドラッグMC」を自分のX座標に移動
}
}
※「ドラッグボタン」をドラッグして、離す「release」することは、MCのイベントでは「mouseUP」
そして、シーン（_root）にある、上段「MC」の位置は、常時（フレームレートごとに）
この「ゲージMC」の中の「ドラッグMC」のX座標と連動して、自分のX座標を決めますから、
onClipEvent (enterFrame) {
this._x = -(_root.gauge.btn._x * 3)+430; ←※サンプルの場合の関係式
}
関係式は、「MC」の大きさや動かす方向によって異なってきます。
以上が、ドラッグボタンと上段図形との移動・吸着の、サンプルのしくみです。
「左右ボタン」は、クリックするたびに「的MC」の間隔だけ「ドラッグMC（btn）」を移動すれば
よいのですから・・・そのボタンアクションは
左ボタン
on (release) {
if (btn._x > -120) { 「ドラッグMC」が左端(X=-120)に寄っていないなら
btn._x -= 30; ←「ドラッグMC」を30px左に移動
}
}
右ボタン
on (release) {
if (btn._x < 0) { 「ドラッグMC」が右端(X=0)に寄っていないなら
btn._x += 30; ←「ドラッグMC」を30px右に移動
}
}
「ドラッグボタン」の最初の位置を右端にすると、マイナス方向への移動になるので、
式を考えるとき、プラスマイナスがややこしいですね（笑）
|
|
Response
02
|
| 2004年07月11日
(日) 06時43分＞ みきお
|
|
憲ちゃんさん、お答え頂き有難う御座います。
やはりflaがあった方がよかったのですね・・・すみません。
遅いかもしれませんが、アップしましたので覗いて見てください。
そのfla
早速、おしえて頂いた方法を研究してみます。
研究がまとまり次第、報告しますね。
あと、私の勘違いでしたら良いのですがアップして頂いた「slider10.fla」なんですが、Flash５では開けませんでした。
なんでだろう？
|
|
Response
03
|
| 2004年07月11日
(日) 10時32分＞ 憲ちゃん
|
|
すみません、flaファイルをFLASH６のまま保存していましたm(_
_)m(^^;
「５」で保存しなおしてアップしましたので、今度は大丈夫です♪
flaファイル拝見しました。
憲ちゃんのサンプルのように、大きな「MC」以外の主な部品を「ゲージMC」の中に
まとめるかどうかの違いだけで、基本的には同じでしたね♪
したがって、左右ボタンのアクションも同じように考えます。
大きな「MC」は、自らの位置を「スライド」の位置によって自動的に決めているので、
「左右ボタン」がコントロールするのも、「スライド」の位置でよいわけです。
みさおさんのサンプルでいえば・・・
左ボタン
on (release) {
if (slide._x > 123) { 左端の判定mcのX座標(X=123)より右にあるときだけ
slide._x -= 63; 判定mcの間隔(63px)分、「スライド」を左へ移動
}
}
右ボタン
on (release) {
if (slide._x < 375) { 右端の判定mcのX座標(X=375)より左にあるときだけ
slide._x += 63; 判定mcの間隔(63px)分、「スライド」を右へ移動
}
}
動かす関連部品をまとめて、ムービークリップにすることと、
それぞれをシーンに配置することの違いは・・・別のムービークリップにまとめることで、
座標計算が楽、というか扱いが簡単になります。
動かす部品の各座標は、それをくるんだMCの基準点ですから、
仮にそのMC（憲ちゃんのサンプルでは「ゲージMC」）ごと、
シーン編集画面のどこに配置しても関係式に変化がない、
つまりボタンやスライダーをあとで位置を移動しても問題ないということです(*^.^*)
|
|
Response
04
|
| 2004年07月12日
(月) 19時57分＞ みきお
|
|
早速、作ってみました。
>動かす関連部品をまとめて、ムービークリップにすることと、
>それぞれをシーンに配置することの違いは・・・別のムービークリップにまとめることで、
>座標計算が楽、というか扱いが簡単になります。
確かにムービークリップでまとめてステージに配置した方が楽ですね＼(^o^)／
本当に有難う御座いました。
んで、しばらく弄くっていたら「スライド移動にスムーズさを！」っという
欲にかられ作ってみましたが、・・・うまくきません。
もう少し、試作してみますが、出来ましたらヒントを頂けないでしょうか？
宜しくお願い致します。
そのswf
そのfla
|
|
Response
05
|
| 2004年07月13日
(火) 10時12分＞ 憲ちゃん
|
|
”slider”MCに、「目標値接近の方程式」を適用して・・・
onClipEvent (enterFrame) {
this._x = (this._x + X)/2；
}
変数X がこれから向かう目標値ということで、左右ボタンでその値を代入。
したがって、左右ボタンをクリックするとスムーズに目標位置に向かい成功ということですね♪
ところが”slider”をドラッグしても元の番号の枠から移動してくれない？（笑）
それは・・・
目標値の変数X が左右ボタンからしか変更できないことが理由のひとつ！
ドラッグして吸着させるときの座標は各”的mc”で行っていますので、そこのところでも
onClipEvent (mouseUp) {
if (this.hitTest(_parent.slider.line)) {
_parent.slider.X = this._x;
}
}
該当の”的mc”のX座標を、直接”slider”のX座標”_parent.slider._x”に代入するのではなく、
このように、目標値である変数X に代入しなければいけません。
さらに、ドラッグボタンをドラッグしているあいだも常に”slider”MCに記載した、
「目標値接近の方程式」が働き続け、その時の目標値に向かって戻ろうとしますので、
元の番号枠から出られません(^^)
そこで・・・
ドラッグを行っている間は「目標値接近の方程式」が働かないようにする工夫が必要です。
例えば、”slider”MCに変数sw（スイッチのつもり）というのを新しく設けて・・・
onClipEvent (load) { ”slider”MCが読み込まれた最初に
sw = 0; ←変数sw を定義して「0」を代入
}
onClipEvent (enterFrame) { フレームレートごとに以下を繰り返す
if (sw == 0) { 変数sw が「０」のときだけ
this._x = (this._x + X)/2; ←「目標値接近の方程式」を稼動
}
}
とし・・
ドラッグボタンのボタンアクションで・・・
on (press) { マウスボタンが押し込まれたら
sw = 1; ←変数sw に「１」を代入して（上記「目標値接近の方程式」を無効にして）
this.startDrag(false,0,0,-305,0); ←ドラッグ開始
}
on (release, dragOut) { （押し込まれたボタンが）離れた瞬間又は外に出た瞬間
sw = 0; ←変数sw に「０」を代入して（上記「目標値接近の方程式」を有効にして）
this.stopDrag(); ←ドラッグ停止
}
このようにして、
ドラッグボタンが押し込まれている間だけ「目標値接近の方程式」が働かないようにします(^^g/~~
|
|
