ActionScript: 2006年12月アーカイブ

一昨日、コンポーネントの拡大と縮小の説明の際に、拡大と縮小の一定ではない変化を実現するコードを記載しました。
その点についてちょっと詳しい説明です。
別にわたしが思いついたわけではないアイディアなので、わたしが偉そうに説明するものではないですが、応用が色々とききそうな考え方ですのでご紹介です。

たとえば、nowxという変数値が最初100で、それを0に近づけたいとします。
以下のコードはnowxを10ずつ0に近づけていきます。
実際はif文の処理はこのコードではちょうど0で止まるため必要ないです。

//コードここから
var nowx:Number = 100;//変数nowx
var nextx:Number = 0;//nowxの終値
var diffx:Number = 10;//nowxの変化値

//nowxをdiffxずつnextxに近づけるループ
for( ; nowx > nextx ; nowx -= diffx){
if(nowx < nextx)nowx = nextx;//nowxがnextxより小さくなった際にnextxに戻す
}
//コードここまで

前回の拡大縮小のコードでは、一定間隔の変化ではなく、変化値を減らしていきたかったため、以下のようなコードを使用しました。
if文の条件でnxtxに1をプラスしているのは、最後の方の細かい変化はただの負荷にしかならない場合が多いかと思ったからです(細かい変化を求める場合には不要かもしれないですね)。

//コードここから
var nowx:Number = 100;//変数nowx
var nextx:Number = 0;//nowxの終値
var diffx:Number = 2;//nowxの変化分

//nowxとnextxの差を1/diffxずつ狭めるループ
for( ; nowx > nextx ; nowx -= (nowx - nextx) / diffx){
if(nowx < nextx + 1)nowx = nextx;//nowxがnextx+1より小さくなった際にnextxに戻す
}
//コードここまで

上記のコードではnowxが
100
50
25
12.5
6.25
3.125
1.5625
0
というように変化します。nowxとnextxの差が半分ずつ(つまり1/diffxずつ)に縮まっていっているということです。

diffxの値を3にするとnowxの変化が
100
66.6666666666667
44.4444444444444
29.6296296296296
19.7530864197531
13.1687242798354
8.77914951989026
5.8527663465935
3.90184423106234
2.60122948737489
1.73415299158326
1.15610199438884
0
というように緩やかになります。差が1/3ずつになっているからです。

ありがちなのかどうかわからないですが、個人的によく使用するアルゴリズムです。
スクロールを表現するとき、見た目的に自然な減速になるので。

Wikipedia ActionScript
Wikipedia プログラム言語

スクリプトなりプログラムなり、言語経験のある人には誰だって「会心のソース」みたいなものがあると思います。
美しい数式を見たときのような感動を覚える自らの生み出したソースです(過去に他の人がすでに思いついていることがほとんどだとしても)。

わたしはこれまでにいくつかの言語に触れてきました。Basic、VisualBasic、C、C++、Visual C++、Java、HTML、CSS、JavaScript……。
そんな学習の中で心震えたソースについて書いていってみようかななんて思いました。
自己満足が大半だとしても、人の役に立つことがけっこうあるかなとも考えましたので。

このblogにも書きましたが、ことしの夏~秋、MdN出版の「プロとして恥ずかしくないFlashの大原則」の執筆を行いました。全体の9ページではありますが。
自分の書いたソースが人の注目を集める形で世に出るということは、恐くて、でも、同時にすごく嬉しかったです。
その中でコンポーネントの拡大と縮小を取り上げました。
Flashではインスタンスにマウスカーソルが乗ったときにそれを察知するメソッドが用意されていますが、すべてのコンポーネントに対応しているわけではありません(わたしが知る限りはですが、そういう前提でソースを書きました)。
そこで、あらかじめコンポーネントのx座標とy座標を取得して、その位置にマウスカーソルが来たら拡大するというソースを書いてみました。

以下、そのソース(省略版)です。
form1というムービークリップ上にコンポーネントを乗せています。
各コンポーネントはcomp1~comp4というインスタンス名です。


//ソースここから
var compArray:Array = new Array();//コンポーネント格納配列
var compNumber:Number = 4;//コンポーネント数
var bigScale:Number = 150;//コンポーネント拡大時スケール(%)
var mcx:Number = form1._x;//ステージから見たformのx座標
var mcy:Number = form1._y;//ステージから見たformのy座標

//全コンポーネントの配列への格納とx座標y座標の取得
for(var i =1 ; i <= compNumber ; i++){
if(i <= compNumber1) compArray[i] = eval("form1.comp" + i);//配列への格納
compArray[i].nextScale = 100;//通常時は100、拡大時は150
compArray[i].x1 = compArray[i].x + mcx;
compArray[i].x2 = compArray[i].x + mcx + compArray[i].width * bigScale / 100;
compArray[i].y1 = compArray[i].y + mcy;
compArray[i].y2 = compArray[i].y + mcy + compArray[i].height * bigScale / 100;
}

//コンポーネント上にマウスが乗った際の拡大表示
_root.onEnterFrame = function():Void{
for(var i = 1 ; i <= compNumber ; i++){
if(_root._xmouse>compArray[i].x1 && _root._xmouse compArray[i].y1 && _root._ymouse < compArray[i].y2){
compArray[i].nextScale = bigScale;//上にマウスがある場合はnextScaleを150にする
}
else{
compArray[i].nextScale = 100;//上にマウスがない場合はnextScaleを100にする
}
//表示スケールをnextScaleに近づけていく。差を2で割ることによって一定ではない拡大縮小を実現する
compArray[i].scaleX += (compArray[i].nextScale-compArray[i].scaleX) / 2;
compArray[i].scaleY += (compArray[i].nextScale-compArray[i].scaleY) / 2;
}
}
//ソースここまで


ソースは以上です。
自分では良いと思っていても人からすれば欠点だらけのソースかもしれないので、意見等いただけると嬉しいです。

Wikipedia ActionScript
Wikipedia プログラム言語
プロとして恥ずかしくないFlashの大原則 MdN出版該当ページ
プロとして恥ずかしくないFlashの大原則 Amazon該当ページ

1

概要

青春B運営メンバー多口カタンによる雑記blogです。
自己紹介はこちら。開発物をまとめたものはこちら
 
ヘッダーイラストはkojiさん制作です。
感想・意見・要望等ありましたら気軽にフォームにてコンタクトくださいませ。
 
Twitterはじめましたので誰でも気軽に声かけてくださいね。