正文
processing学习整理---Input（输入）
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
1、鼠标1D。
左右移动鼠标可移动天平。 “mouseX”变量用于控制矩形的大小和颜色。
void setup(){
size(640,360);
noStroke();
colorMode(RGB,height,height,height);
rectMode(CENTER);
}
void draw(){
background(0.0);
float r1 = map(mouseX,0,width,0,height);
float r2 = height -r1;
fill(r1);
rect(width/2 + r1/2,height/2,r1,r1);
fill(r2);
rect(width/2 - r2/2,height/2,r2,r2);
}
2、鼠标2D。
移动鼠标会更改每个框的位置和大小。
void setup() {
size(640, 360);
noStroke();
rectMode(CENTER);
}
void draw() {
background(51);
fill(255, 204);
rect(mouseX, height/2, mouseY/2+10, mouseY/2+10);
fill(255, 204);
int inverseX = width-mouseX;
int inverseY = height-mouseY;
rect(inverseX, height/2, (inverseY/2)+10, (inverseY/2)+10);
}
3、鼠标点击。
移动鼠标以定位形状。 按下鼠标按钮反转颜色。
void setup() {
size(640, 360);
noSmooth();
fill(126);
background(102);
}
void draw() {
if (mousePressed) {
stroke(255);
} else {
stroke(0);
}
line(mouseX-66, mouseY, mouseX+66, mouseY);
line(mouseX, mouseY-66, mouseX, mouseY+66);
}
4、鼠标信号。
移动并单击鼠标以生成信号。 顶行是来自“mouseX”的信号，中间行是来自“mouseY”的信号，底行是来自“mousePressed”的信号。
int[] xvals;
int[] yvals;
int[] bvals; void setup()
{
size(640, 360);
noSmooth();
xvals = new int[width];
yvals = new int[width];
bvals = new int[width];
} int arrayindex = 0; void draw()
{
background(102); for(int i = 1; i < width; i++) {
xvals[i-1] = xvals[i];
yvals[i-1] = yvals[i];
bvals[i-1] = bvals[i];
}
// Add the new values to the end of the array
xvals[width-1] = mouseX;
yvals[width-1] = mouseY;
if(mousePressed) {
bvals[width-1] = 0;
} else {
bvals[width-1] = 255;
} fill(255);
noStroke();
rect(0, height/3, width, height/3+1); for(int i=1; i<width; i++) {
stroke(255);
point(i, xvals[i]/3);
stroke(0);
point(i, height/3+yvals[i]/3);
stroke(255);
line(i, 2*height/3+bvals[i]/3, i, (2*height/3+bvals[i-1]/3));
}
}
5、缓和（Easing）。
将鼠标移动到屏幕上，符号将会跟随。 在绘制动画的每个帧之间，程序计算符号的位置和光标之间的差异。 如果距离大于1像素，则符号从其当前位置向光标移动部分距离（0.05）。
float x;
float y;
float easing = 0.05; void setup() {
size(640, 360);
noStroke();
} void draw() {
background(51); float targetX = mouseX;
float dx = targetX - x;
x += dx * easing; float targetY = mouseY;
float dy = targetY - y;
y += dy * easing; ellipse(x, y, 66, 66);
6、约束。
在屏幕上移动鼠标移动圆圈。 程序将圆圈限制在其框中。
float mx;
float my;
float easing = 0.05;
int radius = 24;
int edge = 100;
int inner = edge + radius; void setup() {
size(640, 360);
noStroke();
ellipseMode(RADIUS);
rectMode(CORNERS);
} void draw() {
background(51); if (abs(mouseX - mx) > 0.1) {
mx = mx + (mouseX - mx) * easing;
}
if (abs(mouseY - my) > 0.1) {
my = my + (mouseY- my) * easing;
} mx = constrain(mx, inner, width - inner);
my = constrain(my, inner, height - inner);
fill(76);
rect(edge, edge, width-edge, height-edge);
fill(255);
ellipse(mx, my, radius, radius);
}
7、存储输入。
在屏幕上移动鼠标可更改圆形的位置。 鼠标的位置被记录在阵列中并且每帧被回放。 在每个帧之间，最新的值被添加到每个数组的末尾，并且最早的值被删除。
int num = 60;
float mx[] = new float[num];
float my[] = new float[num]; void setup() {
size(640, 360);
noStroke();
fill(255, 153);
} void draw() {
background(51); // Cycle through the array, using a different entry on each frame.
// Using modulo (%) like this is faster than moving all the values over.
int which = frameCount % num;
mx[which] = mouseX;
my[which] = mouseY; for (int i = 0; i < num; i++) {
// which+1 is the smallest (the oldest in the array)
int index = (which+1 + i) % num;
ellipse(mx[index], my[index], i, i);
}
}
8、鼠标功能。
单击框并将其拖动到屏幕上。
float bx;
float by;
int boxSize = 75;
boolean overBox = false;
boolean locked = false;
float xOffset = 0.0;
float yOffset = 0.0; void setup() {
size(640, 360);
bx = width/2.0;
by = height/2.0;
rectMode(RADIUS);
} void draw() {
background(0); // Test if the cursor is over the box
if (mouseX > bx-boxSize && mouseX < bx+boxSize &&
mouseY > by-boxSize && mouseY < by+boxSize) {
overBox = true;
if(!locked) {
stroke(255);
fill(153);
}
} else {
stroke(153);
fill(153);
overBox = false;
} // Draw the box
rect(bx, by, boxSize, boxSize);
} void mousePressed() {
if(overBox) {
locked = true;
fill(255, 255, 255);
} else {
locked = false;
}
xOffset = mouseX-bx;
yOffset = mouseY-by; } void mouseDragged() {
if(locked) {
bx = mouseX-xOffset;
by = mouseY-yOffset;
}
} void mouseReleased() {
locked = false;
}
9、键盘。
点击图像给它的焦点，按字母键在时间和空间中创建表单。 每个键具有唯一的标识号。 这些数字可用于定位空间中的形状。
int rectWidth;
void setup() {
size(640, 360);
noStroke();
background(0);
rectWidth = width/4;
}
void draw() {
// keep draw() here to continue looping while waiting for keys
}
void keyPressed() {
int keyIndex = -1;
if (key >= 'A' && key <= 'Z') {
keyIndex = key - 'A';
} else if (key >= 'a' && key <= 'z') {
keyIndex = key - 'a';
}
if (keyIndex == -1) {
// If it's not a letter key, clear the screen
background(0);
} else {
// It's a letter key, fill a rectangle
fill(millis() % 255);
float x = map(keyIndex, 0, 25, 0, width - rectWidth);
rect(x, 0, rectWidth, height);
}
}
10、键盘功能。
点击窗口给它的焦点，然后按字母键来输入颜色。 每当按下一个键时，键盘功能keyPressed（）被调用。 keyReleased（）是释放键时调用的另一个键盘函数。
int maxHeight = 40;
int minHeight = 20;
int letterHeight = maxHeight; // Height of the letters
int letterWidth = 20; // Width of the letter int x = -letterWidth; // X position of the letters
int y = 0; // Y position of the letters boolean newletter; int numChars = 26; // There are 26 characters in the alphabet
color[] colors = new color[numChars]; void setup() {
size(640, 360);
noStroke();
colorMode(HSB, numChars);
background(numChars/2);
// Set a hue value for each key
for(int i = 0; i < numChars; i++) {
colors[i] = color(i, numChars, numChars);
}
} void draw() {
if(newletter == true) {
// Draw the "letter"
int y_pos;
if (letterHeight == maxHeight) {
y_pos = y;
rect( x, y_pos, letterWidth, letterHeight );
} else {
y_pos = y + minHeight;
rect( x, y_pos, letterWidth, letterHeight );
fill(numChars/2);
rect( x, y_pos-minHeight, letterWidth, letterHeight );
}
newletter = false;
}
} void keyPressed()
{
// If the key is between 'A'(65) to 'Z' and 'a' to 'z'(122)
if((key >= 'A' && key <= 'Z') || (key >= 'a' && key <= 'z')) {
int keyIndex;
if(key <= 'Z') {
keyIndex = key-'A';
letterHeight = maxHeight;
fill(colors[keyIndex]);
} else {
keyIndex = key-'a';
letterHeight = minHeight;
fill(colors[keyIndex]);
}
} else {
fill(0);
letterHeight = 10;
} newletter = true; // Update the "letter" position
x = ( x + letterWidth ); // Wrap horizontally
if (x > width - letterWidth) {
x = 0;
y+= maxHeight;
} // Wrap vertically
if( y > height - letterHeight) {
y = 0; // reset y to 0
}
}
11、毫秒。
毫秒是1/1000秒。 处理跟踪程序运行的毫秒数。 通过使用模（％）运算符修改此数，可创建不同的时间模式。
float scale;
void setup() {
size(640, 360);
noStroke();
scale = width/20;
}
void draw() {
for (int i = 0; i < scale; i++) {
colorMode(RGB, (i+1) * scale * 10);
fill(millis()%((i+1) * scale * 10));
rect(i*scale, 0, scale, height);
}
}
12、时钟。
可以使用second（），minute（）和hour（）函数读取当前时间。 在本例中，sin（）和cos（）值用于设置指针的位置。
int cx, cy;
float secondsRadius;
float minutesRadius;
float hoursRadius;
float clockDiameter; void setup() {
size(640, 360);
stroke(255); int radius = min(width, height) / 2;
secondsRadius = radius * 0.72;
minutesRadius = radius * 0.60;
hoursRadius = radius * 0.50;
clockDiameter = radius * 1.8; cx = width / 2;
cy = height / 2;
} void draw() {
background(0); // Draw the clock background
fill(80);
noStroke();
ellipse(cx, cy, clockDiameter, clockDiameter); // Angles for sin() and cos() start at 3 o'clock;
// subtract HALF_PI to make them start at the top
float s = map(second(), 0, 60, 0, TWO_PI) - HALF_PI;
float m = map(minute() + norm(second(), 0, 60), 0, 60, 0, TWO_PI) - HALF_PI;
float h = map(hour() + norm(minute(), 0, 60), 0, 24, 0, TWO_PI * 2) - HALF_PI; // Draw the hands of the clock
stroke(255);
strokeWeight(1);
line(cx, cy, cx + cos(s) * secondsRadius, cy + sin(s) * secondsRadius);
strokeWeight(2);
line(cx, cy, cx + cos(m) * minutesRadius, cy + sin(m) * minutesRadius);
strokeWeight(4);
line(cx, cy, cx + cos(h) * hoursRadius, cy + sin(h) * hoursRadius); // Draw the minute ticks
strokeWeight(2);
beginShape(POINTS);
for (int a = 0; a < 360; a+=6) {
float angle = radians(a);
float x = cx + cos(angle) * secondsRadius;
float y = cy + sin(angle) * secondsRadius;
vertex(x, y);
}
endShape();
}
