How do draw a animating texture (?) onto a box.

How would I best approach the following.

Have a animation that scales a rectangle in a loop. So the rectangle would scale from 100 to 50 over and over. Then this animation would be put on 4 sides of a 3D box (like an ofBox).

Would I use a mesh for something like that? Would I draw into a texture the animating of the rectangle and then bind that to an ofBox? Essentially I’m looking to draw animations onto 3D surfaces with a box being the most basic one first.

You could draw into an fbo and bind the texture before calling ofBox. ofBox has normalized tex coords, so make sure to call ofDisableArbTex and make sure that it is set in the fbo.

You may want to start with drawing a quad, and providing the tex coords and verts and binding the texture that way. You would have more control over the tex coords, so you could use arb textures.

Thanks Nick for pointing me in a direction!

I’m trying this, but it just draws a solid box so I’m not sure what I’m missing.

  
      
  
    fbo.begin();      
    ofDisableArbTex();      
    ofSetColor(255);  
    ofCircle(0, 0, 30); // just try drawing a circle on each side of the box  
    fbo.end();  
      
    glEnable( GL_DEPTH_TEST );   
    cam.begin();       
    fbo.bind();      
    ofSetColor(255, 255, 0);  
    ofFill();  
    ofBox(30);      
    fbo.unbind();  
    cam.end();  
  

I’m new to doing texturing and 3D so I’m not sure how to approach the quad based method with tex coords.

Hi Seth,

ofDisableArbTex should be called in your setup method in testApp before any textures are created. However, in the allocate method of ofFbo, you will want to pass in settings since you can’t pass the textureTarget in as an argument. Something like this

  
ofFbo::Settings settings;  
	settings.internalformat	= GL_RGBA;  
	settings.useDepth		= true;  
	settings.useStencil	= true;  
	settings.textureTarget	= GL_TEXTURE_2D;  
  
        settings.width		= ofGetWidth();  
	settings.height		= ofGetHeight();  
	myFBO.allocate( settings );  
  

This will give you an non arb texture, meaning tex coords are from 0 - 1. Keep in mind that non-power of 2 textures will have garbage to make it pow2.

But you might want to try rendering a quad and setting the tex coords using arb textures which should be easier to understand. So do not call ofDisableArbTex. You can render a quad like this :

  
  
// x location, y location, width, height, texture coord width, texture coord height  
//--------------------------------------------------------------  
void testApp::DrawQuad(float a_x, float a_y, float a_w, float a_h, float tt, float tu) {  
	glBegin(GL_QUADS);{  
		  
		glTexCoord2f(0.0f, 0.0f);  
		glVertex2d(a_x, a_y);  
		  
		glTexCoord2f(tt, 0.0f);  
		glVertex2d(a_x + a_w, a_y);  
		  
		glTexCoord2f( tt, tu);  
		glVertex2d(a_x + a_w, a_y + a_h);  
		  
		glTexCoord2f(0.0f, tu);  
		glVertex2d(a_x, a_y + a_h);  
		  
	}glEnd();  
}  
  

You could call this something like:

  
  
fbo.getTextureReference().bind();  
DrawQuad(10, 10, 500, 300, fbo.getWidth(), fbo.getHeight());  
fbo.getTextureReference.unbind();  
  

I haven’t tested the code, but hopefully this helps.

Perfect, thanks! I’ll try the quad method in a bit, but I got the ofBox method working. The quad method looks like it’ll be useful if I want to draw different things on each side.

The thing I was missing before was:

  
fbo.getTextureReference().bind();    

instead of:

  
fbo.bind();