Simon iPhone-OpenGL ES tutorial-08

OpenGL ES 08-do not use the mix color of mr. Bucket 1

Please note: I am not very satisfied with the status when I write this tutorial, so please do not care if you have any questions. If something goes wrong, don't worry. I will continue to explain it in section 2nd.

Who is mr. Bucket? That's my kitchen mixer! (In English, mixer and mixed colors are the same.) Of course we are not talking about my kitchen mixer or mixed 3D software. We are talking about OpenGL mixing. However, this part may be about 2 or 3 tutorials. The effect on mixing is very small, which requires a lot of explanation. In future tutorials, we will provide detailed descriptions.

I still remember the code when I first used the Hybrid Operation. Fortunately, I didn't write my own code, but the effect was really cool. That is an SGL video card. Very powerful processing capabilities, not comparable to the current Apple, but at that time, it was really spectacular.

The main reason is that there was an exciting time. At that time, we were not even able to perform texture ing during mixing, as well as lighting and coordinate transformation.

In any case, let's integrate learning. Mixing is the combination of two images, making the front-end part of the image transparent. For example, you only have a piece of red Plexiglass and are expected to pass. Red will appear in the world, because the colored plexiglass will change the color of all objects, through which you can view.

Therefore, to make the hybrid operation, we need an object that is partially transparent at the front end (that is, the rgba color definition with the Alpha value less than 1.0) and some objects that will be "mixed.

This is the key to mixing. You need two objects. The objects in front of the object are transparent, and the transparent part immediately shows the objects in the back.

I should tell you that the official name of the hybrid is "Alpha synthesis ". I will not ask you to think (never), but you may see this word. Computer Graphics has gone up a long way because I have studied it, but I learned it in the official time. I think, fusion is a form of Alpha synthesis and Alpha synthesis. One method is single or joint drafting of images and Alpha channels.

Getting started
Download Chapter 1 Tutorials: AppleCoder-OpenGLES-07.zip

We will use this project and use the textures mapped pyramid and cube on the background to display the mixed effect. Open xcode.

Mixing in OpenGL
To work together in OpenGL, we need to change the "State" in OpenGL so that we can use the mixture. I'm sure you know how to do this.

Glable (gl_blend );

Add it to the drawview function. Before we draw it, we can use translucent. disable this function and use gldisable ().

Okay, hybrid connection (remember to turn it off if you don't need it ). A great thing about OpenGL is that different mixed methods can be executed to produce different mixed effects. These so-called hybrid functions. I will discuss them in the first section in detail below.

Well, back to the drawview function, we need to define a rectangle to put it before our two objects.

Const glfloat blendrectangle [] = {
1.0, 1.0,-2.0,
-1.0, 1.0,-2.0,
-1.0,-1.0,-2.0,
1.0,-1.0,-2.0
};

We want to make two. Therefore, the reference code uses glpushmatrix () and glpopmatrix () to separate them.

Go down to the method for drawing the pyramid and cube. To correctly display the mixed effect, we must first draw an opaque object. Then, the rendering is transparent. Just like an old painter.

Now, consider the current state of OpenGL. We currently have texture ing. Do we need this texture for image creation? No, so we need to disable texture ing.

GlDisableClientState (GL_TEXTURE_COORD_ARRAY );

Then, start mixing:

Glable (GL_BLEND );
GlBlendFunc (GL_ONE, GL_ONE );

Enable hybrid. Light mixing is not enough. We need to tell how OpenGL mixing works. Otherwise, by default, nothing will be done. This is why glBlendFunc () plays a role. Don't worry about this. Now I want to discuss in detail the mixed functions. Now, let's get the work we just got, and then we can experiment with it.

Well, the texture is closed, the hybrid mode is enabled, and the hybrid mode is submitted to OpenGL. Now it is time to draw two rectangles.

GlPushMatrix ();
{
GlTranslatef (0.0, 1.0,-4.0 );
GlVertexPointer (3, GL_FLOAT, 0, blendRectangle );
GlEnableClientState (GL_VERTEX_ARRAY );
GlColor4f (1.0, 0.0, 0.0, 0.4 );
GlDrawArrays (GL_TRIANGLE_FAN, 0, 4 );
}
GlPopMatrix ();

GlPushMatrix ();
{
GlTranslatef (0.0,-1.0,-4.0 );
GlColor4f (1.0, 1.0, 0.0, 0.4 );
GlDrawArrays (GL_TRIANGLE_FAN, 0, 4 );
}
GlPopMatrix ();
GlDisable (GL_BLEND );

Except for calling glDisable () at the end, there is nothing new here. We just define our blendRectangle, locate it on the monitor, color it, and draw it. Then, we need to disable OpenGL fusion. Otherwise, this function will be used in combination with our pyramid and cube next time (you can try it if you like ).

Click "Build and Go ":

Pay attention to the transformation of the color pyramid and cube. Do they span the rectangles of two colors? This is a fusion task. The color and the two front rectangles are partially transparent (40% transparent), combining or mixing the color of the object to create a new color.

Therefore, the yellow rectangle looks brighter than the red one.

If you only get a red and yellow rectangle, it is possible that the wrong position is inserted in the place where you draw the function. We need to draw transparent objects after opaque objects. Or you can change the hybrid mode.

This is the most basic mix. Nothing special, but we understand the hybrid part.

Quick summary before continuing
Therefore, when using a mixture, we need a transparent object in front of our screen. First, we can draw solid objects. At this time, we can call glEnable (), use glBlendFunc () to set the mixing, and finally get the converted objects from the back to the front.

Now we need to go to a place where mixing is really complicated. Set the mixed factor.

Mixed factor
I just deleted the content I just wrote. This can determine the final color of a pixel, basically a math matrix (though not mentioned ). No, I don't think it is a correct thing.

It's time for me to get more creative and useful things, but you need the first theory: How does a mixture work.

As I said earlier, you need a translucent object and something on the background is mixed. You can also simply mix it with the background, but we use glClear () every time to clear the background, so you may not get anything.

So OpenGL finds two things for each pixel on the display:

1. This is the source pixel. This is the new Pixel we are currently drawing, from partial transparency to objects (in red and yellow rectangles)

2. This is the target pixel. This is the pixel in our current video memory. This is the semi-transparent object being drawn. In our example, this is a hybrid object that contains a solid object (pyramid and cube) and a background.

3. This is the indicator of the source pixel mixing factor. This is the first parameter of glblendfunc. It tells OpenGL how to deal with this new pixel.

4. This is the indicator of the target pixel mixing factor. This is the second parameter of glblendfunc () and tells OpenGL how to process the target pixel.

Find the above four information. OpenGL can calculate the new source and target mixed factors and put them into the target memory. Simply put, I just deleted all the garbage.

The key is two parameters in glblendfunc.

In the preceding example, we use the following code to set the hybrid function:

Glblendfunc (gl_one, gl_one );

The two parameters are the same: gl_one. The first parameter indicates the source or input pixel value, and the second parameter indicates the target pixel value.

Here there are a series of different mixed factor specifiers that can be passed into glblendfunc (). What you need to know here is that they do not work independently. They must be used in combination to express our mixed effect.

This is the most important point. I know whether I have listed the options, but I need you to remember this theory first.

If you want to get the best blending effect, you need to clarify your idea, because here, the new color and part of the transparent object (Our rectangle) and the original solid object are mutually affected. This is the result of a combination of mixed factors.

To understand this, we can use some examples. What are the meanings of these two parameters! I want to tell you what happened when you changed the parameters.

This function enables hybrid by default.
GlEnable ():

GlBlendFunc (GL_ONE, GL_ZERO );

Change the second parameter to GL_ZERO. Do you remember that the second parameter affects our solid objects in the buffer zone, rather than some transparent objects, which gives us the following results:

Oh, what happened to our background object? Don't explain it too much. You know that GL_ZERO is the most important clue.

This is not because there is no mix, but because the target pixel is multiplied by the RGBA color (,), resulting in no rendering. This source (two rectangles) is multiplied by (,) because it is GL_ONE. This pixel is completely displayed.

If you have not made any changes to glBlendFunc (), this is the same as it is now, because this is the default status.

Change the following two parameters again:

GlBlendFunc (GL_ZERO, GL_ONE );

No doubt, the two rectangles disappear (this is what you did, you multiply them by 0)

Now you know what GL_ZERO and GL_ONE mean. Now let's take a look at the list of parameters supported in glBlendFunc:

GL_ZERO
GL_ONE
GL_SRC_COLOR
GL_ONE_MINUS_SRC_COLOR
GL_DST_COLOR
GL_ONE_MINUS_DST_COLOR
GL_SRC_ALPHA
GL_ONE_MINUS_SRC_ALPHA
GL_DST_ALPHA
GL_ONE_MINUS_DST_ALPHA
GL_SRC_ALPHA_SATURATE

I will explain it in detail in subsequent tutorials. If you are interested, you can check it online.

Hybrid example
I also use several examples to illustrate these parameters. It's just to let you know different mixed effects.

GlBlendFunc (GL_SRC_ALPHA, GL_ONE );

Note that the two rectangles are more transparent? It seems that the solid object is brighter, and the transparent rectangle is darker. We have nothing to do, but your eyes have cheated you.

GlBlendFunc (GL_ONE_MINUS_DST_ALPHA, GL_ONE );

Our rectangle disappears? Well, it's incorrect. Their alpha is the-1 of the target. Therefore, our target alpha is 1.0. So 1.0-1.0 = 0.0

One thing to note is that the background color is set by glClearColor, And the alpha value is 1.0. Then we modify the clear color.

GlClearColor (0.0, 0.0, 0.0, 0.0 );

Only change this line. Let's look at the effect:

Can you see what this is? Although it seems to have moved to the background of a solid object, it is actually a mixture of work. From the previous example, no matter which pixel OpenGL is rendering, the rectangle is 1.0 transparent as long as there is an alpha of 100%. Now the background has an alpha of 0.0, so 1.0-0.0 = 1.0.

Let's see if there is anything closer.

The color of the red rectangle is defined as: (1.0, 0.0, 0.0, 0.4 ). so if the background is 0 alpha, the rendering or mixed color is (1.0, 0.0, 0.0, 0.4 ). black is the simplest background color. Let's change it to blue.

GlClearColor (0.0, 0.0, 1.0, 0.0 );

We will get the following picture:

The blue background is clear. At present, cubes and pyramids are mixed as before. But the transparent rectangle has changed and looks like gray.

I will use the last example and calculation. Shows you how to get the final pixel.

GlBlendFunc (GL_SRC_ALPHA, GL_DST_ALPHA );

The last hybrid combination ....
Let's see what is the most common parameter pair:

GlBlendFunc (GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA );

The test results here look like the following:

Add additional mix
You do not need to set mixing for each pixel of an object. You can add a few layers to some transparent objects. Add the following function after drawing the second rectangle.

GlPushMatrix ();
{
GlTranslatef (0.0, 0.0,-3.0 );
GlScalef (1.0, 0.3, 1.0 );
GlColor4f (1.0, 1.0, 1.0, 0.6 );
GlDrawArrays (GL_TRIANGLE_FAN, 0, 4 );
}
GlPopMatrix ();

What we need to do is add a third rectangle, and OpenGL will mix it together.

Of course, I made a function not introduced yet: glScalef ().

Scaling-something I haven't introduced yet!
Scaling is to zoom in and out the object. Here there are three parameters: xscale, yscale, and zscale.

In the preceding example, xscale and zscale are 1. So keep the original size. If the value is greater than 1, it means to zoom in. If the value is smaller than 1, it means to zoom out. The above is 0.3, so it is reduced to the original 30%. The result of a mixed cube and a pyramid.

Very simple. It should include the previous processing.