Tag: ActionScript

コンポーネントを使ったボタン(Button)

実制作では直接使うことはほとんどないと思いますが、応用はできる気がするのでコンポーネントを利用したボタンを作ってみました。

ボタンコンポーネントはウィンドウ→コンポーネント→UserInterface→Buttonをstageまでドラッグし、パラメータでlabelの変更(ここではPhoto01とPhoto02)を行ないます。

それぞれにインスタンス名btn01、btn02をつけ、ASでイベントを設定。今回はswitch文でボタンlabelで条件分岐してます。

stop();

 //イベントリスナ
 btn01.addEventListener(MouseEvent.CLICK,movePhoto);
 btn02.addEventListener(MouseEvent.CLICK,movePhoto);

 function movePhoto(event:MouseEvent):void {

  //ボタンラべルでフレームを移動
  switch (event.currentTarget.label) {

  case "Photo01" :
   gotoAndStop("ph01");
   break;

   case "Photo02" :
   gotoAndStop("ph02");
   break;
  }
}

This movie requires Flash Player 9

マウスに追従するSprite

This movie requires Flash Player 9

円のローカル座標とマウスの位置関係から。

//半径10pxの黒丸を描写
var circle:Sprite = new Sprite();
circle.graphics.beginFill(0x000000);
circle.graphics.drawCircle(15,20,10);
addChild(circle);

var cx:int;
var cy:int;

//マウスの後を追いかける(マウスとローカル座標の距離を詰める)
circle.addEventListener(Event.ENTER_FRAME, moveCircle);

 function moveCircle(event:Event):void {

  cx = circle.mouseX;
  cx = circle.mouseY;

  circle.x += cx/5;
  circle.y += cy/5;
}

addChildでライブラリから呼び出す

ライブラリのムービークリップを右クリックしてプロパティ(リンケージプロパティ)を選択後、任意のクラス名を指定する。

_mcというムービークリップを新しく作り、addChildでステージに配置します。呼び出しはnew + 上記で指定したクラス名。

下の例では配置したムービークリップを左から右へ移動させ、右側に消えると最初の位置に戻るようにしています。

(入れ子でムービークリップ自体もフェードアウトリピート(省略))

//オブジェクトをインスタンス化
var _mc:MovieClip = new Ghost();
addChild(_mc);

//配置位置
_mc.x = -40;
_mc.y = 150;

//インスタンスの移動
_mc.addEventListener(Event.ENTER_FRAME,doSlide);

function doSlide(event:Event) {

  //移動スピード
  _mc.x += 8;

  //右に完全に消えると最初の位置に戻る
  if (_mc.x >= 648) {
    _mc.x = -40;
    }
}

※「648」はインスタンスの横サイズ526pxの半分(128px)にステージのサイズ520pxを加算したもの。(基準点が中心のため)

This movie requires Flash Player 9

カスタムクラスを作る

外部ASファイルとしてクラスを作成して、newで呼び出すことでオブジェクトを生成できる。また元々あるMovieClipクラスなどの機能を継承(extends)して、新たな機能を持つカスタムクラスを作ることも可能。

パーツをそれぞれの下請け工場で作って、本社工場でそれらを組み立てて自動車として完成させるイメージでいいのかな?

書き方としてpackageでまとめて、public記述で外部から参照できるクラス・メソッドを作る。

下の例ではMovieClipクラスを元にmyMovieClipというカスタムクラスを作ることで、flaファイルの方でnew→addChildすると楕円(Ellipse)が描かれます。

▼myMovieClip.as

package {
  import flash.display.MovieClip;

    public class myMovieClip extends MovieClip {

    public function myMovieClip() {

    this.graphics.lineStyle(10,0x000000);
    this.graphics.beginFill(0xcccccc);
    this.graphics.drawEllipse(100,100,300,150);
    }
  }
}

▼.fla

var doImg:myMovieClip = new myMovieClip();
addChild(doImg);

ボタンのロールオーバーをswitch文で書く

ActionScriptでボタンのロールオーバーをするのにいろいろ方法はあると思うんですが、switch文を使ったらどうなるのかやってみたメモ。

ボタンmcに2フレーム用意し、event.typeでマウスイベントの種類で振り分ける感じ。

//URL用変数宣言
var urlGet:URLRequest = new URLRequest("http://www.mops.jp/");

//ボタン
btn_mc.buttonMode = true;

btn_mc.addEventListener(MouseEvent.ROLL_OVER,btnevent);
btn_mc.addEventListener(MouseEvent.ROLL_OUT,btnevent);
btn_mc.addEventListener(MouseEvent.CLICK,btnevent);

function btnevent(event:MouseEvent):void {
  switch (event.type) {

   case MouseEvent.ROLL_OVER :
      btn_mc.alpha = 0.8;
      btn_mc.gotoAndStop(2);
      break;

   case MouseEvent.ROLL_OUT :
      btn_mc.alpha = 1;
      btn_mc.gotoAndStop(1);
      break;

   case MouseEvent.CLICK :
      navigateToURL(urlGet);
      break;

  }
}

btneventだけなので見た目わかりやすい気がします。