İşleme nasıl yazılır; "Fare ile bölgeye tıklayın".

Question

düğmesinin tıklatılması nedeniyle, bu kodun neden istenildiği gibi çalışmadığını merak ediyordum. Ben 'next' diyor bir resmin üzerine tıkladığınızda o kadar

void mousePressed() { 

    if (mouseX > width-50 && mouseX < width && mouseY > height-50 && mouseY < height) 
    { 
     img = loadImage("doraemon.png"); 
     image(img, 0, 0, width, height); 
    } 

İstiyorum, ben arka plan üzerinde farklı bir görüntü gösterebilir ve tekrar tıklandığında eğer, bu nedenle başka bir arka plan görüntüsü göstermek ve. düğmesi 'yanındaki' olduğu

if (mouseX > width-50 && mouseX < width && mouseY > height-50 && mouseY < height) 

^Bu kod durumlarını pasajı. Bu kodu çalıştırdığımda, durumun üzerine gelindiğinde bir görüntü alıyorum, ancak düğmeye bastıktan sonra görüntünün görünmesini istiyorum.

Bunu nasıl yazacağını bilen var mı?

Ben yardım edin

if (mousePressed == condition) 
    { 
     then change image 
    } 

gibi bir şey gerekiyor. Gerçekten onu takdir ederim!

Answer 1

Tüm mantığınızı mousePressed() işlevine tıklamaya çalışıyorsunuz. Bunun yerine, mantığınızı mousePressed() işlevi ve draw() işlevi arasında bölmeniz gerekir. Çizilmesi gerekenleri takip etmek için değişkenleri kullanın. Bu değişkenleri mousePressed() işlevinde ayarlayın. draw() işlevinde neyin çizileceğini belirlemek için bu değişkenleri kullanın.

Basit bir örnek şöyle olabilir:

boolean showButton1 = true; 

void setup() { 
    size(200, 200); 
} 

void mousePressed() { 
    if (mouseX < 100 && mouseY < 100) { 
    //button 1 was just clicked, show button 2 instead 
    showButton1 = false; 
    } else if (mouseX > 100 && mouseY > 100) { 
    //button 2 was just clicked, show button 1 instead 
    showButton1 = true; 
    } 
} 

void draw() { 

    background(0); 

    if (showButton1) { //draw the first button 
    fill(255, 0, 0); 
    rect(0, 0, 100, 100); 
    } else { //draw the second button 
    fill(0, 255, 0); 
    rect(100, 100, 100, 100); 
    } 
} 

Ayrıca, mousePressed() veya draw() işlevlerden loadImage() çağırmamalıdır. Bunun yerine, görüntülerinizi setup() işlevinden yükleyin ve daha sonra kullanabileceğiniz değişkenlerde saklayın.

Answer 2

birkaç şey vardır bakmak bir snippet'te Yayınladığınız biraz kapalı:

if (mouseX > width-50 && mouseX < width && mouseY > height-50 && mouseY < height) 
    { 
     img = loadImage("doraemon.png"); 
     image(img, 0, 0, width, height); 
    } 

Bir küçük şudur: fare var her zaman sağ alt kenarında bir 50x50 kutusuna tıklayın resim yüklüyorsanız senin kroki Görüntüyü kurulumda bir kez yüklemelisiniz, ardından taslağınız üzerinden ihtiyacınız olduğunda yeniden kullanmanız yeterlidir.

ikinci ana sorun olabilir: fare basılı (ve taslak sağ alt tarafında) ise sadece bir kez image() diyoruz. Bu draw() işlevinde background() arama veya diğer çizim çağrıları varsa, zar zor

İşte

ben kodunda kastediyorum (o silinir olarak/daha sık üzerinde boyalı) Doraemon görüntü çekiliyor fark anlamına gelir:

, imgDraw bir boolean olduğunu ve koordinatları kontrol bir boolean ifadeyi çünkü

PImage img;//reference to the image 
boolean imgDraw;//keep track if the image should be drawn or not 

void setup(){ 
    //load the image only once, at setup 
    img = loadImage("doraemon.png"); 
    size(img.width,img.height); 
} 
void draw(){ 
    background(0);//clear each frame 
    if(imgDraw){//draw the image only if it needs to be drawn 
    image(img, 0, 0, width, height); 
    } 
} 
void mousePressed() { 
    //check if the cursor is at the bottom right, and if so, set the image draw flag to true 
    if (mouseX > width-50 && mouseX < width && mouseY > height-50 && mouseY < height) 
    { 

     imgDraw = true; 
    } 
    else 
    { 
     imgDraw = false; 
    } 
} 

Aslında, tek bir ifadenin bunu daraltabilirsiniz.

void mousePressed(){ 
    imgDraw = (mouseX > width-50 && mouseX < width && mouseY > height-50 && mouseY < height); 
} 

Çok güzel görünüyor, ancak kodun okunması daha zorsa, buna değmez. Okunabilir kod daha iyidir.