[英]When clearing background, rect moves
So i've used a rect to divide the screen for two different background colours.所以我用一个矩形将屏幕划分为两种不同的背景颜色。 The code im writing is for a minigame and its supposed to move a bubble up the screen, but when I click my mouse the rect I used to divide the screen moves as well.
我编写的代码是用于迷你游戏的,它应该在屏幕上移动一个气泡,但是当我单击鼠标时,我用来划分屏幕的矩形也会移动。 I probably did a very poor job at describing this so heres the code and you'll see what I mean.
我可能在描述这个方面做得很糟糕,所以这是代码,你会明白我的意思。
PFont font1;
int dice = 100;
int num = 0;
float circlex = 300;
float circley = 830;
float xmove = 0;
float ymove = 0;
void setup ()
{
noLoop();
frameRate(10);
size (600, 900);
//background (#29C4FF);
//fill (#C4FFEC);
//strokeWeight(3);
//line(1, 225, 599, 225);
//noStroke ();
//rect (0, 0, 599, 225);
font1 = loadFont ("ArialMT-18.vlw");
ellipseMode(CENTER);
}
void draw ()
{
//OCEAN
background (#29C4FF);
fill (#C4FFEC);
strokeWeight(3);
line(1, 225, 599, 225);
noStroke ();
rect (0, 0, 599, 225);
textFont(font1, 18);
fill(0);
text("Click on the dice to help free Aang from the iceberg.", 100, 50);
//BUBBLE
fill(0, 0, 200);
ellipse(circlex, circley, 125, 125);
noStroke();
fill (210);
ellipse(circlex, circley, 118, 118);
//AANG
//BODY
fill(#FF8E03);
noStroke ();
triangle(255, 830, 345, 830, 300, 890);
//HEAD
fill(#027A9D);
ellipse(275, 820, 10, 15);
ellipse(325, 820, 10, 15);
ellipse(300, 820, 50, 55);
rectMode(CENTER);
fill(255);
rect(300, 800, 10, 15);
triangle(290, 805, 310, 805, 300, 820);
rect(288, 815, 8, 3);
rect(312, 815, 8, 3);
//DICE
fill(#027A9D);
rect(80, 130, 100, 100, 12);
fill(#8EC1EA);
rect(80, 130, 90, 90, 8);
//NUMBERS(DOTS)
fill(150, 0, 0);
int num = int(random(1, 7));
if (num == 1 || num == 3 || num == 5)
ellipse(80, 130, dice/5, dice/5);
if (num == 2 || num == 3 || num == 4 || num == 5 || num == 6) {
ellipse(80 - dice/4, 130 - dice/4, dice/5, dice/5);
ellipse(80 + dice/4, 130 + dice/4, dice/5, dice/5);
}
if (num == 4 || num == 5 || num == 6) {
ellipse(80 - dice/4, 130 + dice/4, dice/5, dice/5);
ellipse(80 + dice/4, 130 - dice/4, dice/5, dice/5);
}
if (num == 6) {
ellipse(80, 130 - dice/4, dice/5, dice/5);
ellipse(80, 130 + dice/4, dice/5, dice/5);
}
if (num == 1 || num == 2) {
circlex = circlex + xmove;
xmove = +20;
}
if (num == 3 || num == 4) {
circlex = circlex + xmove;
xmove = -20;
}
if (num == 5) {
circley = circley + ymove;
ymove = -25;
}
if (num == 6) {
circley = circley + ymove;
ymove = -50;
}
//ROLL
if (mousePressed && mouseButton == LEFT)
noLoop();
}
void mousePressed() {
loop();
}
rectMode(CENTER);
This line modifies how your rectangles are drawn.此行修改矩形的绘制方式。 On the first run its still set to default (CORNER), but afterwards the rect get drawn from the center and thus moves to the top left.
在第一次运行时,它仍然设置为默认值 (CORNER),但之后矩形从中心开始绘制,因此移动到左上角。
Reference: https://processing.org/reference/rectMode_.html参考: https://processing.org/reference/rectMode_.html
Solution 1: Add rectMode(CORNER)
before drawing the background.方案一:在绘制背景之前添加
rectMode(CORNER)
。
Solution 2: Move rectMode(CENTER)
to the setup and draw all shapes a bit different.解决方案 2:将
rectMode(CENTER)
移动到设置中并绘制所有形状有点不同。
In general I suggest you put the background into a function for a better readability and flexibility.一般来说,我建议您将背景放入 function 以获得更好的可读性和灵活性。
void setup () {
noLoop();
frameRate(10);
size (600, 900);
ellipseMode(CENTER);
rectMode(CENTER); // added rectMode here.
}
void draw () {
drawStage();
//BUBBLE
// ...
}
// Function to draw the background
void drawStage() {
//OCEAN
background (#29C4FF);
fill (#C4FFEC);
noStroke();
rect(width/2, 125, width, 250); // rect drawn with "width" scales if you choose to adjust your sketch size.
fill(0);
text("Click on the dice to help free Aang from the iceberg.", 100, 50);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.