Hi guys, I am doing a project wherein i have to make an OpenGL animation and its a Sainsbury advertisement and it kinda sucks till now. Now i really need to add images, viewports and be more creative.

Following is the code till now, (yeah laugh at it...it sucks more than anything).

Please help me add an image along with the text that flashes on screen and please help me add more creative stuff like viewports, images and anything cool.

I AM A TOTAL NEWBIE AT THIS, SO PLEASE TAKE IT EASY ON ME. :)

#include "stdafx.h"
#include <stdlib.h>
#include "glut.h"
#include <windows.h>
#include <stdio.h>

int frame=0;
int frame3=0;
int no_points=74;
float sx=1.0, sy=1.0, sx2=1.0,sy2=1.0, sx3=1.0,sy3=1.0, sx4=1.0,sy4=1.0, sx5=1.0,sy5=1.0;

const GLfloat colors[][3] = {
  { 255.0/255.0,   0.0/255.0,   0.0/255.0},
  { 128.0/255.0,   0.0/255.0,   0.0/255.0},
  { 205.0/255.0,   0.0/255.0,   0.0/255.0},
  {   0.0/255.0, 255.0/255.0,   0.0/255.0},
  {   0.0/255.0, 128.0/255.0,   0.0/255.0},
  {   0.0/255.0, 205.0/255.0,   0.0/255.0},
  {   0.0/255.0,   0.0/255.0, 255.0/255.0},
  {   0.0/255.0,   0.0/255.0, 128.0/255.0},
  {   0.0/255.0,   0.0/255.0, 205.0/255.0},
  { 255.0/255.0, 255.0/255.0,   0.0/255.0},
  { 128.0/255.0, 128.0/255.0,   0.0/255.0},
  { 205.0/255.0, 205.0/255.0,   0.0/255.0},
  {   0.0/255.0, 255.0/255.0, 255.0/255.0},
  {   0.0/255.0, 128.0/255.0, 128.0/255.0},
  {   0.0/255.0, 205.0/255.0, 205.0/255.0},
  { 255.0/255.0,   0.0/255.0, 255.0/255.0},
  { 128.0/255.0,   0.0/255.0, 128.0/255.0},
  { 205.0/255.0,   0.0/255.0, 205.0/255.0},
};

class wcPt2D{
public:
	float x, y;
};

wcPt2D text[74]={{50,75},{75,50},{100,75},{50,125},{75,150},{100,125},{75,150},{50,125}
,{100,75},{75,50},//s
{125,50},{150,150},{165,100},{135,100},{165,100},{175,50},//a
{200,50},{200,150},{200,50},//i
{225,50},{225,150},{275,50},{275,150},{275,50},//n
{325,50},{300,75},{325,50},{350,75},{300,125},{325,150},{350,125},{325,150},{300,125},{350,75},{325,50},//s
{375,50},{375,150},{400,150},{400,110},{390,100},{400,90},{400,50},{375,50},//b//43
{437.5,50},{433,66},{429,82},{425,100},{425,150},{425,100},{429,82},{433,66},{437.5,50},
{441,66},{445,82},{450,100},{450,150},{450,100},{445,82},{441,66},{437.5,50},//u//60
{475,50},{475,150},{500,150},{500,100},{475,100},{500,50},//r
{525,50},{525,65},{525,50},{550,50},{550,150},{550,100},{525,100},{525,150}};//74

wcPt2D sainsbury[74]={{0,100},{50,100},//45
{50,100},{50,110},{50,120},{50,130},{50,140},{50,150},{50,160},
{50,170},{50,180},{50,190},{50,200},{55,210},{60,220},{65,230},{70,240},{75,250},{350,250},{350,200},{350,100}
,{190,100},{180,100},{170,100},{160,100},{150,100},{140,100},{130,100},{120,100},{110,100},{100,100},{90,100}
,{80,100},{70,100},{60,100},{50,100},{100,100},{100,110},{100,140},{100,150},{100,160}
,{100,200},{50,200},{100,200},{350,200},{100,200},{75,250},{350,250},{350,100}//45
,{450,100},{450,180},{425,210},{450,200},{425,240},{450,230}
,{425,280},{450,270},{460,310},{470,270},{495,280},{470,230},{495,240},{470,200},{495,210},{470,180},{470,100},{500,100},
{520,100},{530,100},{550,100},{570,100},{590,100},{600,100},{650,100}};

wcPt2D dis[74];
wcPt2D tweenPoly[74];
float proportion =0.0;



void tween(wcPt2D source[74], wcPt2D destination[64], int numPoints, double proportion, wcPt2D tweenPoly[71])
{
	
	for( int i = 0; i < numPoints; i++)
        {
		    double sourceX = source[i].x;
 		    double sourceY = source[i].y;

 		    double destinationX = destination[i].x;
 		    double destinationY = destination[i].y;

 		    double differenceX = (destinationX - sourceX);
 		    double differenceY = (destinationY - sourceY);

 		    double tweenX = sourceX + ( differenceX * proportion );
 		    double tweenY = sourceY + ( differenceY * proportion );

			tweenPoly[i].x = tweenX;
			tweenPoly[i].y = tweenY;
        }
}

void renderSpacedBitmapString(float x, float y, int spacing, void *font, char *string) 
{
  char *c;
  int x1=x;
  for (c=string; *c != '\0'; c++) {
	glRasterPos2f(x1,y);
    	glutBitmapCharacter(font, *c);
	x1 = x1 + glutBitmapWidth(font,*c) + spacing;
  }
}

void scene_1()
{
	int i;
	glColor3f (0.6, 0.1, 0.1);
		glBegin(GL_LINE_STRIP);
			 for(i=0;i<no_points;i++)
				 {
					glVertex2i (text[i].x,text[i].y);
				}			 
		glEnd();
}


void scene_3()
{
	int i;
  glColor3f(0.6, 0.1, 0.1);
	   tween(text,sainsbury,no_points,proportion,tweenPoly);

		glBegin(GL_LINE_STRIP);
			for(i=0;i<no_points;i++)
			{
			 glVertex2i (tweenPoly[i].x,tweenPoly[i].y);
			} 
		glEnd();
}

void text1()
{
	glClear(GL_COLOR_BUFFER_BIT);
	glColor3f(colors[frame3][0],colors[frame3][1],colors[frame3][2]);
	frame3+=1;
	renderSpacedBitmapString(130,200,1,GLUT_BITMAP_TIMES_ROMAN_24,"Food & Drink");
	if(frame3>18)	frame3=0;
		glFlush();
}

void text2()
{
	glClear(GL_COLOR_BUFFER_BIT);
	glColor3f(colors[frame3][0],colors[frame3][1],colors[frame3][2]);
	frame3+=1;
	renderSpacedBitmapString(130,200,1,GLUT_BITMAP_TIMES_ROMAN_24,"Entertainment");
	if(frame3>18)	frame3=0;
		glFlush();
}

void text3()
{
	glClear(GL_COLOR_BUFFER_BIT);
	glColor3f(colors[frame3][0],colors[frame3][1],colors[frame3][2]);
	frame3+=1;
	renderSpacedBitmapString(130,200,1,GLUT_BITMAP_TIMES_ROMAN_24,"Technology");
	if(frame3>18)	frame3=0;
		glFlush();
}

void text4()
{
	glClear(GL_COLOR_BUFFER_BIT);
	glColor3f(colors[frame3][0],colors[frame3][1],colors[frame3][2]);
	frame3+=1;
	renderSpacedBitmapString(130,200,1,GLUT_BITMAP_TIMES_ROMAN_24,"Toys & Games");
	if(frame3>18)	frame3=0;
		glFlush();
}

void text5()
{
	glClear(GL_COLOR_BUFFER_BIT);
	glColor3f(colors[frame3][0],colors[frame3][1],colors[frame3][2]);
	frame3+=1;
	renderSpacedBitmapString(70,190,1,GLUT_BITMAP_TIMES_ROMAN_24,"ALL YOUR SHOPPING NEEDS");
	if(frame3>18)	frame3=0;
		glFlush();
	
}

void display(void)
{
	
   glClear (GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
	glClearColor(0.1,0.1,0.3,0.0); // Clear the background of our window to red
   frame++;

   glLineWidth(10.0);
  
   if((frame>=0) && (frame<50))
   {
       glPushMatrix();
	   glTranslatef(160 * (1- sx), 203 * (1 - sy), 0 );
		glScalef(sx, sy, 1.0);

			text1();
			sx=sx * 1.03;
			sy=sy * 1.03;
		glPopMatrix();		
   }

   if((frame>50) && (frame<100))
   {
       glPushMatrix();
	   glTranslatef(160 * (1- sx2), 203 * (1 - sy2), 0 );
		glScalef(sx2, sy2, 1.0);

			text2();
			sx2=sx2 * 1.03;
			sy2=sy2 * 1.03;
		glPopMatrix();	
   }

   if((frame>100) && (frame<150))
   {
       glPushMatrix();
	   glTranslatef(160 * (1- sx3), 203 * (1 - sy3), 0 );
		glScalef(sx3, sy3, 1.0);

			text3();
			sx3=sx3 * 1.03;
			sy3=sy3 * 1.03;
		glPopMatrix();	
   }

   if((frame>150) && (frame<200))
   {
       glPushMatrix();
	   glTranslatef(160 * (1- sx4), 203 * (1 - sy4), 0 );
		glScalef(sx4, sy4, 1.0);

			text4();
			sx4=sx4 * 1.03;
			sy4=sy4 * 1.03;
		glPopMatrix();	
   }

   if((frame>200) && (frame<250))
   {
       glPushMatrix();
	   glTranslatef(160 * (1- sx5), 203 * (1 - sy5), 0 );
		glScalef(sx5, sy5, 1.0);
			text5();
			sx5=sx5 * 1.01;
			sy5=sy5 * 1.01;
		glPopMatrix();
   }

   if((frame>250) && (frame<350))
   {
       glPushMatrix();
	   glTranslatef(160 * (1- sx5), 203 * (1 - sy5), 0 );
		glScalef(sx5, sy5, 1.0);

			text5();
		glPopMatrix();
   }

   if((frame>350) && (frame<450))
   {
	   scene_1();
   }

   if((frame>450) && (frame<553))
   { 
	scene_3();
		proportion +=0.01;
		if(proportion >1.0) proportion =0.0;
   }

	if((frame>553) && (frame<700))
   {
		int i;
		glColor3f (0.6, 0.1, 0.1);
		 glBegin(GL_LINE_STRIP);
				for(i=0;i<no_points;i++)
					glVertex2i (sainsbury[i].x,sainsbury[i].y);    
		 glEnd();

				glColor3f(colors[frame3][0],colors[frame3][1],colors[frame3][2]);
				frame3+=1;
				renderSpacedBitmapString(110,140,1,GLUT_BITMAP_HELVETICA_18,"Welcome to SAINSBURY");
				if(frame3>18)	frame3=0;
					//glFlush();
   }
   
	fprintf(stdout,"Frame number= %i\n", frame);
	if(frame>700)	 sx=1.0,sy=1.0, sx2=1.0,sy2=1.0,  sx3=1.0,sy3=1.0, sx4=1.0,sy4=1.0, sx5=1.0,sy5=1.0;
	if(frame>700) frame=0;
   glFlush ();
}

void myKey(unsigned char key, int x, int y)
{
	switch (key) {
	case 'd':
		frame = frame+1;
		glutPostRedisplay();
		break;

	case 'a':
		frame=0;
		sx=1.0,sy=1.0, sx2=1.0,sy2=1.0,  sx3=1.0,sy3=1.0, sx4=1.0,sy4=1.0, sx5=1.0,sy5=1.0;
		glutPostRedisplay();
		break;

	case 27:
		exit(0);
	}
}

void Timer( int value )
{
   if( value ) glutPostRedisplay();
   glutTimerFunc(40,Timer,value);
}

void visibility(int state)
{
 switch (state)
 {
   case GLUT_VISIBLE:
             Timer(1);
             break;
   case GLUT_NOT_VISIBLE:
             Timer(0);
             break;
   default:
             break;
 }
}

void init (void) 
{
/* select clearing color 	*/
   glClearColor (0.1, 0.1, 0.3, 1.0);
	
/* initialize viewing values  */
   glMatrixMode(GL_PROJECTION);
   glLoadIdentity();
   glOrtho(0, 640, 0, 480, -1, 1);
}
 
int main(int argc, char** argv)
{
   glutInit(&argc, argv);
   glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
   glutInitWindowSize (500, 500); 
   glutInitWindowPosition (100, 100);
   glutCreateWindow ("Sainsbury");

   init ();
   glutDisplayFunc(display); 
   glutKeyboardFunc(myKey);
    glutVisibilityFunc(visibility);
	fprintf(stdout,"'d' to fast forward the animation, 'a' to restart the animation\n");
   glutMainLoop();
   return 0;   /* ANSI C requires main to return int. */
}

Dani AI

Generated

Notes on 's thread and quick, practical steps to add images, viewports and polish (builds on 's tutorial suggestion and 's formatting reminder).

First, small structural fixes that unlock new features: render once per frame (call the clear at the top of the main display routine only), use double buffering instead of single buffering to remove flicker, and stop clearing the frame inside helper text/draw functions. Replace brittle “magic frame number” logic with a simple state enum or timed phases driven by elapsed time (glutTimerFunc). Keep transforms local with glPushMatrix/glPopMatrix and preserve projection state whenever changing viewports.

Loading an image into an OpenGL texture (example using a single-file loader such as stb_image.h):

int w,h,channels;
unsigned char *pixels = stbi_load("logo.png",&w,&h,&channels,0);
GLuint tex; glGenTextures(1,&tex); glBindTexture(GL_TEXTURE_2D,tex);
glTexImage2D(GL_TEXTURE_2D,0,(channels==4?GL_RGBA:GL_RGB),w,h,0,
             (channels==4?GL_RGBA:GL_RGB),GL_UNSIGNED_BYTE,pixels);
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_LINEAR);
stbi_image_free(pixels);

Rendering that texture as a 2D image (overlay or backdrop):

glEnable(GL_BLEND); glBlendFunc(GL_SRC_ALPHA,GL_ONE_MINUS_SRC_ALPHA);
glEnable(GL_TEXTURE_2D); glBindTexture(GL_TEXTURE_2D,tex);
glBegin(GL_QUADS);
  glTexCoord2f(0,0); glVertex2f(x,y);
  glTexCoord2f(1,0); glVertex2f(x+w,y);
  glTexCoord2f(1,1); glVertex2f(x+w,y+h);
  glTexCoord2f(0,1); glVertex2f(x,y+h);
glEnd();
glDisable(GL_TEXTURE_2D);

Splitting the window into viewports (example to draw a main scene and a small inset):

glViewport(0,0,mainW,mainH); setProjectionForMain(); drawMain();
glViewport(mainW-insetW,mainH-insetH,insetW,insetH); setProjectionForInset(); drawInset();
glViewport(0,0,winW,winH); // restore

Troubleshooting checklist: verify file paths, call glPixelStorei(GL_UNPACK_ALIGNMENT,1) for odd widths, check GL errors with glGetError, ensure PNG alpha handled via blending, and pad or resize textures if NPOT support is absent. For crisper typography consider using textured glyphs or FreeType instead of bitmap fonts. These changes will let images, layered text, and creative multi-viewport layouts be composed reliably and without the redraw artifacts currently visible.

Recommended Answers

All 3 Replies

Have you gone through the tutorials here : http://nehe.gamedev.net/ (on the left side there are 52 OpenGL tutorials.)

Once you distill some of that, if you could add some short code snippets here which demonstrate very particularly functionalities:
http://programmingexamples.net/index.php?title=OpenGL

that would be a great exercise for you and very helpful for everyone else :)

David

Your code is not formatted. Format you code and then we will help you. Formatting makes your code easier to read.

Thanks daviddoria, can someone else please give me more ideas or code to help me with this.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.