変形しながら回転する2次ベジェ曲線の円。
ActionScript Learning 110630で制作した円の座標をアニメーションさせて、ふにゃふにゃと変形しながら回転させる。
ステージをクリックすると円が表示されます。
制御点の数やイージングを調整するとことでいろいろな表現ができそう。
package {
import flash.display.*;
import flash.geom.*;
import flash.events.*;
import org.libspark.betweenas3.BetweenAS3;
import org.libspark.betweenas3.events.TweenEvent;
import org.libspark.betweenas3.tweens.*;
import org.libspark.betweenas3.easing.*;
import frocessing.color.*;
public class NMain extends MovieClip {
//-------------------------------------------------------------------------------- Properties
private var _this:*;
private var _stage:Stage;
//-------------------------------------------------------------------------------- Constractor
public function NMain() {
_this = this;
_stage = stage;
_stage.scaleMode = StageScaleMode.NO_SCALE;
_stage.align = StageAlign.TOP_LEFT;
_stage.quality = "low";
Init();
}
//-------------------------------------------------------------------------------- Function
/**
* initialize
*/
public function Init():void {
setup();
}
/**
* setup
*/
private function setup():void {
setup_main();
_stage.addEventListener(MouseEvent.MOUSE_DOWN, _mousedown);
}
//
private function _mousedown(eo:* = null):void {
var _softcircle = softcircle();
_softcircle.x = _main.mouseX;
_softcircle.y = _main.mouseY;
_main.addChild(_softcircle);
//if(_main.numChildren > 12) _main.removeChildAt(0);
}
/**
* setup
*/
private var _main:MovieClip;
private function setup_main():void {
_main = new MovieClip();
_main.x = Math.round(_stage.stageWidth / 2);
_main.y = Math.round(_stage.stageHeight / 2);
_this.addChild(_main);
}
/**
* softcircle
*/
private function softcircle():MovieClip {
var _softcircle = new MovieClip;
_softcircle.pntsarr = new Vector.< Object >();
var pntsleng = 4;
var radius = 200 + 100 * Math.random();
var grawval = radius / pntsleng;
var repeat = 1;
var angle = 360 * repeat / pntsleng;
for(var i = 0; i < pntsleng; i ++) {
//var pnt = dot(4);//new Object();
var pnt = new Object();
pnt.id = i + 1;
pnt.x = 0;
pnt.y = 0;
pnt.tgtangle = i * angle;
pnt.radius = radius;
pnt.tgtrandx = 0;
pnt.tgtrandy = 0;
pnt.goalrandx = 0;//200 * Math.random();
pnt.goalrandy = 0;//200 * Math.random();
//_softcircle.addChild(pnt);
_softcircle.pntsarr.push(pnt);
}
_softcircle.animcnt = 0;
_softcircle.circlelength = 10;
var colorhsl = new ColorHSL();
colorhsl.s = .8;
colorhsl.l = .8;
var colorhsl_h = 100 * Math.random() + 100;
for(var j = 0; j < _softcircle.circlelength; j ++) {
var _circle = new MovieClip();
_circle.name = "circle_" + (j + 1);
_circle.pntsarr = new Vector.< Point >();
colorhsl.h = 12 * j + colorhsl_h;
_circle.colorval = colorhsl.value;
for(var k = 0; k < pntsleng; k ++) {
_circle.pntsarr.push(new Point());
}
_softcircle.addChild(_circle);
}
_softcircle.addEventListener(Event.ENTER_FRAME, softcircle_enterframe);
return _softcircle;
}
//
private function softcircle_enterframe(eo:* = null):void {
var _softcircle = eo.currentTarget;
drawaction(_softcircle);
}
//
private var cnt:Number = 0;
private function drawaction(_softcircle:MovieClip):void {
var scpntsarr = _softcircle.pntsarr;
for(var i = 0; i < scpntsarr.length; i ++) {
var pnt = scpntsarr[i];
pnt.tgtrandx += (pnt.goalrandx - pnt.tgtrandx) * .04;
pnt.tgtrandy += (pnt.goalrandy - pnt.tgtrandy) * .04;
pnt.tgtangle += 2;// + Math.abs(Math.sin(cnt * 2 * (Math.PI / 180)) * 1);
if(pnt.tgtangle > 360) pnt.tgtangle -= 360;
if(_softcircle.animcnt % 200 == 0 || _softcircle.animcnt == 0) {
pnt.goalrandx = 400 * Math.random() - 200;
pnt.goalrandy = 200 * Math.random() - 100;
}
_softcircle.animcnt += 1;
var grawx = pnt.radius + pnt.tgtrandx;
var grawy = pnt.radius + pnt.tgtrandy;
pnt.x = grawx * Math.cos(pnt.tgtangle * (Math.PI / 180));
pnt.y = grawy * Math.sin(pnt.tgtangle * (Math.PI / 180));
}
var firstcircle = _softcircle.getChildByName("circle_1");
var fcpntsarr = firstcircle.pntsarr;
for(i = 0; i < scpntsarr.length; i ++) {
var scpnt = scpntsarr[i];
var fcpnt = fcpntsarr[i];
fcpnt.x = scpnt.x;
fcpnt.y = scpnt.y;
}
drawcircle(firstcircle);
for(var j = 1; j < _softcircle.circlelength; j ++) {
var _lastcircle = _softcircle.getChildByName("circle_" + (j + 1 - 1));
var _circle = _softcircle.getChildByName("circle_" + (j + 1));
var circlepntsarr = _circle.pntsarr;
var lastcirclepntsarr = _lastcircle.pntsarr;
for(var k = 0; k < circlepntsarr.length; k ++) {
var circlepnt = circlepntsarr[k];
var lastepnt = lastcirclepntsarr[k];
circlepnt.x += (lastepnt.x - circlepnt.x) * .2;
circlepnt.y += (lastepnt.y - circlepnt.y) * .2;
}
drawcircle(_circle);
}
}
/**
* draw action
*/
private function drawcircle(tgtcircle:MovieClip):void {
var pntsarr = tgtcircle.pntsarr;
//trace(pntsarr);
var g = tgtcircle.graphics;
g.clear();
g.lineStyle(1, tgtcircle.colorval, .5);
g.moveTo((pntsarr[0].x + pntsarr[1].x) / 2, (pntsarr[0].y + pntsarr[1].y) / 2);
for (var i = 1; i < pntsarr.length + 2; i++){
var pnum = i;
if(pnum > pntsarr.length - 1) pnum -= pntsarr.length;
var nextpnum = pnum + 1;
if(nextpnum > pntsarr.length - 1) nextpnum -= pntsarr.length;
var cntx = pntsarr[pnum].x;
var cnty = pntsarr[pnum].y;
var ancx = (pntsarr[pnum].x + pntsarr[nextpnum].x) / 2;
var ancy = (pntsarr[pnum].y + pntsarr[nextpnum].y) / 2;
g.curveTo(cntx, cnty, ancx, ancy);
}
}
/**
* dot
*/
private function dot(rad:Number = 6, col:Number = 0xFFAAFF):MovieClip {
var _dot = new MovieClip();
var g = _dot.graphics;
g.beginFill(col, 1);
g.drawCircle(0, 0, rad);
return _dot;
}
}
}