processing艺术编程语言杂谈

归去来兮的百宝箱

已于 2023-04-16 19:32:03 修改

阅读量170

点赞数

分类专栏：科技杂谈文章标签：笔记

于 2023-04-16 19:31:34 首次发布

本文链接：https://blog.csdn.net/m0_53475159/article/details/130186657

版权

科技杂谈专栏收录该内容

6 篇文章 1 订阅

订阅专栏

前天帮个学艺术的朋友看了一看processing语言，简单学习了点东西，修改了点小bug，发现比传统的语言清晰的多。

不多阐述，直接代码上图！


Rect rect; // 正方形的 Rect 对象
boolean dragging = false; // 是否正在拖拽
ArrayList<Rect> netList = new ArrayList<Rect>();
ArrayList<Rect> rectList = new ArrayList<Rect>();

ArrayList<Integer> randomList = new ArrayList<Integer>();
ArrayList<String> colStrList =  new ArrayList<String>();
ArrayList<String> rowStrList =  new ArrayList<String>();
int widthSize =73;
int heightSize =97 ;
int startX = 55;
int endX = 640;
int startY  =65;
int endY = 840;
int imageSize =150;

int moveIndex =-1;
PFont font;
Rect  r5298;
Rect  r5297;
Rect  r5296;
Rect  r5295;
Rect  r5294;
Rect  r5293;
Rect  r5292;
Rect  r5291;
Rect  r5290;
Rect  r5289;
Rect  r5288;
PImage image ;
int FPS = 60;
double springConstant = 0.1;
double naturalLength = 20;


void setup() {
  size(702, 992);
  init();
 if (keyPressed) {
    if (key == 'b' || key == 'B') {
        init();
    }
 
}
}
  
  


void init(){

  //rect = new Rect(100, 100, 50); // 创建正方形对象
  int x =54;
  int y =65;

  colStrList.add("喜悦,happy");
  colStrList.add("平和,gentle");
  colStrList.add("骄傲,arrogant");
  colStrList.add("沮丧,dispirited");
  colStrList.add("懊悔,arrogant");
  colStrList.add("自卑,arrogant");
  colStrList.add("愧疚,ashamed");

  rowStrList.add("愉悦,ashamed");
  rowStrList.add("从容,calm");
  rowStrList.add("冷淡,cold");
  rowStrList.add("愤怒,angry");
  rowStrList.add("自责,remorse");
  rowStrList.add("焦虑,remorse");
  rowStrList.add("恐惧,fear");
  rowStrList.add("悲伤，sad");
  rowStrList.add("羞愧,ashamed");
  for (int i=0; i<8; i++) {
    for (int j=0; j<8; j++) {
      netList.add(new Rect(x, y));
      if (j==7) {
        x=54;
        y+=heightSize;
      } else {
        x+= widthSize;
      }
    }
  }

  r5288 = new Rect(110, endY-180-138, "IMG_5288.PNG");
  r5288.image.resize((imageSize+20)-40, imageSize-30);
  r5289 = new Rect(220, endY-180, "IMG_5289.PNG");
  r5289.image.resize((imageSize+20)+40, imageSize+40);
  r5290 = new Rect(120+50, endY-180-120, "IMG_5290.PNG");
  r5291 = new Rect(120+300, endY-180+80, "IMG_5291.PNG");
  r5291.image.resize((imageSize+20)/3*2, imageSize/3*2);
  r5292 = new Rect(155, endY-180+30, "IMG_5292.PNG");
  r5292.image.resize((imageSize+20)+20, imageSize+20);
  r5293 = new Rect(120+215, endY-180+25, "IMG_5293.PNG");
  r5294 = new Rect(120+160, endY-180-60, "IMG_5294.PNG");
  r5295 = new Rect(120+380, endY-120, "IMG_5295.PNG");
  r5295.image.resize((imageSize+20)-20, imageSize-20);
  r5296 = new Rect(140, endY-180-40, "IMG_5296.PNG");
  r5297 = new Rect(120-50, endY-120, "IMG_5297.PNG");
  r5298 = new Rect(120-70, endY-200, "IMG_5298.PNG");

  rectList.add(r5290);
  rectList.add(r5288);
  rectList.add(r5291);
  rectList.add(r5293);

  rectList.add(r5294);
  rectList.add(r5295);
  rectList.add(r5296);
  rectList.add(r5289);
  rectList.add(r5292);




  rectList.add(r5298);
  rectList.add(r5297);
  //初始化角度数组
  for (int i = 0; i<rectList.size(); i++) {
    int num =(int)random(-4, 4);
    while (num==0) {
      num =(int)random(-4, 4);
    }
    randomList.add(num);
  }
  image =  loadImage("back.png");
  image.resize(702, 992);
  添加物品


}



void draw() {


  background(image);




  //rectList.forEach(rect-> {
  //  // 更新正方形的位置和形态

  //  rect.displayImage();
  //}

  //);


  // imageMode(CORNER) → imageMode(CENTER)：
  //centerX = cornerX + width/2
  //centerY = cornerY + height/2
  //imageMode(CENTER) → imageMode(CORNER)：
  //cornerX = centerX - width/2
  //cornerY = centerY - height/2
  float centerX =0
    , centerY =0; // 正方形的中心点坐标
  float radius = 300; // 正方形反向运动的半径
  float speed = 0.5; // 正方形反向运动的速度
  float angle = 0; // 正方形反向运动的初始角度
  滑动
  //for (int i=0; i<rectList.size(); i++) {

  //  //比较图中心和鼠标的距离
  //  float x = rectList.get(i).x+ rectList.get(i).image.width/2;
  //  float  y = rectList.get(i).y+ rectList. get(i).image.height/2;
  //  //距离小于10
  //  if (dist(x, y, mouseX, mouseY)<radius) {




  //  }else{
  //    image(rectList.get(i).image, rectList.get(i).x, rectList.get(i).y);
  //  }
  //}

  //拖拽
  for (int i=0; i<rectList.size(); i++) {

    //比较图中心和鼠标的距离
    float dx = rectList.get(i).x+ rectList.get(i).image.width/2;
    float  dy = rectList.get(i).y+ rectList. get(i).image.height/2;

    if (moveIndex==i&&isResult==false) {
      pushMatrix();
      imageMode(CENTER);
      float x = mouseX;
      float y = mouseY;

      if (x-rectList.get(i).image.width/2<=startX) {
        x =startX+rectList.get(i).image.width/2;
      }

      if (x+rectList.get(i).image.width/2>=endX) {
        x =endX-rectList.get(i).image.width/2;
      }

      if (y-rectList.get(i).image.height/2<=startY) {
        y =startY+rectList.get(i).image.height/2;
      }

      if (y+rectList.get(i).image.height/2>=endY) {
        y =endY-rectList.get(i).image.height/2;
      }

      translate(x, y);

      //rotate(frameCount*0.1);
      angle = sin(frameCount * angleStep) * 0.5;  // 计算旋转角度
      rectList.get(i).angle =angle;
      rotate(angle);  // 旋转图片
      //float sinVal = sin(frameCount*0.2); // 计算周期性变化的值
      //yOffset = sinVal*50; // 用sin值来设置Y轴偏移量
      image(  rectList.get(i).image, 0, 0);
      imageMode(CORNER);
      popMatrix();
      rectList.get(i).x = x-    rectList.get(i).image.width/2;
      rectList.get(i).y = y-    rectList.get(i).image.height/2 ;
    } else {
      //距离小于10
      if (dist(dx, dy, mouseX, mouseY)<radius&&isResult==false) {

        float sinVal = sin(frameCount * angleStep);
        // 用sin值来设置Y轴偏移量
        yOffset = sinVal * 20;

        rectList.get(i).x+=randomList.get(i);
        // 绘制图片
        image(rectList.get(i).image, rectList.get(i).x, rectList.get(i).y+yOffset);


        if ( rectList.get(i).x<=startX) {
          rectList.get(i).x =startX;
        }

        if ( rectList.get(i).x+rectList.get(i).image.width>=endX) {
          rectList.get(i).x =endX-rectList.get(i).image.width;
        }


        if ( rectList.get(i).y<=startY) {
          rectList.get(i).y =startY;
        }

        if ( rectList.get(i).y+rectList.get(i).image.height>=endY) {
          rectList.get(i).y =endY-rectList.get(i).image.height;
        }
      } else {


        //原本存放的是默认模式，转center模式要转换
        pushMatrix();
        imageMode(CENTER);
        translate(rectList.get(i).x+ rectList.get(i).image.width/2, rectList.get(i).y+ rectList.get(i).image.height/2);
        rotate(rectList.get(i).angle);  // 旋转图片
        //float sinVal = sin(frameCount*0.2); // 计算周期性变化的值
        //yOffset = sinVal*50; // 用sin值来设置Y轴偏移量
        image( rectList.get(i).image, 0, 0);
        imageMode(CORNER);
        popMatrix();
      }
    }
  }
  
  //time
  if(isResult){
    
  int elapsedTime = millis() - startTime;
  int secondsRemaining = countdown - int(elapsedTime / 1000);
  if (secondsRemaining >= 0) {
    textAlign(CENTER, CENTER);
    fill(0);
      font =createFont("HYQiHei_65S.ttf",15);
      textFont(font);

    text(row*(12.5)+"% "+rowStrList.get(row).split(",")[0],startX+row*widthSize,startY);
     text(row*(12.5)+"% "+rowStrList.get(row).split(",")[1],startX+row*widthSize,startY+35);
    
       text(col*(15)+"% "+colStrList.get(col).split(",")[0],endX,startY+col*heightSize);
        text(col*(15)+"% "+colStrList.get(col).split(",")[1],endX,startY+col*heightSize+35);
  } else {
      rectList.remove(moveIndex);
      moveIndex=-1;
      isResult=false;
  }
    
  }
  
}
float angle = 0;  // 初始旋转角度
float angleStep = 0.05;  // 旋转角度的步长
float yOffset = 0; // Y轴偏移量
int resultNum = -1;


void mousePressed() {

  );
  for (int i = 0; i<rectList.size(); i++) {
    if (rectList.get(i).contains(mouseX, mouseY)) {
      moveIndex =i;
    }
  }
}
boolean isResult =false;
int startTime;
int countdown = 5;
int row;
int col;
void mouseReleased() {

  if (moveIndex!=-1) {

    float xDivide = (rectList.get(moveIndex).x-startX)/widthSize;
    float xMore = ((rectList.get(moveIndex).x-startX))%widthSize;

    float yDivide = (rectList.get(moveIndex).y-startY)/heightSize;
    float yMore =(rectList.get(moveIndex).y-startY)%heightSize;
    println("--------------------");
    println(xDivide);
    println(xMore);
    println(yDivide);
    println(yMore);
    println("--------------------");
    if (checkNum(xDivide, xMore)&&checkNum(yDivide, yMore)) {
      isResult =true;
      println("ok");
      row = (int)xDivide;
      col = (int)yDivide;
      println(rowStrList.get(row));
      println(colStrList.get((int)yDivide));
      startTime = millis();
      resultNum =moveIndex;
     
    } else {
      moveIndex = -1;
    }
  }
}

boolean checkNum(float divide, float more) {
  if (more/heightSize<=0.3) {
    return  true;
  };

  return false;
}

// 正方形的类定义
class Rect {
  float x, y; // 位置
  int size; // 大小
  PImage image;
  float angle;
  boolean dragging =false;

  private double vx, vy;
  private double ax, ay;
  Rect(float x, float y, String imagePath) {
    this.x = x;
    this.y = y;
    this.size = 150;
    this.image = loadImage(imagePath);
    image.resize(size+20, size);

    this.vx = 0;
    this.vy = 0;
    this.ax = 0;
    this.ay = 0;
  }

  Rect(float x, float y) {
    this.x = x;
    this.y = y;
    this.size = size;
  }

  void display() {
    fill(255);
    rect(x, y, 73, 97); // 绘制正方形
  }

  void displayImage() {

    image(image, x, y); // 绘制正方形
  }

  boolean contains(float x, float y) {
    // 检查是否在正方形内部
    return x >= this.x && x <= this.x + image.width &&
      y >= this.y && y <= this.y + image.height;
  }
  //center模式
  void constrainPosition(float x1, float y1) {
    // 限制正方形的位置
    x1 = constrain(x, startX-image.width/2, endX-image.width/2);
    y1 = constrain(y, startY - image.height/2, endY - image.height/2);
  }


  public void applyForce(double fx, double fy) {
    // 应用力
    ax += fx;
    ay += fy;
  }

  public void update() {
    // 更新位置和速度
    vx += ax;
    vy += ay;
    x += vx;
    y += vy;

    // 重置加速度
    ax = 0;
    ay = 0;
  }
}
void mouseMoved(MouseEvent event) {
  // 获取鼠标坐标
  mouseX = event.getX();
  mouseY = event.getY();
}

简单学习了点东西，首先是结构体的定义

  Rect(float x, float y) {
    this.x = x;
    this.y = y;
    this.size = size;
  }

还是和传统的定义一样

然后是setup函数，每隔一定的时间段执行一次

void setup() {
  size(702, 992);
  init();
 if (keyPressed) {
    if (key == 'b' || key == 'B') {
        init();
    }
 
}
}

最后是实现出来的图

太逆天了！连学艺术的都要卷代码，做信号与通信的工科生马上自卑的起来。学海无涯，学无止境。快去卷吧！

归去来兮的百宝箱

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
processing艺术编程语言杂谈

前天帮个学艺术的朋友看了一看processing语言，简单学习了点东西，修改了点小bug，发现比传统的语言清晰的多。连学艺术的都要卷代码，做信号与通信的工科生马上自卑的起来。学海无涯，学无止境。然后是setup函数，每隔一定的时间段执行一次。简单学习了点东西，首先是结构体的定义。不多阐述，直接代码上图！还是和传统的定义一样。
复制链接

扫一扫