图像纹理

作者: 大龙10 | 来源:发表于2022-05-17 05:07 被阅读0次

    书名:代码本色:用编程模拟自然系统
    作者:Daniel Shiffman
    译者:周晗彬
    ISBN:978-7-115-36947-5
    目录

    4.13 图像纹理和加法混合

    1、粒子系统图像纹理

      既然谈到粒子系统,我们还是有必要探讨一下用粒子纹理化渲染图像的例子。在你在设计特效时,如何选择粒子的绘制方式往往是个难题。

      在开始编码前,我们应该先准备好纹理图像。我建议你使用PNG格式的图像,因为在绘制图像时,Processing会为你保留PNG的alpha通道(透明度),这是你将这些纹理作为粒子叠加渲染时所必须的。一旦你将PNG图像放到Sketch的data目录中,后续只要写少量代码就可以完成这个功能。

    2、示例

    示例代码4-8 粒子系统图像纹理

    ParticleSystem ps;
    
    void setup() {
      size(640,360);
      PImage img = loadImage("texture.png");
      ps = new ParticleSystem(0,new PVector(width/2,height-75),img);
    }
    
    void draw() {
      background(0);
      
      // Calculate a "wind" force based on mouse horizontal position
      float dx = map(mouseX,0,width,-0.2,0.2);
      PVector wind = new PVector(dx,0);
      ps.applyForce(wind);
      ps.run();
      for (int i = 0; i < 2; i++) {
        ps.addParticle();
      }
      
      // Draw an arrow representing the wind force
      drawVector(wind, new PVector(width/2,50,0),500);
    
    }
    
    // Renders a vector object 'v' as an arrow and a position 'loc'
    void drawVector(PVector v, PVector pos, float scayl) {
      pushMatrix();
      float arrowsize = 4;
      // Translate to position to render vector
      translate(pos.x,pos.y);
      stroke(255);
      // Call vector heading function to get direction (note that pointing up is a heading of 0) and rotate
      rotate(v.heading2D());
      // Calculate length of vector & scale it to be bigger or smaller if necessary
      float len = v.mag()*scayl;
      // Draw three lines to make an arrow (draw pointing up since we've rotate to the proper direction)
      line(0,0,len,0);
      line(len,0,len-arrowsize,+arrowsize/2);
      line(len,0,len-arrowsize,-arrowsize/2);
      popMatrix();
    }
    

    Particle.pde

    class Particle {
      PVector pos;
      PVector vel;
      PVector acc;
      float lifespan;
      PImage img;
    
      Particle(PVector l,PImage img_) {
        acc = new PVector(0,0);
        float vx = randomGaussian()*0.3;
        float vy = randomGaussian()*0.3 - 1.0;
        vel = new PVector(vx,vy);
        pos = l.get();
        lifespan = 100.0;
        img = img_;
      }
    
      void run() {
        update();
        render();
      }
      
      // Method to apply a force vector to the Particle object
      // Note we are ignoring "mass" here
      void applyForce(PVector f) {
        acc.add(f);
      }  
    
      // Method to update position
      void update() {
        vel.add(acc);
        pos.add(vel);
        lifespan -= 2.5;
        acc.mult(0); // clear Acceleration
      }
    
      // Method to display
      void render() {
        imageMode(CENTER);
        tint(255,lifespan);
        image(img,pos.x,pos.y);
        // Drawing a circle instead
        // fill(255,lifespan);
        // noStroke();
        // ellipse(pos.x,pos.y,img.width,img.height);
      }
    
      // Is the particle still useful?
      boolean isDead() {
        if (lifespan <= 0.0) {
          return true;
        } else {
          return false;
        }
      }
    }
    

    ParticleSystem.pde

    class ParticleSystem {
    
      ArrayList<Particle> particles;    // An arraylist for all the particles
      PVector origin;        // An origin point for where particles are birthed
      PImage img;
    
      ParticleSystem(int num, PVector v, PImage img_) {
        particles = new ArrayList<Particle>();              // Initialize the arraylist
        origin = v.get();                        // Store the origin point
        img = img_;
        for (int i = 0; i < num; i++) {
          particles.add(new Particle(origin, img));    // Add "num" amount of particles to the arraylist
        }
      }
    
      void run() {
        for (int i = particles.size()-1; i >= 0; i--) {
          Particle p = particles.get(i);
          p.run();
          if (p.isDead()) {
            particles.remove(i);
          }
        }
      }
    
      // Method to add a force vector to all particles currently in the system
      void applyForce(PVector dir) {
        // Enhanced loop!!!
        for (Particle p: particles) {
          p.applyForce(dir);
        }
      }  
    
      void addParticle() {
        particles.add(new Particle(origin, img));
      }
    
    }
    

    3、运行结果

    相关文章

      网友评论

        本文标题:图像纹理

        本文链接:https://www.haomeiwen.com/subject/adusurtx.html