progressbar / multi textures

examples
#1

hi,

i was playing around, while learning openGL to create a progressbar.
maybe this can be handy for someone, so here is the code:

  
  
#include "testApp.h"  
#include "stdio.h"  
  
//--------------------------------------------------------------  
testApp::testApp(){  
    alpha_img.loadImage("alpha_texture.png");  
    color_img.loadImage("color_texture.png");  
}  
  
//--------------------------------------------------------------  
void testApp::setup(){  
    glGenTextures(1, &alpha_texture);  
  
    cout << "color:  "<< color_texture << ", alpha: " << alpha_texture << endl;  
  
    // load alpha image.  
    glBindTexture(GL_TEXTURE_2D, alpha_texture);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);  
    glTexImage2D(  
        GL_TEXTURE_2D  
        ,0  
        ,GL_RGBA  
        ,alpha_img.width  
        ,alpha_img.height  
        ,0  
        ,GL_RGBA  
        ,GL_UNSIGNED_BYTE  
        ,alpha_img.getPixels()  
    );  
  
  
    // load color image  
    glGenTextures(1, &color_texture);  
    glBindTexture(GL_TEXTURE_2D, color_texture);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);  
    glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);  
    glTexImage2D(  
        GL_TEXTURE_2D  
        ,0  
        ,GL_RGBA  
        ,color_img.width  
        ,color_img.height  
        ,0  
        ,GL_RGBA  
        ,GL_UNSIGNED_BYTE  
        ,color_img.getPixels()  
    );  
    size = 0.0f;  
  
}  
  
//--------------------------------------------------------------  
void testApp::update(){  
}  
  
  
//--------------------------------------------------------------  
void testApp::draw(){  
    ofCircle(10,10,10);  
    int width = 479;  
    int height = 98;  
    int x = (ofGetWidth()/2 - width/2) ;  
    int y = (ofGetHeight() + height) / 2;  
  
    ofEnableAlphaBlending();  
    glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);  
  
    glEnable(GL_TEXTURE_2D);  
  
        // draw the background.  
        glBindTexture(GL_TEXTURE_2D, alpha_texture);  
        glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);  
        glBegin(GL_QUADS);  
            glTexCoord2f(0.0, 0.0); glVertex2f(x,y+height);  
            glTexCoord2f(0.0, 1.0); glVertex2f(x,y);  
            glTexCoord2f(1.0, 1.0); glVertex2f(x+width, y);  
            glTexCoord2f(1.0, 0.0); glVertex2f(x+width, y+height);  
        glEnd();  
  
        // draw the fill shape  
        glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_REPLACE);  
        glBindTexture(GL_TEXTURE_2D, color_texture);  
        int maxw = x+width;  
        if (size > 1) size = 0;  
        glBegin(GL_QUADS);  
            glTexCoord2f(0.0, 0.0); glVertex2f(x,y+height);  
            glTexCoord2f(0.0, 1.0); glVertex2f(x,y);  
            glTexCoord2f(size, 1.0); glVertex2f(x+(width*size), y);  
            glTexCoord2f(size, 0.0); glVertex2f(x+(width*size), y+height);  
        glEnd();  
        size += 0.001;  
  
        glFlush();  
    glDisable(GL_TEXTURE_2D);  
    ofDisableAlphaBlending();  
  
}  
  
//--------------------------------------------------------------  
void testApp::keyPressed  (int key){  
}  
  
//--------------------------------------------------------------  
void testApp::keyReleased(int key){  
  
}  
  
//--------------------------------------------------------------  
void testApp::mouseMoved(int x, int y ){  
}  
  
//--------------------------------------------------------------  
void testApp::mouseDragged(int x, int y, int button){  
}  
  
//--------------------------------------------------------------  
void testApp::mousePressed(int x, int y, int button){  
  
}  
//--------------------------------------------------------------  
void testApp::mouseReleased(int x, int y, int button){  
  
}  
  
//--------------------------------------------------------------  
void testApp::resized(int w, int h){  
  
}

#2

cheers,really useful :smiley:

#3

Just curious what your header looked like, trying to teach myself some texture stuff and I was curious about the alpha_texture and color_texture types.

*Edit* figured it out…
just as a note these are the pieces that need to be added.

  
float size;  
		ofImage alpha_img, color_img;  
		GLuint alpha_texture, color_texture;
#4

had another question, about the image. The shadows and lighting effects are just a static effect drawn into your images, right? is there a way to produce those effects with openGL? Or is this just the easiest way?

#5

hi psykel,

Yeah those are just two images I created with Photoshop. I’ve been trying to figure out how to draw such a shape easily but I think that would take quite a lot of work using multiple shapes and textures.

roxlu.