我的processing学习笔记

楼主作为一个纯粹的工科男，却阴差阳错到了机关坐办公室，沦落为天天写材料为生，内心实在是千万个草泥马在狂奔。为了保持工科男的本性，也为了不被这些无聊的材料压成神经病，决定给自己找点乐趣。去年先是接触了一下arduino，编程完成了一个遥控小车，利用appinventor编了个手机遥控软件，基本实现了在手机屏幕上画图形，小车就在地上按画的路径行走。开始心挺大，想进一步学习做个小四轴，自平衡小车，激光雕刻机等，但是由于现在每天下班第一任务是陪孩子玩，加之学习硬件还是比较烧钱，结果就荒废了。上个月无意中发现了processing，又看了一些大神的作品，觉得很有意思，而且学习软件比学习硬件时间上比较灵活（比如每天中午可以学习半小时），所以决定学习一下，丰富一下自己的业余生活。为了避免再次半途而废特开此贴记录过程（不过还是很难说，哈哈）。

今天先补上前段时间零星学习的内容：

学习用教材：《爱上processing》、《代码本色》。

一、已学习的常用简单命令

1.设置屏幕尺寸：size（宽，高）；

2.画点：point（x，y）；

3.划线：line（x1,y1,x2,y2）;

4.画三角形：triangle（x1,y1,x2,y2,x3,y3）;

5.四边形：quad（x1,y1,x2,y2,x3,y3,x4,y4）；

6.角度换算为弧度：radians（角度）；

7.长方形：rect（x，y，宽，高）；

8.椭圆:ellipse(x,y,宽，高)；//目前用这个命令用的最多，嘿嘿

9.平滑曲线：smooth（）；

10.关闭平滑曲线：noSmooth();

11.设置线宽：strokeWeight(x);

12.背景颜色：background(x,x,x);//只填一个参数为灰度，0为黑255为白；填三个参

数为RGB颜色

13.fill（x,x,x,x）//颜色同上，第四个参数为透明度

14.鼠标当前坐标：mouseX,mouseY

15.上一帧鼠标坐标：pmouseX,pmouseY

16.测量两点之间的距离：dist（x1,y1,x2,y2）;

17.mousePressed:布尔量，鼠标按下后为真（true，false）

18.mouseButton:返回值：LEFT,CENTER,RIGHT 用来判断哪个键按下

。。。。。

还有一些图形命令，目前用的还很少，暂时没学。

二、编程格式

1.首先创建不在setup（）和draw（）函数的变量（全局变量）

2.setup（）{…};内的命令执行一遍

3.draw(){…}; 内的命令持续执行

三、面向对象编程

由于《代码本色》完全用的是面向对象的编程方式，而本人大学时学的计算机语言是老掉牙的FORTRAN，基本上就没听说过面向对象的编程，只有重新学习面向对象的编程方法，不过学习了两天，试着编了几个小程序，发现这种编程方法确实很强大。这里就照搬一下《爱上processing》里的描述,具体的还是得自己编几个程才能体会：

class xxx //1.创建一个类

{

int x；//2.添加值域

。。。

float y;

xxx（参数1，参数2.。。。。）//3.添加构建函数

{

…..

}

void xxxx() //4.添加方法

{

…..

}

…

void yyyyy() //

{

…..

}

}

5.用类声明一个对象：

xxx aa；

6.创建对象并传递参数

aa=new xxx；

先发几个前段时间练习的小程序：

1.弹球：一个小球在屏幕里弹来弹去：

class BouncBall

{

float x;

float y;

int d;

float xspeed;

float yspeed;

BouncBall(float tempX,float tempY,int tempD,float tempXspeed,float tempYspeed) {

x=tempX;

y=tempY;

d=tempD;

xspeed=tempXspeed;

yspeed=tempYspeed;

}

void move()

{

y+=yspeed;

if(x>width||x

{

xspeed=xspeed*-1;

}

if(y>height||y

{

yspeed=yspeed*-1;

}

}

void display()

{

ellipse(x,y,d,d);

}

}

BouncBall ball;

void setup()

{

size(480,480);

smooth();

ball=new BouncBall(width/2,height/2,20,2,2.5);

}

void draw()

{

ball.move();

fill(255,10);

rect(0,0,width,height);

fill(255,0,0);

ball.display();

}

2.加强版弹球，想起以前玩的一个弹砖块的游戏，试着编了一个不完全版的class BouncBall

{

float x;

float y;

int d;

float xspeed;

float yspeed;

BouncBall(float tempX,float tempY,int tempD,float tempXspeed,float tempYspeed) {

x=tempX;

y=tempY;

xspeed=tempXspeed;

yspeed=tempYspeed;

}

void move(bangbang bang1)

{

x+=xspeed;

y+=yspeed;

if(x>width||x

{

xspeed=xspeed*-1;

}

if((y>(height-30)&&(mouseX

xspeed=xspeed+(mouseX-pmouseX)*0.1;

yspeed=yspeed*(-1);

}

if(y

{

yspeed=yspeed*(-1);

}

}

void crash(brick bb,BouncBall BB)

{

if(dist((bb.x+bb.w/2),(bb.y+bb.h/2),BB.x,BB.y)<(23+BB.d/2))

{

BB.yspeed=BB.yspeed*-1;

bb.x=0;

bb.y=0;

bb.w=0;

bb.h=0;

}

}

void display()

{

ellipse(x,y,d,d);

}

}

class bangbang

{

int ShapeWidth;

//int ShapeHeight;

//float x;

//float y;

//int x;

bangbang(int tempW)

{

//x=tempx;

ShapeWidth=tempW;

}

void display()

{

fill(0);

rect(mouseX,height-20,ShapeWidth,10);

}

}

class brick

{

float x;

float y;

float w;

float h;

brick(float tmpx,float tmpy,float tmpw,float tmph) {

x=tmpx;

y=tmpy;

w=tmpw;

h=tmph;

}

void display()

{

fill(100);

stroke(255);

rect(x,y,w,h);

}

}

BouncBall ball;

bangbang bang;

brick[] bks;//=new brick[24];

void setup()

{

size(480,480);

smooth();

ball=new BouncBall(width/2,height/2,20,2,2.5);

bang=new bangbang(120);

bks=new brick[24];///

int k=0;

for(int i=0;i<6;i++)

{

for(int j=0;j<4;j++)

{

bks[k]=new brick(i*80,j*20,80,20);

k++;

}

}

}

void draw()

{

for(int i=0;i

{

bks[i].display();

ball.crash(bks[i],ball);

}

ball.move(bang);

fill(255,10);

noStroke();

rect(0,0,width,height-20);

noStroke();

fill(255,255);

rect(0,height-20,width,20);

fill(255,0,0);

//stroke(255);

ball.display();

bang.display();

}

3.学习使用noise（）函数，修改自《代码本色》中的一个例子：一个随机游走的小球，颜色随时间变化

class Walker{

float x,y;

float tx,ty;

float r,b,g;

float tr,tb,tg;

Walker()

{

tx=0;

ty=10000;

tr=0;

tb=1000;

tg=2000;

}

void step()

{

x=map(noise(tx),0,1,0,width);

y=map(noise(ty),0,1,0,height);

tx+=0.01;

ty+=0.01;

}

void c() //color

{

r=map(noise(tr),0,1,0,255);

b=map(noise(tb),0,1,0,255);

g=map(noise(tg),0,1,0,255);

tr+=0.01;

tb+=0.01;

tg+=0.01;

}

}

Walker w;

void setup()

{

size(480,480);

w=new Walker();

}

void draw()

{

w.step();

w.c();

fill(w.r,w.b,w.g);

ellipse(w.x,w.y,20,20);

}

4.学习《代码本色》后编的两个相互吸引运动的小球，在边界会转到另一边去：class Mover

{

PVector location1,location2;

PVector v1,v2;

PVector acceleration1,acceleration2;

Mover()

{

location1=new PVector(random(width),random(height)); v1=new PVector(random(-2,2),random(-2,2)); acceleration1=PVector.random2D();

location2=new PVector(random(width),random(height)); v2=new PVector(random(-2,2),random(-2,2)); acceleration2=PVector.random2D();

}

void update()

{

// PVector mouse=new PVector(mouseX,mouseY); PVector dir1=PVector.sub(location2,location1); PVector dir2=PVector.sub(location1,location2);

dir1.normalize();

dir1.mult(0.5);

acceleration1=dir1;

v1.add(acceleration1);

v1.limit(10);

location1.add(v1);

//acceleration2=PVector.mult(dir1,-0.1);

dir2.normalize();

dir2.mult(0.5);

acceleration2=dir2;

v2.add(acceleration2);

v2.limit(10);

location2.add(v2);

}

void display()

{

stroke(0);

fill(175);

ellipse(location1.x,location1.y,16,16);

ellipse(location2.x,location2.y,16,16);

}

void checkEdges()

{

if(location1.x>width)

{

location1.x=0;

}

else if(location1.x<0)

{

location1.x=width;

}

if(location1.y>height)

{

location1.y=0;

}

else if(location1.y<0)

{

location1.y=height;

}

}

}

Mover mover;//s=new Mover[5];

void setup()

{

mover=new Mover();

size(480,480);

smooth();

//mover.acceleration.x=0.05;

//mover.acceleration.y=0.05;

}

void draw()

{

mover.update();

mover.checkEdges();

mover.display();

}

5.学习数组，把上面两个小球的改为任意个数小球：

int geshu=20; //修改个数，可实现任意多小球相互运动，边界条件随机。

class Mover

{

PVector[] location=new PVector[geshu];

PVector[] v=new PVector[geshu];

PVector[] acceleration=new PVector[geshu];

Mover()

{

for(int i=0;i

{

location[i]=new PVector(random(width),random(height));

v[i]=new PVector(random(-2,2),random(-2,2));

acceleration[i]=PVector.random2D();

}

}

void update()

{

for(int i=0;i

{

PVector dir=new PVector(0,0);

for(int j=0;j

{

if(i==j)

{

}

else

{

PVector tempdir=PVector.sub(location[j],location[i]);

dir.add(tempdir);

}

}

dir.normalize();

dir.mult(0.5);

acceleration[i]=dir;

v[i].add(acceleration[i]);

v[i].limit(10);

}

for(int i=0;i

{

location[i].add(v[i]);

}

}

void display()

{

stroke(0);

fill(175);

for(int i=0;i

{ellipse(location[i].x,location[i].y,16,16);

//ellipse(location2.x,location2.y,16,16);

}

}

void checkEdges()

{

for(int i=0;i

{

if(location[i].x>width)

{

location[i].x=0;

}

else if(location[i].x<0)

{

location[i].x=width;

}

if(location[i].y>height)

{

location[i].y=0;

}

else if(location[i].y<0)

{

location[i].y=height;

}

}

}

}

Mover mover;

void setup()

{

size(480,480);

mover=new Mover();

smooth();

//mover.acceleration.x=0.05;

//mover.acceleration.y=0.05;

}

void draw()

fill(255,10);

rect(0,0,480,480);

mover.display();

mover.update();

mover.checkEdges();

}

6.继续练习数组，在网上看到一个画图连线的教程，修改了一下：int geshu=30; //设置把圆周等分成的份数

int radius=240; //设置圆的半径

class yuan

{

PVector point[]=new PVector[geshu];

float angle;

yuan()

{

angle= TWO_PI/geshu;

for(int i=0;i

{

float x = cos(angle * i ) * radius;

float y = sin(angle * i ) * radius;

point[i] = new PVector(x,y);

}

}

void drawline()

{

smooth();

strokeWeight(0.5);

for(int i=0;i

{

for(int j=i+1;j

{

line(point[i].x,point[i].y,point[j].x,point[j].y);

}

}

}

}

yuan yuan1;

void setup()

{

size(480,480);

yuan1=new yuan();

}

int k=0;

void draw()

{

rect(0,0,width,height);

int i=k;

i++;

k=i;

translate(width/2,height/2);

rotate(0.05*i); //实现旋转，去掉可画静态图片yuan1.drawline();

//line(0,0,width,height);

}

7.继续数组，画个正弦波：

int geshu=314;

class sinx

{

PVector point[]=new PVector[geshu];

sinx(float str)

{

for(int i=0;i

{

float x=TWO_PI/geshu*i;

float y=sin(x+str);

x=map(x,0,TWO_PI,0,width);

y=map(y,-1,1,-(height/2),height/2);

point[i]=new PVector(x,y);

}

}

void drawline()

{

smooth();

strokeWeight(0.5);

for(int i=0;i

{

line(point[i].x,point[i].y,point[i].x,0);

}

}

}

sinx sinx1;

void setup()

{

size(480,240);

sinx1=new sinx(0);

}

int k=0;

void draw()

{

rect(0,0,width,height);

int i=k;

i++;

k=i;

translate(0,height/2);

sinx1=new sinx(i*TWO_PI/geshu); sinx1.drawline();

}

好了，先把以前学的先记着这儿了。