Creating a 2D house with primitive shapes using OpenGL/C++
Tags: opengl, visualstudio, 2dgraphics, graphicprogramming
Published: 2023-09-20 18:44:56

## **Setup OpenGL with Visual Studio 2022 on Windows 10**

**Prerequisites:**
Visual Studio 2022 ([download](https://visualstudio.microsoft.com/vs/))

**_Step 1:_**

Download Visual Studio 2022 from the official website and install using the downloaded .exe file.

Select the below component from the installation window workloads section and install the application.
![Visual Studio Installation](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ywz02w9hppn1f68dcygz.png)

**_Step 2:_**
Download the GLUT header file, .LIB files, and .DLL files all pre-compiled for Intel platforms using this [link](https://www.opengl.org/resources/libraries/glut/glutdlls37beta.zip).

**_Step 3:_**
Open Visual Studio 2022 and click "Create new project".

![Visual Studio 2022 initial view](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/l3duzf0be18hwf1n1vyf.png)

Then select "Empty Project" from the template list and click "Next".

![Visual Studio 2022 create a new project](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/a6zxkcbwwutxd94mjglt.png)

Next, configure the new project as below and click "Create".

![Visual Studio 2022 configure the new project](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kluvvjavrg653waevwmr.png)

**_Step 4: Create C++ File_**
Right-click on the project title in "Solution Explorer".
Click "Add" --> "New Item" --> "C++ File (.cpp)" and create the file.

![Visual Studio Solution Explorer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gz78inme3xjnmdnjpvx8.png)

**_Step 5: Add glut.h file and .lib files to the project_**
Select x86 from "Solution Platforms"

![Solution Platforms](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/q90cftyg4u3gezwcjct3.png)

Right-click on the project title in "Solution Explorer" and go to properties.

![Visual Studio 2022 Solution Explorer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ilqr2diov4zbgz9xmxoi.png)

![Visual Studio 2022 Project](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/pjwwc3tnfxshzwxsisbn.png)

Go to the "C/C++" section in the properties
Click on the space in "Additional Include Directories" and click "Edit..."

![Include directories](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/x6w6gk3ubow3wjqgenfb.png)

Click on the folder icon
Then click three dots in the space below
![Include directories](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ubxlbb7jmnurhhc1phz8.png)

Select previously downloaded glut.h file folder

![glut.h file folder](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/kbvl984etp09t34qf26o.png)

Go to "Linker" --> "General" --> "Additional Library Directories" --> "Edit..."

![Linker](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3k77dmg7ln4ghux14lm9.png)

Add folder path to previously downloaded .lib files

![Additional library directories](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/5o08cy665snotz6uktr2.png)

Go to "Linker" --> "Input Section" --> "Additional Dependencies" --> "Edit..."
Enter "glut32.lib"

![Additional Dependencies](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/qi2y4vstteru7kecnn0u.png)

Finally, click "Apply".

**_Step 6: Add .dll files to the project directory_**
Right-click on the project title in "Solution Explorer"
Click "Open Folder in File Explorer"

![Open Folder in File Explorer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/yg6q5aqm99c3fz3exhhk.png)

Copy previously downloaded glut.dll and glut32.dll files to the project folder.

![.dll files](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bl73j3slud2o7ppw35i3.png)

![Project file directory](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/gxb6comevfvkrvlqcm1x.png)

**_Step 7: Sample code for 2D House created with primitve shapes_**

```
#include <Windows.h>
#include <glut.h>

void displayFunction() {
	glClearColor(0.0 ,0.0 ,0.0 ,1.0);
	glClear(GL_COLOR_BUFFER_BIT);
	glLineWidth(2.0);

	//y-axis line
	glBegin(GL_LINES);
	glColor3f(1.0, 0.0, 0.0);
	glVertex2f(0.0, 1.0);
	glVertex2f(0.0, -1.0);
	glEnd();

	//x-axis line
	glBegin(GL_LINES);
	glColor3f(1.0, 0.0, 0.0);
	glVertex2f(1.0, 0.0);
	glVertex2f(-1.0, 0.0);
	glEnd();

	//house roof
	glBegin(GL_TRIANGLES);
	glColor3f(0.8, 0.5, 0.2);
	glVertex2f(0.0, 0.7);//top
	glVertex2f(-0.6, 0.1);//left
	glVertex2f(0.6, 0.1);//right
	glEnd();

	//house chimney
	glBegin(GL_QUADS);
	glColor3f(0.65, 0.16, 0.16);
	glVertex2f(0.4, 0.5);//top left
	glVertex2f(0.5, 0.5);//top right
	glVertex2f(0.5, 0.2);//lower right
	glVertex2f(0.4, 0.2);//lower left
	glEnd();

	//house rectangle
	glBegin(GL_QUADS);
	glColor3f(1.0, 1.0, 0.5);
	glVertex2f(-0.55, 0.1);//top left
	glVertex2f(0.55, 0.1);//top right
	glVertex2f(0.55, -0.8);//lower right
	glVertex2f(-0.55,-0.8);//lower left
	glEnd();

	//house door
	glBegin(GL_QUADS);
	glColor3f(0.65, 0.16, 0.16);
	glVertex2f(-0.1, -0.1);//top left
	glVertex2f(0.1, -0.1);//top right
	glVertex2f(0.1, -0.8);//lower right
	glVertex2f(-0.1, -0.8);//lower left
	glEnd();

	//house window left
	glBegin(GL_QUADS);
	glColor3f(0.99, 0.99, 0.89);
	glVertex2f(-0.45, -0.2);//top left
	glVertex2f(-0.2, -0.2);//top right
	glVertex2f(-0.2, -0.45);//lower right
	glVertex2f(-0.45, -0.45);//lower left
	glEnd();

	//window line
	//x-axis line top
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(-0.45, -0.2);//top left
	glVertex2f(-0.2, -0.2);//top right
	glEnd();

	//x-axis line bottom
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(-0.45, -0.45);//lower left
	glVertex2f(-0.2, -0.45);//lower right
	glEnd();

	//y-axis line left
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(-0.45, -0.2);//top left
	glVertex2f(-0.45, -0.45);//lower left
	glEnd();

	//y-axis line right
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(-0.2, -0.2);//top right
	glVertex2f(-0.2, -0.45);//lower right
	glEnd();

	//y-axis line middle
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(-0.325, -0.2);//top 
	glVertex2f(-0.325, -0.45);//lower 
	glEnd();

	//x-axis line middle
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(-0.45, -0.325);//right 
	glVertex2f(-0.2, -0.325);//left 
	glEnd();


	//house window right ------
	glBegin(GL_QUADS);
	glColor3f(0.99, 0.99, 0.89);
	glVertex2f(0.2, -0.2);//top left
	glVertex2f(0.45, -0.2);//top right
	glVertex2f(0.45, -0.45);//lower right
	glVertex2f(0.2, -0.45);//lower left
	glEnd();


	//window line
	//x-axis line top
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(0.45, -0.2);//top left
	glVertex2f(0.2, -0.2);//top right
	glEnd();

	//x-axis line bottom
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(0.45, -0.45);//lower left
	glVertex2f(0.2, -0.45);//lower right
	glEnd();

	//y-axis line left
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(0.45, -0.2);//top left
	glVertex2f(0.45, -0.45);//lower left
	glEnd();

	//y-axis line right
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(0.2, -0.2);//top right
	glVertex2f(0.2, -0.45);//lower right
	glEnd();

	//y-axis line middle
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(0.325, -0.2);//top 
	glVertex2f(0.325, -0.45);//lower 
	glEnd();

	//x-axis line middle
	glBegin(GL_LINES);
	glColor3f(0.0, 0.0, 0.0);
	glVertex2f(0.45, -0.325);//right 
	glVertex2f(0.2, -0.325);//left 
	glEnd();

	//garden trapezium
	glBegin(GL_QUADS);
	glColor3f(0, 0.62, 0.42);
	glVertex2f(-0.55, -0.8);//top left
	glVertex2f(0.55, -0.8);//top right
	glVertex2f(0.60, -0.9);//lower right
	glVertex2f(-0.60, -0.9);//lower left
	glEnd();

	glFlush();
}

int main(int argsc,char** argsv) {

	//glut initialization
	glutInit(&argsc,argsv);
	glutInitDisplayMode(GLUT_SINGLE);


	//create display window
	glutInitWindowPosition(100, 100);
	glutInitWindowSize(720, 480);
	glutCreateWindow("OpenGL 2D House");

	//create graphic
	glutDisplayFunc(displayFunction);
	glutMainLoop();
	return 0;
}
```
Click "Start Debugging (F5)"/"Start without Debugging (ctrl+F5)"

![2D House Output](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zjn0er9i246ogj1wkrqa.png)