Loading...
Logo
Processing Forum
Programming Questions
suhit
suhit

how to use image texture with curveVertex function

in Programming Questions  •  1 year ago  
can somebody help me how to add image texture over polygon object. I am stuck in this problem. Here is my code

// center point
float centerX = 0, centerY = 0;

float radius = 45, rotAngle = -90;
float accelX, accelY;
float springing = .0009, damping = .98;

//corner nodes
int nodes = 4;
float nodeStartX[] = new float[nodes];
float nodeStartY[] = new float[nodes];
float[]nodeX = new float[nodes];
float[]nodeY = new float[nodes];
float[]angle = new float[nodes];
float[]frequency = new float[nodes];

// soft-body dynamics
float organicConstant = 1;
PImage img;

void setup() {
  size(640, 360);
  //center shape in window
  img = loadImage("img.jpg");
  centerX = width/2;
  centerY = height/2;
  // iniitalize frequencies for corner nodes
  for (int i=0; i<nodes; i++){
    frequency[i] = random(5, 12);
  }
  noStroke();
  smooth();
  frameRate(30);
}

void draw() {
  //fade background
  fill(0, 100);
  rect(0,0,width, height);
  drawShape();
  moveShape();
}

void drawShape() {
  //  calculate node  starting locations
  for (int i=0; i<nodes; i++){
    nodeStartX[i] = centerX+cos(radians(rotAngle))*radius;
    nodeStartY[i] = centerY+sin(radians(rotAngle))*radius;
    rotAngle += 360.0/nodes;
  }

  // draw polygon
  curveTightness(organicConstant);
  fill(255);
  beginShape();
  //texture(img);
  for (int i=0; i<nodes; i++){
    curveVertex(nodeX[i], nodeY[i]);
  }
  for (int i=0; i<nodes-1; i++){
    curveVertex(nodeX[i], nodeY[i]);
  }
  endShape(CLOSE);
}

void moveShape() {
  //move center point
  float deltaX = mouseX-centerX;
  float deltaY = mouseY-centerY;

  // create springing effect
  deltaX *= springing;
  deltaY *= springing;
  accelX += deltaX;
  accelY += deltaY;

  // move predator's center
  centerX += accelX;
  centerY += accelY;

  // slow down springing
  accelX *= damping;
  accelY *= damping;

  // change curve tightness
  organicConstant = 1-((abs(accelX)+abs(accelY))*.1);

  //move nodes
  for (int i=0; i<nodes; i++){
    nodeX[i] = nodeStartX[i]+sin(radians(angle[i]))*(accelX*2);
    nodeY[i] = nodeStartY[i]+sin(radians(angle[i]))*(accelY*2);
    angle[i]+=frequency[i];
  }
}

Replies(3)

suhit
suhit

Re: how to use image texture with curveVertex function

1 year ago
does anyone know how to do it. pls help guys
amnon.owed
amnon.owed

Re: how to use image texture with curveVertex function

1 year ago
You can't use textures in combination with curveVertices. Only regular vertices allow you to specify texture coordinates. See the reference. So you have to explore alternative solutions:
  1. Use vertices instead. You can actually make very smooth shapes with triangulated surfaces.
  2. Use a quad but with a partly transparent texture.
  3. Use masks. See this solution by PhiLho.


suhit
suhit

Re: how to use image texture with curveVertex function

1 year ago
thanks amnon.owed, actually I wanted that softbody moving effects( see image below) on the object on mousemoveut somehow I have not been able to get those effects.
   





I have used vertex function and got the texture on the object but moving effects are not there. Is there any way to get those effects.

here is my output image and code



Copy code
  2. import processing.opengl.*;

  4. // center point
  5. float centerX = 0, centerY = 0;
  6. float radius = 45, rotAngle = -90;
  7. float accelX, accelY;
  8. float springing = .0009, damping = .98;

  10. //corner nodes
  11. int nodes = 4;

  13. float[][] pointArray = new float[nodes][2];
  14. float[][] imgArray = new float[nodes][2];
  15. float[]nodeX = new float[nodes];
  16. float[]nodeY = new float[nodes];
  17. float[]angles = new float[nodes];
  18. float[]frequency = new float[nodes];

  20. // soft-body dynamics
  21. float organicConstant = 1;
  22. PImage img;

  24. void setup() {
  25.   size(640, 480, OPENGL);
  26.   //center shape in window
  27.   centerX = width/2;
  28.   centerY = height/2;
  29.   img = loadImage("img.jpg");
  30.   
  31.   // iniitalize frequencies for corner nodes
  32.   for (int i=0; i<nodes; i++){
  33.     frequency[i] = random(5, 12);
  34.   }
  35.   noStroke();
  36.   smooth();
  37.   frameRate(30);
  38. }

  40. void draw() {
  41.   
  42.   background(100);
  43.   drawShape();
  44.   moveShape();
  45.   
  46. }

  48. void drawShape() {  
  49.   float angle = 2*PI/nodes; 
  50.   
  51.   for(int i=0; i<nodes; i++) {
  52.     pointArray[i][0] = centerX + radius * sin(angle*i);
  53.     imgArray[i][0] = img.width/2 + (img.width/2) * sin(angle*i);    
  54.   }
  55.   
  56.   for(int i=0; i<nodes; i++) {
  57.     pointArray[i][1] = centerY+radius * cos(angle*i);
  58.     imgArray[i][1] = img.height/2 + (img.height/2) * cos(angle*i);
  59.     
  60.   }

  62.   // draw polygon
  63.   curveTightness(organicConstant);
  64.   fill(255);
  65.   beginShape(); 
  66.   texture(img);
  67.   for(int i=0; i<nodes; i++) {
  68.     vertex(pointArray[i][0], pointArray[i][1], 0, imgArray[i][0], imgArray[i][1]);
  69.   }
  70.   endShape(CLOSE);
  71. }

  73. void moveShape() {
  74.   //move center point
  75.   float deltaX = mouseX-centerX;
  76.   float deltaY = mouseY-centerY;

  78.   // create springing effect
  79.   deltaX *= springing;
  80.   deltaY *= springing;
  81.   accelX += deltaX;
  82.   accelY += deltaY;

  84.   // move predator's center
  85.   centerX += accelX;
  86.   centerY += accelY;

  88.   // slow down springing
  89.   accelX *= damping;
  90.   accelY *= damping;

  92.   // change curve tightness
  93.   organicConstant = 1 - ((abs(accelX) + abs(accelY)) * .1);
  94.   
  95.   for(int i=0; i< nodes; i++){
  96.     pointArray[i][0] = pointArray[i][0]+sin(radians(angles[i]))*(accelX*2); 
  97.     pointArray[i][1] = pointArray[i][1]+sin(radians(angles[i]))*(accelX*2);
  98.     angles[i]+=frequency[i];
  99.   }
  100.  
  101. }


Top Reply

Statistics

  • 3 Replies
  • 637  Views
  • 0 Followers

Tags

No tags available for this topic.

Actions

Related Posts