博客简介
最近出于兴趣爱好，在学习Processing创意编程。此篇博客用来记录我学习Processing创意编程的基础知识，在我学习Processing的过程中，我会持续修改、更新这篇博客。运用Processing写的一些有趣的小项目，会更新在Procesing专栏的其他文章中。
什么是Processing
Processing是一门由Java开发的编程语言，用来生成图片、动画和交互软件的编程语言，专门为电子艺术和视觉交互设计而创建，用于表达数字创意。
下载Processing
Processing安装和使用
下载好压缩包后，IDE无需我们自己安装，解压得到一个文件夹如下：
打开这个文件夹，找到processing.exe直接双击就能运行，为了使用方便使用，可以发送processing.exe快捷键到桌面。
IDE界面
Processing编译器的界面非常整洁，方便用户使用。
左上角的播放键和停止键是最常用的。
基础知识篇
函数setup和函数draw
setup是启动程序时用到的代码，可以理解为入口函数。draw是程序持续运行的代码，也就是程序的主体部分，比如哪里有图像出现、哪里有颜色变化，就可以将代码写在这个函数里面。
播放窗口
点击播放键，会出现一个灰色小窗口，就是processing播放界面，它默认大小是100x100像素：
也可以通过代码设置播放窗口大小。
属性size
用来设置播放窗口大小，比如将播放窗口设置为400x400像素大小：
void setup(){
size(400,400);
}
void draw(){
}
注意命令后有一个英文分号，写完每个命令后都要加英文分号作为结尾，否则会报错。
设置背景色
设置背景色的代码是持续运行的，所以要写在draw函数里面，processing使用的色彩模式是RGB 255模式，RGB 255模式中红绿蓝三种基本色会分别以0-255之间的数字表示，三种基本色可以混合成超过1600万种颜色。
设置背景色的命令是background，
void setup(){
size(400,400);
}
void draw(){
background(255,0,0);
}
考虑到很多颜色的RGB值我们是不知道的，processing给我们提供了一个很好用的工具——颜色选择器，在工具——》颜色选择器就能找到，我们可以选择自己喜欢的颜色，然后它会显示颜色的RGB值。
绘制图形
1.绘制矩形
命令为rect
如图：左上角坐标为（0，0），绘制矩形命令为rect(100,50,100,20)，以左上角为参考，表示该矩形在x轴上坐标为100，在y轴上坐标是50，长100，宽20。
2.绘制椭圆形（或者圆形）
命令是ellipse。
如：ellipse(300,200,100,200)
表示这个椭圆圆心x轴坐标是300，y轴坐标是200，椭圆宽是100，高是200。
println()
变量
- 全局变量
- 局部变量
//定义一个全局变量
int xpos = 0;
void setup(){
size(800,800);
}
void draw(){
background(255,255,255);
rect(xpos,100,50,50);
// 需求：通过增加xpos的值让小方块运动起来
xpos = xpos + 1;
println(xpos);
}
参数mouseX，mouseY
这两个参数可以让图形跟随鼠标移动。
设置一个矩形：
rect(mouseX,mouseY,50,50)
运行时，这个矩形的位置将会随鼠标变化。
UleadGIFAnimator5.10软件压缩动图。
以上是鼠标交互
下面学习键盘交互
函数keyPressed
当按下任意键盘上一个键时，函数会被执行。
注意P是大写。
函数中可以使用变量key，key是Processing程序中的预制变量，它记录的是我们的按键信息。
示例：运行代码后，随意点击一个按键，矩形将向右移动两个像素。
int xpos = 0;
void setup(){
size(800,800);
}
void draw(){
background(255,255,255);
rect(xpos,0,50,50);
}
void keyPressed(){
println(key);
xpos = xpos + 2;
}
如果想按下特定按键时对象向特定方向移动，比如玩游戏时wasd移动人物那种，需要学习processing中的if条件语句。
if条件语句
当预制变量（记录按键信息的一个系统自带变量）等于d时，矩形xpos会向右移动2个像素。
void keyPressed(){
println(key);
if(key == 'd'){
xpos = xpos + 2;
}
}
如何在Processing中加载图片
1.速写本——》打开程序目录
能看见一个.pde文件，这是我们正在编辑的文件。
2.在该文件夹新建一个文件夹，名为data，注意名称一定为英文小写。
3.将想用的图片拷贝到data文件夹下
4.定义全局变量PImage bunny;
5.用image属性将图片加载到屏幕
image有三个参数，第一个是图片，二三是位置参数。
例如：image(bunny,0,0)
表示将图片bunny加载到（0，0）位置。
可以自定义图片宽度和高度，在image中设置第四个和第五个参数即可。
PImage bunny;
void setup(){
size(800,800);
bunny = loadImage("bunny.png");
}
void draw(){
background(0,255,0);
image(bunny,0,0,100,100);
}
将兔子的坐标设置为image(bunny,mouseX,mouseY,200,200);，兔子会跟随我们鼠标移动。
属性imageMode(CENTER)
可以将锚点从（0，0）改为鼠标所在位置。
随机数random
random(a,b)可以产生a到b之间的随机数，我们可以使用随机数设置加载图片的大小和出现位置。
1.加载兔子和萝卜图片：
2.设置加载图片大小随机，出现位置随机
运行一下，查看效果:随机产生了很多大小不一、位置不一的兔子。
