このサイトは、只今WEB業界で活躍中のデザイナー、プログラマーの方々の情報を集めたweb統合情報サイトです。

Archives Details

ActiinScript2.0 縦横移動 ボールを掴んで投げる

ActionScript

2011.11.04

この記事は最終更新日から1年以上が経過しています。

前回の「ActiinScript2.0 縦横移動 ボールを掴む」の続きとなります。

前回ではボールが縦横移動しドラッグでつかむ事ができ、離すとまた縦横移動が開始する。

という内容でした。

でも今のままでは「投げた」という感じがしないので、

これに更に「投げる」というアクションを追加したいと思います。

では、投げたときのスピードや方向の計算式なんですが、どう計算するかというと

ボールを離した時の位置と、その直前の位置を取得することによって求めることができます。

簡単に横方向のみを考えていきたいと思います。

ボールを離した位置をx2とします。その直前の位置をx1とすると、

x方向のスピードはx2-x1で求める事が可能です。

ボールを離したときの位置x2はボールの位置なので安易に求める事が出来ます。が、

その直前の位置は?となりますよね。

結論から言うと、直前の位置x1にx2の値を代入します。スクリプトで記述すると、

ActionScript2.0

x1 = x2;
x2 = this._x;
speedX = (x2-x1);

 

となります。

え?なんで?となりますけど、onClipEvent(enterFrame){〜 内に記述するので

繰り返し計算されている事を考えると、

x1には前回計算した数値が代入され、x2には今の値が代入されます。

3行目のx2-x1でその差分を求めspeedXに代入します。

同様にy座標の計算式を加えると以下のとおりになります。

ActionScript2.0

x1 = x2;
y1 = y2;
x2 = this._x;
y2 = this._y;
speedX = (x2-x1);
speedY = (y2-y1);

 

となります。

この計算はドラッグされているときの計算なので、そのまま、
if(ballHold == 1){ 〜内に記述します。

ActionScript2.0

onClipEvent(enterFrame){
if(ballHold == 1){
x1 = x2;
y1 = y2;
x2 = this._x;
y2 = this._y;
speedX = (x2-x1);
speedY = (y2-y1);
trace(x1);
trace(x2);
}else{
if (this._x>500-this._width/2){
speedX = speedX*-1;
}
if (this._x<0+this._width/2) {
speedX = speedX*-1;
}
if (this._y>400-this._width/2) {
speedY = speedY*-1;
}
if (this._y<0+this._width/2) {
speedY = speedY*-1;
}
this._x += speedX;
this._y += speedY;
}
}

 

これで、それなりに投げている感じがします。

でも、強く投げすぎると枠外に出て戻ってこない。という現象が起きたりします。

回避策として枠外を超えた場合は枠内に強制的に戻る式を加えます。

this._x = 500-this._width/2;

this._x = 0+this._width/2;

this._y = 400-this._width/2;

this._y = 0+this._width/2;

これを付け加えたスクリプトは以下の通りです。

onClipEvent(load){
speedX = 10;
speedY = 8;
ballHold = 0;
}
onClipEvent(enterFrame){
if(ballHold == 1){
x1 = x2;
y1 = y2;
x2 = this._x;
y2 = this._y;
speedX = (x2-x1);
speedY = (y2-y1);
}else{
if (this._x>500-this._width/2){
this._x = 500-this._width/2;
speedX = speedX*-1;
}
if (this._x<0+this._width/2) {
this._x = 0+this._width/2;
speedX = speedX*-1;
}
if (this._y>400-this._width/2) {
this._y = 400-this._width/2;
speedY = speedY*-1;
}
if (this._y<0+this._width/2) {
this._y = 0+this._width/2;
speedY = speedY*-1;
}
this._x += speedX;
this._y += speedY;
}
}
on (press) {
ballHold = 1;
startDrag(this, true);
}
on (release) {
ballHold = 0;
stopDrag();
}

デモページ
デモページはこちらから 

 

最後に、よりボールのアクションに近づけるため、重力、摩擦、跳ね返り係数を付けていきます。

ActiinScript2.0 ボールアクション 重力、摩擦、跳ね返り係数

Comment

Related Article

ActionScript ランダム関数 Math.random() まとめ

2012.04.18

ActionScript トゥイーン制御ライブラリ Tweenerの使い方

2012.04.06

ActionScript ムービークリップからメインタイムラインの関数実行

2012.02.27

ActiinScript2.0 ムービークリップを複製 duplicateMovieClip

2011.11.04

ActiinScript2.0 縦横移動ボールアクション

2011.11.04

ActiinScript2.0 ボールアクション 重力、摩擦、跳ね返り係数

2011.11.04

ActiinScript2.0 縦横移動 ボールを掴んで投げる

2011.11.04

ActiinScript2.0 縦横移動 ボールを掴む

2011.11.04

ActionScript onClipEvent()ハンドラ

2011.11.04

ActionScript2.0 ボール反転

2011.11.03

CATEGORY LIST

LATEST NEWS

汎用 3D mesh/model viewerを求め。と、簡単に、FBXファイルをglTF(glb)に変換ツールを求め。

C++

2024.06.06

M1 Macで、OpenGL GLUTを使ってコンパイルする

C

2024.04.27

Rust - Actix Web mongo ユーザー登録 JWT認証

Rust

2024.03.24

Rust - Actix Web JWT 認証認可 APIの作成

Rust

2024.02.25

Rust - Actix Web × JSON 静的ファイルをAPIで返却

Rust

2024.01.19

Rust - Actix Web × MongoDB環境をサクッと起動

Rust

2024.01.18

5分で学ぶ RustでWave Function Collapse (波動関数崩壊アルゴリズム)

Rust

2024.01.15

LLaMAモデル GGMLフォーマット(llama.cpp)をRustフレームワーク Leptosを用いて M1MacMiniでサクッと動かす。

Rust

2024.01.11

2024年 狙っているモバイルノートPC

tool

2024.01.07

MacOS XcodeにSDL2を追加

tool

2023.12.26

php 7.4にアップデート

PHP

2023.12.24

5分で覚える Flutter Flameで作る Wave Function Collapse - 波動関数崩壊アルゴリズム

AI・Bot・algorithm

2023.12.20

RANKING

Follow

SPONSOR

現在、掲載募集中です。



Links

About Us

WEBデザイナーの、WEBデザイナーによる、WEBデザイナーの為のサイト。「みんなで書こう!」と仲間を募ってみたが、結局書くのは自分だけとなってしまいました。日々のメモを綴っていきます。

Entry Profile

Graphical FrontEnd Engineer
- Daisuke Takayama

MAD CITY 北九州市で生まれ育つ。20代はバンド活動に明け暮れ、ふと「webデザイナーになりたい。」と思い、デジタルハリウッド福岡校入学。卒業後、数々の賞を受賞、web業界をざわつかせる。
現在、主に、ゲーム制作中心に港区六本木界隈で活動中。

FOLLOW US