![]()
鼠标和键盘事件的参数化绘图
最简单的互动系统为“输入-处理-输出”,最基本的输入是鼠标和键盘,下面是我用Processing实验的一个简单互动系统,程序输出的是一张脸,它的眼睛会时刻注视着鼠标的位置,它的嘴巴在你敲击键盘的时候会显示为相应的字母,利用这个系统你可以扩展出很多有趣的互动程序。下面是完整的源代码,尽情发挥你的想象力吧。
(好像可以拿Scratch做哟)
- void setup() {
- size(300, 300);
- strokeWeight(3);
- ellipseMode(RADIUS);
- }
-
- void draw() {
- background(255);
-
- face(width/2, height/2);
- mouth(width/2, height/2+80);
- eye(width/2-50, height/2-30); //左眼
- eye(width/2+50, height/2-30); //右眼
- }
-
- //绘制脸
- void face(float x, float y) {
- stroke(0);
- fill(#fbb03b);
- ellipse(x, y, 120, 120);
- }
-
- //绘制嘴巴
- void mouth(float x, float y) {
- fill(0);
- textAlign(CENTER);
- textSize(60);
- text(key, x, y);
- }
-
- //绘制眼球
- void eye(float x, float y) {
- float r1 = 30; //眼白半径
- float r2 = 10; //瞳孔半径
-
- //绘制眼白
- stroke(0);
- fill(255);
- ellipse(x, y, r1, r1);
-
- //根据鼠标位置计算瞳孔的位置
- float dx = mouseX - x; //鼠标到眼球的x坐标差
- float dy = mouseY - y; //鼠标到眼球的y坐标差
- float R = r1 - r2; //瞳孔偏移的最大半径
- float D = width; //鼠标到眼球的最远距离
- x += dx * R/D; //瞳孔偏移后的x坐标
- y += dy * R/D; //瞳孔偏移后的y坐标
-
- //绘制瞳孔
- noStroke();
- fill(0);
- ellipse(x, y, r2, r2);
- }
复制代码
授权转载自 任远媒体实验室
|
那样肯定好玩~
要是同时出现两个人,;P