how to use image texture with curveVertex function

Programming Questions

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

Re: how to use image texture with curveVertex function

1 year ago

does anyone know how to do it. pls help guys

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:

Use vertices instead. You can actually make very smooth shapes with triangulated surfaces.
Use a quad but with a partly transparent texture.
Use masks. See this solution by PhiLho.

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

import processing.opengl.*;
// 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[][] pointArray = new float[nodes][2];
float[][] imgArray = new float[nodes][2];
float[]nodeX = new float[nodes];
float[]nodeY = new float[nodes];
float[]angles = new float[nodes];
float[]frequency = new float[nodes];
// soft-body dynamics
float organicConstant = 1;
PImage img;
void setup() {
size(640, 480, OPENGL);
//center shape in window
centerX = width/2;
centerY = height/2;
img = loadImage("img.jpg");
// iniitalize frequencies for corner nodes
for (int i=0; i<nodes; i++){
frequency[i] = random(5, 12);
}
noStroke();
smooth();
frameRate(30);
}
void draw() {
background(100);
drawShape();
moveShape();
}
void drawShape() {
float angle = 2*PI/nodes;
for(int i=0; i<nodes; i++) {
pointArray[i][0] = centerX + radius * sin(angle*i);
imgArray[i][0] = img.width/2 + (img.width/2) * sin(angle*i);
}
for(int i=0; i<nodes; i++) {
pointArray[i][1] = centerY+radius * cos(angle*i);
imgArray[i][1] = img.height/2 + (img.height/2) * cos(angle*i);
}
// draw polygon
curveTightness(organicConstant);
fill(255);
beginShape();
texture(img);
for(int i=0; i<nodes; i++) {
vertex(pointArray[i][0], pointArray[i][1], 0, imgArray[i][0], imgArray[i][1]);
}
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);
for(int i=0; i< nodes; i++){
pointArray[i][0] = pointArray[i][0]+sin(radians(angles[i]))*(accelX*2);
pointArray[i][1] = pointArray[i][1]+sin(radians(angles[i]))*(accelX*2);
angles[i]+=frequency[i];
}
}

Top Reply