Processing鼠标键盘

一、鼠标

1、鼠标坐标:

Processing的2D坐标系统,是以窗口的左上角为起点,作为(0, 0)点,x轴正方向向右延伸,y轴正方向向下延伸。而描述鼠标的位置信息,用的就是坐标值。坐标值其实就是一个点,包括了x坐标值和y坐标值。所遵循的坐标系,就是Processing的2D坐标系统。

那如何实时获取鼠标的坐标值呢?Processing直接给出了两个变量,这两个变量是系统定义好的,直接拿来就可以使用,分别是mouseXmouseY。比如你想实时查看当前坐标的位置,可以直接在draw()方法里打印出这两个值。

void draw() {
  println(mouseX + " : " + mouseY);
}

在程序框架的draw()方法里,使用系统提供的println()方法,即可实时打印出鼠标的x坐标和y坐标值。接下来我们做一个比较示例的例子:

// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 初始化窗口大小
  size(100, 100);
  // 清除填充色
  noStroke();
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 设置背景色。
  // 由于是在draw()方法中设置背景色,
  // 所以背景色会被不停的刷新。
  background(126);
  // 画圆形。
  // 中心点为鼠标的x坐标和y坐标值。
  ellipse(mouseX, mouseY, 33, 33);
}

运行结果

有时候,我们可能想知道,每次鼠标的移动间距,所以这时候就需要记录上一次的鼠标坐标点。出于这一点考虑,Processing为我们提供了这样一组变量,用来记录上一次鼠标的坐标点,变量的名称为pmouseXpmouseY,和mouseXmouseY很像,只是变量名称的前面多了一个字母p。这样的话,如果我们想记录鼠标两次移动之间的距离,只要用mouseX - pmouseXmouseY - pmouseY即可,非常方便吧!So easy~

2、鼠标按键:

鼠标除了有坐标点以外,还有鼠标按键。那对于鼠标按键状态的获取,Processing也为我们提供了现成的变量。对于任意鼠标按键按下的状态,我们可以统一使用mousePressed来判断。举例来说明。

// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 初始化窗口大小
  size(100, 100);
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 设置背景色
  // 由于是在draw()方法中设置背景色,
  // 所以背景色会被不停的刷新。
  background(204);
  // 判断鼠标是否有按键按下。
  // true为有按键按下,
  // 否则无按键按下。
  if (mousePressed == true) {
    // 填充白色
    fill(255);
  } else {
    // 填充黑色
    fill(0);
  }
  // 画矩形
  rect(25, 25, 50, 50);
}

上面例子,不论按下鼠标那个按键都会填出白色。如果想判断是哪个按键按下,则就要用另外一个变量了。与之类似,Processing提供的变量名为mouseButton。普通鼠标通常有三个按键,所以判断的状态也就包括了三种,分别为LEFTCENTER以及RIGHT。在上述例子之上,我们做一点小小的修改。代码如下:

// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 初始化窗口大小
  size(100, 100);
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 判断鼠标左键是否按下
  if (mouseButton == LEFT) {
    // 填充黑色
    fill(0);
  } else if (mouseButton == RIGHT) {
    // 判断鼠标右键是否按下,
    // 并填充白色
    fill(255); // White
  } else {
    // 若没有按键按下,则填充灰色
    fill(126); // Gray
  }
  // 画矩形
  rect(25, 25, 50, 50);
}

3、鼠标事件:

上面获取鼠标的状态,我们可以统称为鼠标数据。那除了获取鼠标数据以外,我们还可以感知鼠标事件。如果细心,你会发现,上述过程中,我们获取鼠标数据都是在编程框架的draw()方法中。这个draw()方法会不停地被系统循环调用,所以我们获取鼠标的数据也都是实时的。但如果我们只想在鼠标状态发生变化的时候获取鼠标的数据,这个时候如果我们还放在draw()里进行调用,获取就不太合适了。Processing为我们考虑到了这一点,所以提供了几个常用的鼠标事件。这些事件作为单独的方法被系统调用,而且只在鼠标状态发生变化的时候,调用一次,所以这些事件不会没由头的不停调用。对于鼠标来说,Processing为我们提供四个常用的事件。分别如下:

  • mousePressed():只有在鼠标按键按下的那一瞬间,会被系统调用一次;
  • mouseReleased():只有在鼠标按键弹起的那一瞬间,会被系统调用一次
  • mouseMoved():会在鼠标移动的时候,不停的被系统调用;
  • mouseDragged():会在鼠标按键按下,并进行拖拽的时候,不停的被系统调用
// 定义四个整型变量。
// 前两个为鼠标拖拽坐标值。
// 后两个为鼠标移动坐标值。
int dragX, dragY, moveX, moveY;
// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 设置窗口大小
  size(100, 100);
  // 清空填充色
  noStroke();
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 设置背景色
  background(204);
  // 设置填充色为黑色
  fill(0);
  // 画黑色圆形。
  // 此圆形会随着鼠标拖拽进行移动。
  ellipse(dragX, dragY, 33, 33);
  // 设置填充色为灰色
  fill(153);
  // 此圆形会随着鼠标移动进行移动。
  ellipse(moveX, moveY, 33, 33);
}
// 鼠标移动方法。
// 当鼠标移动的时候,
// 系统会触发鼠标移动事件,并调用此方法。
void mouseMoved() {
  // 鼠标移动时,获取鼠标坐标,
  // 并改变灰色圆形位置。
  moveX = mouseX;
  moveY = mouseY;
}
// 鼠标拖拽方法。
// 当鼠标拖拽的时候,
// 系统会触发鼠标拖拽事件,并调用此方法。
void mouseDragged() {
  // 鼠标拖拽时,获取鼠标坐标,
  // 并改变黑色圆形位置。
  dragX = mouseX;
  dragY = mouseY;
}

这个例子里,用到了其中两个鼠标事件,一个是鼠标的拖拽,另一个是鼠标的移动,对于鼠标的按下和抬起,其实大同小异。这里要注意的是,按下和抬起都是在鼠标状态改变的时候,只触发一次。所以,根据应用场景的不同,如果想获取鼠标的连续状态,可以在draw()方法里通过调用mouseButton来获取鼠标状态,如果只是想触发一次,那么可以选择在mousePressed()或mouseReleased()方法里获取鼠标的坐标

4、鼠标的icon:

Processing里提供了自定义鼠标的功能。如果想使用系统默认提供的鼠标icon,Processing定义了六个常量,来标示系统常用鼠标的icon,分别是ARROWCROSSHANDMOVETEXT以及WAIT。这六个系统提供的鼠标icon,会随着操作系统的不同更改变。具体如何使用呢?我们还是举一个简单的例子。

// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 设置窗口大小
  size(100, 100);
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 设置背景色
  background(204);
  // 判断鼠标是否按下
  if (mousePressed == true) {
    // 将鼠标的icon改为HAND
    cursor(HAND);
  } else {
    // 将鼠标的icon改为CROSS
    cursor(CROSS);
  }
  // 以鼠标的x坐标画一条线
  line(mouseX, 0, mouseX, height);
  // 以鼠标的y坐标画一条线
  line(0, mouseY, height, mouseY);
}

当然,除了更改成系统提供的以外,还可以自定义鼠标的图形。Processing提供了noCursor()方法,来隐藏鼠标默认的icon,然后可以自定义一个图形,将鼠标的坐标值赋值给图形,那么这个图形就可以看成为鼠标的icon。自定义的图形可以是通过Processing画出的,也可以从外部加载图片文件,都可以。

二、键盘

1、键盘数据:

类比于鼠标,键盘也有专门的变量,来记录是否有键盘的某个按键按下。Processing提供了keyPressed变量来记录当前是否有按键按下。为了更直观的说明,我们还是用简短的例子来说明。

// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup(){
  // 初始化窗口大小
  size(100, 100);
  // 设置直线的宽度
  strokeWeight(4);
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 设置背景色。
  // 由于是在draw()方法中设置背景色,
  // 所以背景色会被不停的刷新。
  background(204);
  // 判断键盘是否有按键按下
  if (keyPressed == true) {
    // 如果有按键按下,
    // 则画一条直线。
    line(20, 20, 80, 80);
  } else {
    // 否则画一个矩形
    rect(40, 40, 20, 20);
  }
}

当运行后按下任意键,就会变成上图。如果某一个按键一直处于被按下的状态,那么窗口中就会一直显示直线,直到按键松开为止。

那么,更进一步,如果我们想知道键盘上按下的是哪个键又该怎样做呢?别担心,Processing同样为我们提供了简单的变量,可以直接获取。哪个变量呢?很简单,就是key

// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 设置窗口大小
  size(100, 100);
  // 设置显示字体大小
  textSize(60);
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 由于是在draw()方法中设置背景色,
  // 所以背景色会被不停的刷新。
  background(0);
  // text()方法用来显示字符串,
  // 其中有三个参数:
  // 第一个参数为要显示的字符串,
  // 后两个参数是字符串显示的(x, y)坐标值。
  text(key, 20, 75);
}

添加完之后,点击菜单栏里的运行按钮,编译并运行程序。如果一切顺利,会看到类似如下运行结果。

通过key变量,我们可以获知当前键盘上按下了哪个按键。这里要说明一下,key值是区分大小写的,比如答谢的字母A和小写a是不同的。聪明的朋友可能想到了,如果我按下的不是字母,而是类似于Ctrl键会怎样?Processing也考虑到了这种情况,所以专门为这几个特殊的按键做了定义。而且使用的变量不再是key,而是keyCode变量,对于这些功能键也定义了常量,分别有CONTROLALTSHIFTUPDOWNLEFT以及RIGHT。对于功能键的判断,可以通过判断key是否等于CODED。好!我们还是通过一个例子,来展示到底如何使用。

// 定义矩形的y轴坐标
int y = 35;
// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 初始化窗口大小
  size(100, 100);
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 设置背景色。
  // 由于是在draw()方法中设置背景色,
  // 所以背景色会被不停的刷新。
  background(204);
  // 画一条细线
  line(10, 50, 90, 50);
  // 判断按下的是否为功能键
  if (key == CODED) {
    // 判断是否按下的是向上按键
    if (keyCode == UP) {
      // 将矩形y轴的位置定位20
      y = 20;
    } else if (keyCode == DOWN) {
      // 若按键按下的是向下的按键
      // 将矩形y轴的位置定位50
      y = 50;
    }
  } else {
    // 设置矩形的y轴坐标
    y = 35;
  }
  // 画矩形
  rect(25, y, 50, 30);
}

运行上述代码,点击键盘上的向上和向下按键,你会看到矩形的位置会发生变化。细心观察,你可以看到,判断功能键的语句,使用的是key == CODED语句,而判断具体的功能键,则需要使用变量keyCode

2、键盘事件:

和鼠标类似,键盘也有事件。但相比于鼠标来说,键盘的事件就少了许多,只有两个,分别是按下和抬起:

  • keyPressed()
  • keyReleased()

使用方式和鼠标事件类似,每当键盘有按键被按下或抬起的时候,键盘事件就会被系统调用,而且调用的次数只有一次,比如不管某个按键按多久,按下事件只会触发一次。我们还是举例来说明,看看到底如何使用

// 定义是否显示图形的布尔变量
boolean drawT = false;
// 环境初始化。
// 此方法在软件启动时,被系统调用一次。
void setup() {
  // 初始化窗口大小
  size(100, 100);
  // 清空填充色 
  noStroke();
}
// 画图。
// 此方法被系统默认循环调用。
void draw() {
  // 设置背景色。
  // 由于是在draw()方法中设置背景色,
  // 所以背景色会被不停的刷新。
  background(204);
  // 如果布尔变量为true,
  // 则画出T图形
  if (drawT == true) {
    // 画出横向矩形
    rect(20, 20, 60, 20);
    // 画出纵向矩形
    rect(39, 40, 22, 45);
  }
}
// 当键盘某个按键按下时,
// 系统会触发键盘按下事件,
// 并调用此方法。此方法只会被调用一次。
void keyPressed() {
  // 如果按下是T或t,
  // 则将drawT布尔变量改为true
  if ((key == 'T') || (key == 't')) {
    // drawT变量设为true,
    // 随后屏幕上将画出T图形
    drawT = true;
  }
}

参考:

http://ohcoder.com/blog/2016/03/26/processing-fun-mouse/

http://ohcoder.com/blog/2016/03/27/processing-fun-keyboard/

猜你喜欢

转载自blog.csdn.net/liuxiao723846/article/details/82051007