[AS] ActionScript3.0とおやつの会(その2)
さて、 4/23も参加してきたas3勉強会の第2回。
このブログは裏側でプラグインがコンフリクトしまくりでsyntaxhighlighterが使えなかったのですが、もう面倒くさくなったのでデフォルトテーマに戻しました(笑)
ということで今回からちゃんとasコードも貼ります。
しばらくline-heightまわりとか見苦しいですがどうかご容赦を…
それはさておき4/30のお勉強内容です。ほとんど自分用メモ。
その1 : マウスに追従するオブジェクト
赤丸がマウスの動きにぴったりついてきます。
[as3]
package {
import flash.display.Sprite;
import flash.events.Event;
public class Main extends Sprite {
private var _maru:Sprite;
public function Main() {
_maru = new Sprite();
_maru.graphics.beginFill(0xFF0000);
_maru.graphics.drawCircle(0,0,50);
_maru.graphics.endFill();
_maru.x = stage.stageWidth/2; // ステージの大きさ/2で真ん中に配置
_maru.y = 465/2; // 上に同じく真ん中配置。ステージサイズ決め打ち指定でもOK!!
this.addChild(_maru);
this.addEventListener(Event.ENTER_FRAME,onEnter);
}
private function onEnter(event:Event):void {
_maru.x = mouseX;
_maru.y = mouseY;
}
}
}
[/as3]
その2 : 時間差でマウスに追従するオブジェクト
赤丸が時間差でマウスの動きを追いかけます。
_maru.x = _maru.x*0.8+mouseX*0.2;
_maru.y = _maru.y*0.8+mouseY*0.2;
ってのがミソ
[as3]
package {
import flash.display.Sprite;
import flash.events.Event;
public class Main extends Sprite {
private var _maru:Sprite;
public function Main() {
_maru = new Sprite();
_maru.graphics.beginFill(0xFF0000);
_maru.graphics.drawCircle(0,0,50);
_maru.graphics.endFill();
_maru.x = stage.stageWidth/2; // ステージの大きさ/2で真ん中に配置
_maru.y = 465/2; // 上に同じく真ん中配置。ステージサイズ決め打ち指定でもOK!!
this.addChild(_maru);
this.addEventListener(Event.ENTER_FRAME,onEnter);
}
private function onEnter(event:Event):void {
_maru.x = _maru.x*0.8+mouseX*0.2;
_maru.y = _maru.y*0.8+mouseY*0.2;
}
}
}
[/as3]
その3 : クリックするとマウスに追従するオブジェクト
4行目でMouseEventを設定したうえで
onClickでマウスのX座標とY座標を追いかけるfunctionを生成してます。
[as3]
package {
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
public class Main extends Sprite {
private var _maru:Sprite;
private var _onPositionX:Number;
private var _onPositionY:Number;
public function Main() {
_onPositionX = 100;
_onPositionY = 100;
_maru = new Sprite();
_maru.graphics.beginFill(0xFF0000);
_maru.graphics.drawCircle(0,0,50);
_maru.graphics.endFill();
_maru.x = 100;
_maru.y = 100;
this.addChild(_maru);
this.addEventListener(Event.ENTER_FRAME,onEnter);
stage.addEventListener(MouseEvent.CLICK,onClick);
}
private function onClick(event:MouseEvent):void {
_onPositionX = mouseX;
_onPositionY = mouseY;
}
private function onEnter(event:Event):void {
_maru.x = _maru.x*0.8+_onPositionX*0.2;
_maru.y = _maru.y*0.8+_onPositionY*0.2;
}
}
}
[/as3]
その4 : クリックするとマウスに追従するオブジェクト×2
基本的にその3と同じですが、
赤丸オブジェクトを二つ生成して、
onClickでマウス座標を追いかけるタイミングをちょっとずらしてます
[as3]
package {
import flash.display.Sprite;
import flash.events.Event;
import flash.events.MouseEvent;
public class Main extends Sprite {
private var _maru:Sprite;
private var _maru2:Sprite;
private var _onPositionX:Number;
private var _onPositionY:Number;
public function Main() {
_onPositionX = 100;
_onPositionY = 100;
_maru = new Sprite();
_maru.graphics.beginFill(0xFF0000);
_maru.graphics.drawCircle(0,0,50);
_maru.graphics.endFill();
_maru.x = 100;
_maru.y = 100;
this.addChild(_maru);
_maru2 = new Sprite();
_maru2.graphics.beginFill(0xFF7878);
_maru2.graphics.drawCircle(0,0,36);
_maru2.graphics.endFill();
_maru2.x = 100;
_maru2.y = 100;
this.addChild(_maru2);
this.addEventListener(Event.ENTER_FRAME,onEnter);
stage.addEventListener(MouseEvent.CLICK,onClick);
}
private function onClick(event:MouseEvent):void {
_onPositionX = mouseX;
_onPositionY = mouseY;
}
private function onEnter(event:Event):void {
_maru.x = _maru.x*0.8+_onPositionX*0.2;
_maru.y = _maru.y*0.8+_onPositionY*0.2;
_maru2.x = _maru2.x*0.9+_onPositionX*0.1;
_maru2.y = _maru2.y*0.9+_onPositionY*0.1;
}
}
}
[/as3]
その5 : 時計の秒針を作る
date.getSeconds()で秒の値を得る。
1分で1周(360度)させるため、戻り値を×6。
_maru.rotation = date.getSeconds()*6;
[as3]
package {
import flash.display.Sprite;
import flash.events.Event;
public class Main extends Sprite {
private var _maru:Sprite;
public function Main() {
_maru = new Sprite();
_maru.graphics.beginFill(0xFF0000);
_maru.graphics.drawCircle(0,-200,10);
_maru.graphics.endFill();
_maru.x = stage.stageWidth/2; // ステージの大きさ/2で真ん中に配置
_maru.y = 465/2; // 上に同じく真ん中配置。ステージサイズ決め打ち指定でもOK!!
this.addChild(_maru);
this.addEventListener(Event.ENTER_FRAME,onEnter);
}
private function onEnter(event:Event):void {
var date:Date = new Date();
_maru.rotation = date.getSeconds()*6; // getSecondsで0〜60の値が帰ってくるので、6倍して360度指定
}
}
}
[/as3]
宿題
「その5を発展させてイケてる時計を作りましょう。」
Flash時計を作る
秒がgetSecondsだから、getMinutesにgetHoursを使えばできるっぽい。
UIも凝りたいけど、果たしてそこまでできるのか…
