0

円を生成し、ステージの境界内に浮かせるこのコードがあります。ステージにとどまりますが、ギブもあるので、好きな量だけサークルを押していきましょう。

これを行うことは可能ですが、カスタムシェイプを使用して、円をこのシェイプ内に閉じ込めることはできますか？

これが私が持っているコードです：

//number of balls
var numBalls:uint = 200;
var defaultBallSize:uint = 8;
var colors:Array = [0x79B718, 0x2D91A8, 0xB019BC, 0xF98715, 0xDB1616];

//init
makeDots();

function makeDots():void {
//create desired number of balls
for (var ballNum:uint=0; ballNum<numBalls; ballNum++){
var c1:Number = randomColor();
var c2:Number = randomColor();

//create ball
var thisBall:MovieClip = new MovieClip();
thisBall.graphics.beginFill(c1);
//thisBall.graphics.lineStyle(defaultBallSize, 0);
thisBall.graphics.drawCircle(defaultBallSize, defaultBallSize, defaultBallSize);
thisBall.graphics.endFill();

addChild(thisBall);

//coordinates
thisBall.x = Math.random() * stage.stageWidth;
thisBall.y = Math.random() * stage.stageHeight;
//percieved depth
thisBall.ballNum = ballNum;
thisBall.depth = ballNum/numBalls;
thisBall.scaleY = thisBall.scaleX = 
////thisBall.alpha = 
ballNum/numBalls;
//velocity
thisBall.vx = 0;
thisBall.vy = 0;
thisBall.vz = 0;

//ball animation
thisBall.addEventListener(Event.ENTER_FRAME, animateBall);
}
}

var dampen:Number = 0.90;
var maxScale:Number = 1.3;
var minScale:Number = .3;
var maxAlpha:Number = 1.3;
var minAlpha:Number = .3;
function animateBall(e:Event):void{
var thisBall:Object = e.target;
//apply randomness to velocity
thisBall.vx += Math.random() * 0.2 - 0.1;
thisBall.vy += Math.random() * 0.2 - 0.1;
thisBall.vz += Math.random() * 0.002 - 0.001;

thisBall.x += thisBall.vx;
thisBall.y += thisBall.vy;
//thisBall.scaleX = thisBall.scaleY += thisBall.vz;
//thisBall.alpha += thisBall.vz;
thisBall.vx *= dampen;
thisBall.vy *= dampen;
thisBall.vz *= dampen;

if(thisBall.x > stage.stageWidth) {
thisBall.x = 0 - thisBall.width;
}
else if(thisBall.x < 0 - thisBall.width) {
thisBall.x = stage.stageWidth;
}
if(thisBall.y > stage.stageHeight) {
thisBall.y = 0 - thisBall.height;
}
else if(thisBall.y < 0 - thisBall.height) {
thisBall.y = stage.stageHeight;
}

if (thisBall.scaleX > maxScale){
thisBall.scaleX = thisBall.scaleY = maxScale;
}
else if (thisBall.scaleX < minScale){
thisBall.scaleX = thisBall.scaleY = minScale;
}
if (thisBall.alpha > maxAlpha){
thisBall.alpha = maxAlpha;
}
else if (thisBall.alpha < minAlpha){
thisBall.alpha = minAlpha;
}
}

function randomColor():uint
{
return colors[int(Math.random()*colors.length)];
}

コードクレジット：

もともとここから：サークルキューブ

ここでの追加のヘルプ：事前定義された色のリスト内のランダムな色

4

3 に答える 3

2

はい、できます。何が起こっているのかというと、各円が動くと、それがx軸とy軸のステージ境界内にあるかどうかがチェックされ、消えると「修正」されます。これを決定するコードのその部分を変更して、円がカスタム形状内にあるかどうかを確認できます。

これの複雑さは、カスタムシェイプと、円/オブジェクトがカスタムシェイプ内にあるかどうかを検出する方法によって異なります。

ステージはすでに大きな長方形であるため、試すことができる「最も簡単なカスタム形状」は長方形または正方形になります。これを開始するには、指定されたコードを調べて、ステージの寸法のxとyの位置を制限するコード行を見つけ、それらをカスタムの長方形/正方形の寸法に変更します。カスタム形状の長方形/正方形がステージのように0、0から発生していない場合は、位置オフセットを追加する必要がある場合があります。他の形状を試してみたい場合は、この部分（実際には基本的な衝突検出）をメソッドに分解することをお勧めします。

編集

私は自分の回答を編集して、ランダムな正方形をカスタム形状として使用するように作り直した元のコードを含めました。これは、元の回答で述べたように試すのが最も簡単な形状です。うまくいけば、2つを比較して、その背後にあるロジックを理解するために私が行った変更を確認できます。

円、または他の完全にランダムな形状の場合、それは少し難しいでしょうが、同じ考え/概念です。

//number of balls
var numBalls:uint = 200;
var defaultBallSize:uint = 8;
var colors:Array = [0x79B718, 0x2D91A8, 0xB019BC, 0xF98715, 0xDB1616];

// new custom shape bounds, a square that is 200, 200 px and is at 175, 100 on the stage
var customSquare:Rectangle = new Rectangle(175, 100, 200, 200);

//init
makeDots();
function makeDots():void {
    //create desired number of balls
    for (var ballNum:uint=0; ballNum < numBalls; ballNum++){
        var c1:Number = randomColor();
        var c2:Number = randomColor();

        //create ball
        var thisBall:MovieClip = new MovieClip();
        thisBall.graphics.beginFill(c1);
        //thisBall.graphics.lineStyle(defaultBallSize, 0);
        thisBall.graphics.drawCircle(defaultBallSize, defaultBallSize, defaultBallSize);
        thisBall.graphics.endFill();

        addChild(thisBall);

        //coordinates - this part of the code is setting the initial positions of the circles based on the stage size
        //thisBall.x = Math.random() * stage.stageWidth;
        //thisBall.y = Math.random() * stage.stageHeight;
        //
        // changed so they use the "customSquare" rectangle instead, note that the custom shape has an x and y pos now that doesn't start at 0 (unlike the stage)
        thisBall.x = (Math.random() * customSquare.width) + customSquare.x;
        thisBall.y = (Math.random() * customSquare.height) + customSquare.y;

        //percieved depth
        thisBall.ballNum = ballNum;
        thisBall.depth = ballNum / numBalls;
        thisBall.scaleY = thisBall.scaleX = ballNum / numBalls;

        //velocity
        thisBall.vx = 0;
        thisBall.vy = 0;
        thisBall.vz = 0;

        //ball animation
        thisBall.addEventListener(Event.ENTER_FRAME, animateBall);
    }
}

var dampen:Number = 0.90;
var maxScale:Number = 1.3;
var minScale:Number = .3;
var maxAlpha:Number = 1.3;
var minAlpha:Number = 0.3;

function animateBall(e:Event):void{
    var thisBall:Object = e.target;

    //apply randomness to velocity
    /*thisBall.vx += Math.random() * 0.2 - 0.1;
    thisBall.vy += Math.random() * 0.2 - 0.1;
    thisBall.vz += Math.random() * 0.002 - 0.001;*/
    // increased velocity ranges to add more speed to see the effects easier
    thisBall.vx += Math.random() * 1.2 - 0.6;
    thisBall.vy += Math.random() * 1.2 - 0.6;
    thisBall.vz += Math.random() * 0.012 - 0.006;

    thisBall.x += thisBall.vx;
    thisBall.y += thisBall.vy;
    //thisBall.scaleX = thisBall.scaleY += thisBall.vz;
    //thisBall.alpha += thisBall.vz;
    thisBall.vx *= dampen;
    thisBall.vy *= dampen;
    thisBall.vz *= dampen;

    // =====================================================================================================================================
    // this part of the code is determining if each ball is going outside of the bounds of the stage and repositioning them if they are
    // this part is the 'collision detection', changed to use the bounds of the "customSquare" rectangle instead
    //
    // this part is detecting the position going out of bounds along the X axis
    /*if(thisBall.x > stage.stageWidth) {
        thisBall.x = 0 - thisBall.width;
    } else if(thisBall.x < 0 - thisBall.width) {
        thisBall.x = stage.stageWidth;
    }*/
    if(thisBall.x > (customSquare.width + customSquare.x)) {
        thisBall.x = customSquare.x - thisBall.width;
    } else if(thisBall.x < customSquare.x - thisBall.width) {
        thisBall.x = customSquare.width + customSquare.x;
    }

    // this part is detecting the position going out of bounds along the Y axis
    /*if(thisBall.y > stage.stageHeight) {
        thisBall.y = 0 - thisBall.height;
    } else if(thisBall.y < 0 - thisBall.height) {
        thisBall.y = stage.stageHeight;
    }*/
    if(thisBall.y > (customSquare.height + customSquare.y)) {
        thisBall.y = customSquare.y - thisBall.height;
    } else if(thisBall.y < customSquare.y - thisBall.height) {
        thisBall.y = customSquare.height + customSquare.y;
    }
    // =====================================================================================================================================


    if (thisBall.scaleX > maxScale){
        thisBall.scaleX = thisBall.scaleY = maxScale;
    } else if (thisBall.scaleX < minScale){
        thisBall.scaleX = thisBall.scaleY = minScale;
    }

    if (thisBall.alpha > maxAlpha){
        thisBall.alpha = maxAlpha;
    } else if (thisBall.alpha < minAlpha){
        thisBall.alpha = minAlpha;
    }
}

function randomColor():uint{    return colors[int(Math.random()*colors.length)];    }
于 2013-01-08T10:08:45.590 に答える
0

あなたが求めているのは、限られたエリアの周りの境界線だけだと仮定すると、次のようなことができます。

var container:MovieClip = new MovieClip;
container.graphics.lineStyle(1,0,1);
container.graphics.drawRect(0, 0, container.width, container.height);
container.graphics.endFill();
addChild(container);

そして交換してください：

addChild(thisBall);

と ：

container.addChild(thisBall);
于 2013-01-08T09:41:10.247 に答える
0

フラッシュでアニメーション化することから、このようなことを行うためのフラッシュの方法は、レイヤーマスクを使用することです。これはコードでも可能です。大まかにこのようなもの：

addChild(thisBall);

var layermask:Shape=new Shape();
addChild(layermask);
thisBall.mask=maskingShape;
于 2013-01-08T15:13:00.560 に答える