基于processing的交互动态绘画系统

最新推荐文章于 2022-10-16 01:44:23 发布

DQjklll

最新推荐文章于 2022-10-16 01:44:23 发布

阅读量9.8k

点赞数 11

文章标签： processing 动态交互

本文链接：https://blog.csdn.net/sinat_41802987/article/details/85391153

版权

本文介绍了一个基于processing的交互动态绘画系统，包括Cell、Grow、Float、Line、Ink和Leaves等六种独特笔刷，实现了颜色选择、清屏及声音交互功能。系统展示了数学在动态绘画中的应用，如随机生长模拟、动态粒子漂浮等，强调了数学公式在动态效果中的重要性，并探讨了代码实现和绘画新可能性。

摘要由CSDN通过智能技术生成

关于绘画

我认为绘画就是将自己的意识与思想通过一些手段呈现在载体上的作品，这种呈现方式可以是多种多样的，不论是用画笔涂鸦，颜料泼洒，或者是通过手势肢体控制，只要倾注了自己的感情自己的想法，那么就是一张绘画作品，如果能给自己带来愉悦，那就是一张完美的绘画作品，如果这张作品不仅能给自己带来愉悦还能给别人带来愉悦或者说是带来联想，那就是一张非常优秀的绘画作品了。

这次的绘画系统结合了一些交互动态的效果，可以看到绘画更多的可能性以及变化性。

一、系统展示与实现

1.整体界面与展示

主要完成的是一个基于processing的笔刷绘制系统，
有交互式笔刷，有动态性的笔刷，还有装饰性笔刷，以及模仿性笔刷。

可以选择颜色，也可以清空屏幕。
同时除了背景音乐之外，点击也会有声音的交互。

实现了按钮以及滑动条的功能。在这里插入图片描述

2.笔刷展示与实现

笔刷1： Cell：

在这里插入图片描述

这个笔刷最主要可以体现这个系统的交互性，首先它是可以根据这个processing的绘画系统上的选择颜色按键来选择颜色的，点击这个画笔后，可以再画布上进行点击，每点击一次都会出现一个细胞，再点击的话如果这两次点击的距离比260短，就会将他们进行连线。同时这些细胞会有规律的“呼吸”，是根据cos值来调节收缩速度的。


class Circle {
   
  float x, y;
  Circle(float x, float y) {
   
    this.x = x; 
    this.y = y;
  }
 
  void show() {
   
    pushMatrix();
    noStroke();
    fill(0, 100);
    float lfo1 = cos(frameCount*0.1)*10;
    ellipse(x, y, 20+lfo1, 20+lfo1);
    popMatrix();
    pushMatrix();
    fill(brushColor);
    ellipse(x, y, 16, 16);
    noFill();
    stroke(brushColor);
    strokeWeight(4);
    float lfo2 = cos(frameCount*0.05)*25;
    circlePoint(x, y, 100+lfo2, 10);
    popMatrix();
  }
  
  void circlePoint(float x, float y, float d, int c){
   
   float da = TWO_PI/c; 
   strokeCap(SQUARE);
   for(int i = 0; i < c; i++){
   
      arc(x, y, d, d, da*i, da*(i+0.5)); 
   }
}
}

笔刷2： Grow:

在这里插入图片描述
这个笔刷模拟了生长效果
每次点击产生的生长点种子是随机颜色的，同时它的半径会逐渐变大，这个粒子是单独写了一个类来进行模拟的，然后在这个笔刷的函数中进行判定，如果mousepressd在鼠标的位置进行粒子的实例化来完成个数增加。
这个生长粒子的类进行了行为的规定，其中用了noise函数来进行角度增加的随机，还有cos值与sin值来进行更多情况的模拟。

  for (int i = 0; i < cant; i++) {
   
    Particula aux = (Particula) p.get(i);
    aux.act();
    if (aux.tam > 60) {
   
      p.remove(i);
      i--;
      cant--;
    }
  }

class Particula {
   
  float x, y, ang, tam;
  color col,