To be a senior software engineer [1] (QT + OpenGL)

This blog is written to record the learning process. To be a senior software engineer may leave a lot of hard work and good memories on the way. Maybe everyone has their own vision of a software engineer. I want to write down these stories and share them with you. I am not that professional, so this blog may look more like a learning experience. I will write different chapters based on different themes. If you are not interested in the knowledge involved in a chapter, you can skip it directly. I also hope this blog will be helpful to you.
------ By chuckgao

Chapter 1 OpenGL
I decided to write the first chapter from my recent work. What is OpenGL? I cannot answer this question, but I know what I plan to do with it. I want to build a simple navigation system, and I plan to use OpenGL to draw my 3D navigation. In fact, this is a complicated task for me, and the goal I set for myself is simply to implement switching between several scenarios. To this end, I searched for OpenGL tutorials online. I plan to use QT for development, so I finally found a QT OpenGL tutorial from Qiliang's predecessors (technically. If you are more interested in this, you can log on to his webpage to learn this tutorial: http://www.qiliang.net/nehe_qt/index.html. Below I will share my understanding of OpenGL technology on the main line of the (simple) 3D navigation system I plan to develop.

1. candy box
The first is the establishment of the scenario. I plan to put all my scenes in a cube (or a cube), think of it as a candy box, and delete it from my face. In this way, it looks like a stage with a three-dimensional feeling. For how to construct such a stage,

I will illustrate the main steps and add relevant knowledge later:
① Draw a cube and do not draw a front. It is as if you open the door and walk into a room. Now we delete the door and let the layout in the room shine into our eyes;
② Set a texture for each side of the cube (except the front) to make it look like a real three-dimensional scene. Here, it should be five sides;
③ Set the texture to translucent, which looks more vivid.
④ Rotate the scene when necessary

The first step is described in detail. The basis for drawing a cube is that you need to know how to draw a plane. There is a sequence requirement for how to draw a plane, but there is no need to draw each plane of a cube. You can draw any one of them first. Follow the steps below to draw a plane: First top right coordinate, then top left, bottom left, and bottom right. That is, draw in the clockwise direction. I don't know why, but I only need to know. We have painted the five sides of the cube as required above. The Code section is very simple. You can refer to the QT OpenGL tutorial of Qiliang and will not post it here.
Step 2: Set a texture for each face. Texture is just the name of an image. specialized terms are called texture maps (texture). Texture maps must be set before painting a surface. If you want different textures for each face, You need to bind your texture map before drawing each face. Here, I will give some simple code to illustrate. The image path and parameters must be set for texture maps.
Code to select a texture map for the drawn surface:
Glbindtexture (gl_texture_2d, texture [0]);
Glbegin (gl_quads );
Gltexcoord2f (0.0, 0.0); glvertex3f (-1.0,-1.0, 1.0 );
Gltexcoord2f (1.0, 0.0); glvertex3f (1.0,-1.0, 1.0 );
Gltexcoord2f (1.0, 1.0); glvertex3f (1.0, 1.0, 1.0 );
Gltexcoord2f (0.0, 1.0); glvertex3f (-1.0, 1.0, 1.0 );
Glend ();

Glbindtexture (gl_texture_2d, texture [1]);
Glbegin (gl_quads );
Gltexcoord2f (1.0, 0.0); glvertex3f (-1.0,-1.0,-1.0 );
Gltexcoord2f (1.0, 1.0); glvertex3f (-1.0, 1.0,-1.0 );
Gltexcoord2f (0.0, 1.0); glvertex3f (1.0, 1.0,-1.0 );
Gltexcoord2f (0.0, 0.0); glvertex3f (1.0,-1.0,-1.0 );
Glend ();
Here texture [0] and texture [1] are the texture textures we use, and the texture settings are as follows:
Qimage img1, img2 ,;
Qimage Buf;
If (! Buf. Load ("./1.bmp "))
{
Qwarning ("cocould not read image file, using single-color instead .");
Qimage dummy( 128,128, qimage: format_rgb32 );
// Dummy. Fill (QT: Green. RGB ());

Buf = dummy;
}
Img1 = qglwidget: converttoglformat (BUF );

If (! Buf. Load ("./2.bmp "))
{
Qwarning ("cocould not read image file, using single-color instead .");
Qimage dummy( 128,128, qimage: format_rgb32 );
// Dummy. Fill (QT: Green. RGB ());

Buf = dummy;
}
Img2 = qglwidget: converttoglformat (BUF );

// 1
Glbindtexture (gl_texture_2d, texture [0]);
Glteximage2d (gl_texture_2d, 0, 3, img1.width (), img1.height (), 0,
Gl_rgba, gl_unsigned_byte, img1.bits ());
Gltexparameteri (gl_texture_2d, gl_texture_min_filter, gl_linear );
Gltexparameteri (gl_texture_2d, gl_texture_mag_filter, gl_linear );
// 2
Glbindtexture (gl_texture_2d, texture [1]);
Glteximage2d (gl_texture_2d, 0, 3, img2.width (), img2.height (), 0,
Gl_rgba, gl_unsigned_byte, img2.bits ());
Gltexparameteri (gl_texture_2d, gl_texture_min_filter, gl_linear );
Gltexparameteri (gl_texture_2d, gl_texture_mag_filter, gl_linear );

After this step is completed, we get a box with five faces. What we need to do now is to make it look more three-dimensional. Here, we use some knowledge of OpenGL fusion. In fact, it is very simple. If you do not need to go further, simply add several lines of code to initializegl (). They are:
Glcolor4f (1.0, 1.0, 1.0, 0.5 );
Glblendfunc (gl_src_alpha, gl_one );
And enable the effect:
Glable (gl_blend );
Gldisable (gl_depth_test );

Okay. After completing the above steps, our scenario has been established.
While setting the scenario, we will also consider whether we can rotate or move it to achieve some effect. So finally, we need to make some preparations for it so that our scenarios can be rotated and moved as we wish.
Here we use the glrotatef (xrot, 1.0, 0.0, 0.0) function. The first parameter represents the rotation angle, and the last three parameters are the Rotation Position of our object relative to the XYZ axis. suppose we want to rotate our scenario now, we can define an xrot variable, assign it to 0.0 at first, and update EGL () after xrot + = 2 after each drawing. In this way, we will get an object that rotates around the X axis at a forward position of 1.0. You can change the Rotation Position around the XYZ axis at will, but do not exceed the size of your scenario.
In mobile scenarios, the gltranslatef (0.0, 0.0, zoom) function is used. The three parameters are the XYZ axis, and a positive value indicates moving along the positive direction of the Z axis, A negative value indicates moving along the negative direction (that is, behind the screen.

So far, our scenario is OK. If you have any questions, you can leave me a message or email. Of course, it is recommended that you read the relevant tutorials and then read my actual project. In the next section, we will study the movement of objects in the scene.