英文:
Roll-Overs in Processing Language
问题
我正在制作一个翻滚动画。
当鼠标光标回到瓦片上时,我将如何将颜色恢复到原来的颜色,以便在淡出时将其颜色淡化?
在我的代码中,颜色会褪变为白色,但当我将光标带回瓦片时颜色不会恢复。
float addColorValue;
boolean clicked = false;
void setup() {
size(400,400); //程序的像素大小
}
void draw() {
background(255); //设置白色背景
line(width/2,height,width/2,0); //绘制垂直线
line(width,height/2,0,width/2); //绘制水平线
if(clicked){
if(mouseX > 200 && mouseY > 200){ // 绘制第四象限
fill(255,255,addColorValue+=1); rect(200,200,200,200); //绘制矩形
fill(255); textSize(50); text("4TH", 250, 300); //显示象限编号
}
//绘制第三象限
else if(mouseX > 0 && mouseY > 200){
fill(addColorValue+=1,addColorValue+=1,255); rect(0,200,200,200);
fill(255); textSize(50); text("3RD", 50, 300);
}
//绘制第二象限
else if(mouseX > 200 && mouseY > 0){
fill(addColorValue+=1,255,addColorValue+=1); rect(200,0,200,200);
fill(255); textSize(50); text("2ND", 250, 100);
}
//绘制第一象限
else if(mouseX > 0 && mouseY > 0){
fill(255,addColorValue+=1,addColorValue+=1); rect(0,0,200,200);
fill(255); textSize(50); text("1ST", 50, 100);
}
}
else{
background(0);
}
}
//切换程序的灯光开关
void mousePressed() {
clicked = !clicked;
}
英文:
I am doing a Roll Over Animation.
How will I revert back the color to its original after if fades away when the mouse cursor comes back to the tile?
in my code, the color fades to white then does not come back when I bring back the cursor to the tile
float addColorValue;
boolean clicked = false;
void setup() {
size(400,400); //pixel size of the program
}
void draw() {
background(255); //setting up the white background
line(width/2,height,width/2,0); //drawing the vertical line
line(width,height/2,0,width/2); //drawing the horizontal line
if(clicked){
if(mouseX > 200 && mouseY > 200){ // draws the 4th quadrant
fill(255,255,addColorValue+=1); rect(200,200,200,200); //draws rectangle
fill(255); textSize(50); text("4TH", 250, 300); //display which number of the quadrant
}
//draws the 3rd quadrant
else if(mouseX > 0 && mouseY > 200){
fill(addColorValue+=1,addColorValue+=1,255); rect(0,200,200,200);
fill(255); textSize(50); text("3RD", 50, 300);
}
//draws the 2nd quadrant
else if(mouseX > 200 && mouseY > 0){
fill(addColorValue+=1,255,addColorValue+=1); rect(200,0,200,200);
fill(255); textSize(50); text("2ND", 250, 100);
}
//draws the 1st quadrant
else if(mouseX > 0 && mouseY > 0){
fill(255,addColorValue+=1,addColorValue+=1); rect(0,0,200,200);
fill(255); textSize(50); text("1ST", 50, 100);
}
}
else{
background(0);
}
}
//switches on and off the lights of the program
void mousePressed() {
clicked = !clicked;
}
答案1
得分: 2
为每个四分之一区域分配一个索引,并将索引存储在全局变量(quad
)中。获取当前四分之一区域的索引(new_quad
),并将其与quad
进行比较。如果索引发生了变化,则将addColorValue
设置为0。这将重新启动淡出效果:
if (quad != new_quad) {
quad = new_quad;
addColorValue = 0;
}
查看示例:
float addColorValue;
boolean clicked = false;
int quad = 0;
void setup() {
size(400,400); //程序的像素大小
}
void draw() {
if (clicked) {
background(255); //设置白色背景
line(width/2,height,width/2,0); //绘制垂直线
line(width,height/2,0,width/2); //绘制水平线
int new_quad = -1;
if (mouseX > 200 && mouseY > 200){
new_quad = 0;
drawRect("4TH", 200, 200, 200, 200, color(255, 255, addColorValue+=1));
}
else if(mouseX > 0 && mouseY > 200){
new_quad = 1;
drawRect("3RD", 0, 200, 200, 200, color(addColorValue+=1, addColorValue+=1, 255));
}
else if(mouseX > 200 && mouseY > 0){
new_quad = 2;
drawRect("2ND", 200, 0, 200, 200, color(addColorValue+=1, 255, addColorValue+=1));
}
else if(mouseX > 0 && mouseY > 0) {
new_quad = 3;
drawRect("1ST", 0, 0, 200, 200, color(255, addColorValue+=1, addColorValue+=1));
}
if (quad != new_quad) {
quad = new_quad;
addColorValue = 0;
}
}
else{
background(0);
}
}
void drawRect(String text, int x, int y, int w, int h, color c) {
fill(c);
rect(x, y, w, h);
fill(255);
textSize(50);
text(text, x+50, y+100);
}
//开关程序的灯光
void mousePressed(){
clicked = !clicked;
}
英文:
Associate each quad to an index and store the index in a globale variable (quad
). Get the index of the current quad (new_quad
) and compare it to the quad
. If the index has changed, then set addColorValue = 0
. This will restart the fading effect:
if (quad != new_quad) {
quad = new_quad;
addColorValue = 0;
}
See the example:
float addColorValue;
boolean clicked = false;
int quad = 0;
void setup() {
size(400,400); //pixel size of the program
}
void draw() {
if (clicked) {
background(255); //setting up the white background
line(width/2,height,width/2,0); //drawing the vertical line
line(width,height/2,0,width/2); //drawing the horizontal line
int new_quad = -1;
if (mouseX > 200 && mouseY > 200){
new_quad = 0;
drawRect("4TH", 200, 200, 200, 200, color(255, 255, addColorValue+=1));
}
else if(mouseX > 0 && mouseY > 200){
new_quad = 1;
drawRect("3RD", 0, 200, 200, 200, color(addColorValue+=1, addColorValue+=1, 255));
}
else if(mouseX > 200 && mouseY > 0){
new_quad = 2;
drawRect("2ND", 200, 0, 200, 200, color(addColorValue+=1, 255, addColorValue+=1));
}
else if(mouseX > 0 && mouseY > 0) {
new_quad = 3;
drawRect("1ST", 0, 0, 200, 200, color(255, addColorValue+=1, addColorValue+=1));
}
if (quad != new_quad) {
quad = new_quad;
addColorValue = 0;
}
}
else{
background(0);
}
}
void drawRect(String text, int x, int y, int w, int h, color c) {
fill(c);
rect(x, y, w, h);
fill(255);
textSize(50);
text(text, x+50, y+100);
}
//switches on and off the lights of the program
void mousePressed(){
clicked = !clicked;
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论