Flash(ActionScript2.0)でカバーフローを作りたい(PART1) : 円運動
Flashを勉強し始めました。なんとかAppleやAmazonなどで利用されているカバーフローのような作品を作りたいと思っています。健忘禄の意味もこめて記事を書いていきます。
Demo : coverflow1.swf
本記事の健忘禄
- 動的にムービークリップをステージに配置
- 配置したムービークリップが規則的な円を描く
動的にムービークリップをステージに配置
attachMovie(sinbol,name,depth,prop);
配置したムービークリップが規則的な円を描く
動的に配置したムービークリップのonEnterFrameイベントハンドラに円運動を記入します。
var degree = 0;
ムービークリップ.onEnterFrame(){
// 円運動の中心点
var centerX = 中心のX座標;
var centerY = 中心のY座標;
// 円の半径
var radius = 円の半径;
// 度数を弧度(ラジアンへ)
var radian = Math.PI/180*degree;
// 三角関数で円上の位置を取得し、自身の位置に設定
this._x = this.centerX + radius*Math.cos(radian);
this._y = this.centerY + 100*Math.sin(radian);
// 度数を増やす
degree += 5;
}
coverflow1.swfのソース
// クリップ作成オブジェクト
function CreateClip(degree) {
/* プロパティ */
// 度数
this.degree = degree;
// 半径
this.radius = 100;
// 円中心
this.centerX = 150,
this.centerY = 150,
/* onEnterFrameイベントハンドラ */
this.onEnterFrame = function(){
// 弧度
var radian = Math.PI/180*this.degree;
// 位置
this._x = this.centerX +this.radius*Math.cos(radian);
this._y = this.centerY +this.radius*Math.sin(radian);
this.degree += 5;
}
}
// インスタンスの生成と配置
var deg = 0;
var obj = new Array();
for(var i=0; i<8; i++){
obj[i] = new CreateClip(deg);
deg += 45;
attachMovie('clip','clip'+i,i,obj[i]);
trace(i);
}
/*
var obj1 = new CreateClip(0);
var obj2 = new CreateClip(45);
var obj3 = new CreateClip(90);
var obj4 = new CreateClip(135);
var obj5 = new CreateClip(180);
var obj6 = new CreateClip(225);
var obj7 = new CreateClip(270);
var obj8 = new CreateClip(315);
attachMovie('clip','clip1',1,obj1);
attachMovie('clip','clip2',2,obj2);
attachMovie('clip','clip3',3,obj3);
attachMovie('clip','clip4',4,obj4);
attachMovie('clip','clip5',5,obj5);
attachMovie('clip','clip6',6,obj6);
attachMovie('clip','clip7',7,obj7);
attachMovie('clip','clip8',8,obj8); */
参考にさせていただいたサイト
» 初心者のためのフラッシュレベルアップ講座
関連記事
- Flash(ActionScriipt2.0)でカバーフローを作りたい(PART3) : 円運動の停止
- Flash(ActionScript2.0)でカバーフローを作りたい(PART2) : 円の変形
- 水平方向伸縮ナビゲーション : ActionScript2.0
- 水平・垂直拡大メニュー : ActionScript
- ループ : ActionScript
コメント
コメントはまだありません。
コメントの投稿
改行と段落タグは自動で挿入されます。
メールアドレスは表示されません。
トラックバックURL
http://www.findxfine.com/flash/actionscript/70.html/trackback