2016-12-14 3 views
0

上の処理の区切りを使用してアニメーション化していますライン。私はこれは私がラインの動きをエミュレートするために使用していた画素の対象である下の「バウンス」

class LineDot{ 
float x; 
float y; 
float yspeed=-1; 
    LineDot(float a, float b){ 
x=a; 
y=b; 
} 
float getX(){ 
    return x; 
} 
float getY(){ 
    return y; 
} 
void reverse(){ 
    yspeed*=-1; 
} 
void show(){ 
    stroke(255,255,255); 
    line(x,y,x,y); 
} 
void move(){ 
    if(y<1){ 
    yspeed*=-1; 
    } 
    if(y>720){ 
    yspeed*=-1; 
    } 
    y=y+yspeed; 

} 

} 

これは私が1280個のピクセルを使用して、実際のラインを作成し、それらを上下動1280×720ウィンドウを越えてる方法です。

LineDot[] first = new LineDot[1280]; 
LineDot[] second = new LineDot[0]; 
void setup(){ 

    size(1280,720); 

    for(int i = 0;i<first.length;i++){ 
    first[i]= new LineDot(i+1,(i+1)*0.5625); 
    } 
    for(int i = 0;i<second.length;i++){ 
    second[i] = new LineDot(i+1,(i+30)*0.5625); 
    } 
} 
void draw(){ 
    background(0,0,0); 
    for(int i = 0;i<first.length;i++){ 
    first[i].show(); 
    first[i].move(); 
    } 
    for(int i = 0;i<second.length;i++){ 
    second[i].show(); 
    second[i].move(); 
} 

} ラインが何らかの理由で下限底を打つときに、約10のうち1つのピクセルはピクセルで行を分けてしまいますと、ここでLine Broken upこれが何であるか示すようにラインがこの奇妙なほとんどの縞模様のラインとなりそれはラインが値0.5625は、これが起こっている理由である第一バウンドFirst Bounce Break

答えて

0

ピクセル単位の操作を行う場合は、何が起きているのかを理解できるように、適切な環境が必要です。ピクセルがあります速度:緑の制限

  • に触れる前に、ピクセル・スピード:

    int w = 32; 
    int h = 16; 
    LineDot[] first = new LineDot[w]; 
    void setup() { 
        size(1280, 720); 
        for (int i = 0; i<first.length; i++) { 
        first[i]= new LineDot(i+1, (i+1)*0.5625); 
        } 
        frameRate(2); 
        noStroke(); 
    } 
    void draw() { 
        background(0, 0, 0); 
        scale(40); 
        for (int i = 0; i<first.length; i++) { 
        first[i].show(); 
        first[i].limitCheck(); 
        first[i].move(); 
        } 
        stroke(128); 
        strokeWeight(1/40); 
        for(int i = 0; i <= h; i++) { 
        line(0,i,w,i); 
        } 
    } 
    class LineDot { 
        float x; 
        float y; 
        float yspeed=-1; 
        LineDot(float a, float b) { 
        x=a; 
        y=b; 
        } 
        float getX() { 
        return x; 
        } 
        float getY() { 
        return y; 
        } 
        void reverse() { 
        yspeed*=-1; 
        } 
        void show() { 
        fill(255); 
        rect(x, y, 1, 1); 
        fill(255,0,0); 
        rect(x, y+yspeed, 1, 1); 
        } 
        void limitCheck() { 
        if (y<1) { 
         yspeed*=-1; 
         //y = 1 - y; 
        } 
        if (y>h) { 
         yspeed*=-1; 
         //y = 2*h - y + 1; 
        } 
        fill(0,255,0); 
        rect(x, y+yspeed, 1, 1); 
        } 
        void move() { 
        y=y+yspeed; 
        } 
    } 
    

    いくつかのマイナーな修正:

    • 赤いここスケール40回実行するように変更あなたのコードは、ですフレームレートを2フレーム/秒に減らして、何が起きているかを確認します。

    問題はその唯一のピクセルではありません。ご覧のように、画面の上部がタッチされると(y < 1)、行は奇妙な形式で戻ります。これは、ピクセルがペアでy = 1を下回っているためですが、そのうちの1つがもう一方よりも離れているためです。それにもかかわらず、それらを動かすときには、両方に1を加えて、前回の形成を維持し、切り替えないようにします。

    あなたは私たちは、基本的に場所ということを言っている(また、あなたの浮遊ピクセルを修正)修正

    y = 1 - y; 
    

    ​​

    を見ることができる上に、コードの2行のコメントを解除した場合また、速度だけでなく、固定する必要があります。本質的に、1ピクセルまたは720ピクセルを超えて移動したピクセルの量を反転させるため、0.3に移動したピクセル(1未満を意味する)は0.7に、0.6ピクセルは0.4に移動する必要があります。

    これは中に追加した2つのラインであなたのコードです:

    LineDot[] first = new LineDot[1280]; 
    LineDot[] second = new LineDot[0]; 
    void setup() { 
    
        size(1280, 720); 
    
        for (int i = 0; i<first.length; i++) { 
        first[i]= new LineDot(i+1, (i+1)*0.5625); 
        } 
        for (int i = 0; i<second.length; i++) { 
        second[i] = new LineDot(i+1, (i+30)*0.5625); 
        } 
    } 
    void draw() { 
        background(0, 0, 0); 
        for (int i = 0; i<first.length; i++) { 
        first[i].show(); 
        first[i].move(); 
        } 
        for (int i = 0; i<second.length; i++) { 
        second[i].show(); 
        second[i].move(); 
        } 
    } 
    class LineDot { 
        float x; 
        float y; 
        float yspeed=-1; 
        LineDot(float a, float b) { 
        x=a; 
        y=b; 
        } 
        float getX() { 
        return x; 
        } 
        float getY() { 
        return y; 
        } 
        void reverse() { 
        yspeed*=-1; 
        } 
        void show() { 
        stroke(255, 255, 255); 
        line(x, y, x, y); 
        } 
        void move() { 
        if (y<1) { 
         yspeed*=-1; 
         y = 1 - y; 
        } 
        if (y>720) { 
         yspeed*=-1; 
         y = 2*720 - y + 1; 
        } 
        y=y+yspeed; 
        } 
    } 
    
  • 0
    for(int i = 0;i<first.length;i++){ 
    first[i]= new LineDot(i+1,(i+1)*0.5625); 
    } 
    

    に分解されるときのように見えます。

    0.565にそれを変えることで、私は行ごとに4に余分なピクセルをダウンさせることができました。

    は、この後、いくつかの値を試してみて、あなたは余分なピクセルを根絶することができるかもしれません。

    これが役立ちますように!

    関連する問題