當我旋轉圖像，指示燈熄滅屏幕

我嘗試旋轉圖像90度，但是當我做它熄滅屏幕（在窗口的左側），這裏是我的代碼：當我旋轉圖像，指示燈熄滅屏幕

這裏是一個鏈接我的圖像：http://imgur.com/gallery/pQ85Z

現在我只是想讓它旋轉，當我按'R'但在此之後，我需要使它旋轉時，它擊中屏幕的邊緣。

PImage head; 
int fizzyX = 400; 
int fizzyY = 50; 
int movementX=0; 
int movementY=0; 
float x; 

void setup() { 
    size(800,800); 
    background(255); 
    head = loadImage("Fizzy.PNG"); 
} 

void collisionDetection() { 
    if (fizzyX == (750)) { 
    movementX=-1; 
    key = 'a'; 
    } 
} 



void keyPressed() { 
    if (key == 'a' || key == 'A') { 
    movementX = -1; 
    movementY = 0; 
    } 
    if (key == 'd' || key == 'D') { 
    movementX = 1; 
    movementY = 0; 
    } 
    if (key == 'w' || key == 'W') { 
    movementX = 0; 
    movementY = -1; 
    } 
    if (key == 's' || key == 'S') { 
    movementX = 0; 
    movementY = 1; 
    } 
    if (key == 'r') { 
    x = PI/2; 
    } 
} 

void draw() { 
    rotate(x); 
    background(255); 
    imageMode(CENTER); 
    image(head,fizzyX,fizzyY); 
    fizzyX+=movementX; 
    fizzyY+=movementY; 
    keyPressed(); 
    collisionDetection(); 
    translate(width/2,height/2); 

}

來源

2017-04-24 Timothy Bolton

的rotate()函數執行圍繞原點，默認情況下是在0,0轉動。這會導致圖像圍繞窗口的左上角旋轉，從而導致圖像離開屏幕。

如果你想旋轉圖像的中心，那麼你首先必須將原點移動到圖像的中心。您可以使用translate()函數執行此操作，但您必須在之前執行。

將其組合在一起，它應該是這樣的：

void draw() { background(255); imageMode(CENTER); translate(fizzyX, fizzyY); rotate(x); image(head,0,0); fizzyX+=movementX; fizzyY+=movementY; collisionDetection(); }

另外請注意，你不應該手動調用keyPressed()功能。處理將爲你打電話。

來源

2017-04-24 04:04:47

感謝這正是我需要的答案，但我不明白爲什麼自己的形象（頭，0,0），而不是像（頭，fizzyX，fizzyX）不應前者把圖像在屏幕的左上角，而不是在fizzyX和Y的值？ –

@TimothyBolton記住座標是相對於**原點**。對translate（）的調用將原點移動到fizzyX，fizzyY。那麼如果我們在'100,100'處繪製一些東西，它實際上會處於'fizzyX + 100，fizzyY + 100'，因爲一切都是相對於原點的。這就是爲什麼你在'0,0'處繪製一些東西來放在'fizzyX，fizzyY'上。那有意義嗎？ –

更詳細的，我建議：

按RX必須HALF_PI增加 - 每次（HALF_PI是在處理中定義的常量）

你做一個轉變，你應該使用pushMatrix - 每次（）和popMatrix（），以便只轉換之間的內容。

- 將要放置圖形的原點放入，然後旋轉，然後將圖形放入0,0。這是你更正的代碼，它的作用就像一個魅力。

- 使用PVector如果可能，使代碼更易於理解，與variableX更簡潔，variableY

-X是一個不好的名字rotationAngle會是一個更好的

嘗試它，它的工作原理及其方式更清晰。

PImage head; 
PVector fizzy; 
PVector movement; 
float rotationAngle; 

void setup(){ 
    size(800,800); 
    fizzy=new PVector(400,50); 
    movement=new PVector(0,0); 
    rotationAngle=0; 
    background(255); 
    head = loadImage("Fizzy.png"); 
} 

void collisionDetection() { 
    if (fizzy.x == (750)) { 
    movement.set(-1,0); 
    } 
} 

void keyPressed() { 
    if (key == 'a' || key == 'A') { 
    movement.set(-1,0); 
    } 
    if (key == 'd' || key == 'D') { 
    movement.set (1,0); 
    } 
    if (key == 'w' || key == 'W') { 
    movement.set (0,-1); 
    } 
    if (key == 's' || key == 'S') { 
    movement.set (0,1); 
    } 
    if (key == 'r') { 
    rotationAngle+=HALF_PI; 
    } 
} 

void draw() { 
    background(255); 
    pushMatrix(); 
    translate(fizzy.x,fizzy.y); 
    rotate(rotationAngle); 
    imageMode(CENTER); 
    image(head,0,0); 
    popMatrix(); 

    fizzy.add(movement); 
    collisionDetection(); 
}

來源

2017-04-28 17:48:04

當我旋轉圖像，指示燈熄滅屏幕

回答

相關問題