</div>
<h1>EvasGLCube Sample Overview</h1>
- <p>The EvasGLCube sample application demonstrates how to implement a rotatable cube on the screen using Evas_GL with the Tizen SDK. The sample shows how to handle polygon geometry, and how to write a simple vertex and fragment shader for the cube. Evas_GL is similar to the EGL™ layer and is related to ElmGLView.</p>
+ <p>The EvasGLCube sample application demonstrates how to implement a rotatable cube on the screen using EvasGL with the Tizen SDK. The sample shows how to handle polygon geometry, and how to write a simple vertex and fragment shader for the cube. EvasGL is similar to the EGL™ layer and is related to GLView.</p>
<table class="note">
<th class="note">Note</th>
</tr>
<tr>
- <td class="note">The application presented in this overview is not a full Tizen application, since it does not use the Application Framework. The application simply starts and runs.<p>A 3D application using the OpenGL® ES must use the ElmGLView. Evas GL can be used in special cases, such as a multi-thread.</p></td>
+ <td class="note">The application presented in this overview is not a full Tizen application, since it does not use the Application Framework. The application simply starts and runs.<p>A 3D application using the OpenGL ES must use the GLView. EvasGL can be used in special cases, such as a multi-thread.</p></td>
</tr>
</tbody>
</table>
<p>The following figure illustrates the main screen of the EvasGLCube.</p>
<p class="figure">Figure: EvasGLCube screen</p>
- <p align="center"><img alt="Evas_GL screen" src="../images/evas_gl_sd.png" /></p>
-
-<h2>Setting up the OpenGL® Surface</h2>
-<p>The Evas_GL interface is similar to the EGL interface. It can be connected to Evas so that OpenGL® ES code works with Evas 2D objects.</p>
-<p>This sample shows how to implement with Evas_GL to use OpenGL® ES:</p>
+ <p align="center"><img alt="EvasGLCube screen" src="../images/evas_gl_sd.png" /></p>
+
+<h2>Setting up the OpenGL ES Surface</h2>
+<p>The EvasGL interface is similar to the EGL interface. It can be connected to Evas so that OpenGL ES code works with Evas 2D objects.</p>
+<p>This sample shows how to implement with EvasGL to use OpenGL ES:</p>
<p>Create the application:</p>
<pre class="prettyprint">
<pre class="prettyprint">EVAS_GL_GLOBAL_GLES2_DEFINE();</pre>
-<p>The Evas_GL or ElmGLView program uses the wrapper function by the supported Evas GL. The wrapper function's interface is the same as OpenGL® ES's. This macro can provide a set of convenience wrapper function tables.</p>
+<p>The EvasGL or GLView program uses the wrapper functions by the supported Evas GL. The wrapper function's interface is the same as OpenGL ES's. This macro can provide a set of convenience wrapper function tables.</p>
<pre class="prettyprint">
Evas_Object *add_win(const char *name)
{
return win;
}
</pre>
-<p>Before creating the Elm Window, set the GL Rendering Engine using the <span style="font-family: Courier New,Courier,monospace">elm_config_accel_preference_set("opengl")</span> function because Evas GL runs with Evas GL Render Engine.</p>
+<p>Before creating the Elm Window, we set the GL Rendering Engine using the <span style="font-family: Courier New,Courier,monospace">elm_config_accel_preference_set("opengl")</span> because EvasGL runs with EvasGL Render Engine.</p>
<h2>Setting up Callbacks</h2>
<p>To set up callbacks:</p>
<ol>
-<li>Initialize the OpenGL® ES.
+<li>Initialize the OpenGL ES.
<p>The following example creates a shader:</p>
<pre class="prettyprint">
static void init_evasgl(appdata_s *ad)
{
+ Ecore_Animator *ani;
+
// Set config of the surface for Evas GL
ad->cfg = evas_gl_config_new();
- ad->cfg->color_format = EVAS_GL_RGBA_8888;
+ ad->cfg->color_format = EVAS_GL_RGB_888;
ad->cfg->depth_bits = EVAS_GL_DEPTH_BIT_24;
ad->cfg->stencil_bits = EVAS_GL_STENCIL_NONE;
ad->cfg->options_bits = EVAS_GL_OPTIONS_NONE;
// Get the window size
Evas_Coord w,h;
- evas_object_geometry_get(ad->win, NULL, NULL, &w, &h);
+ evas_object_geometry_get(ad->win, NULL, NULL, &ad->surface_w, &ad->surface_h);
// Get the Evas GL handle for doing GL things
ad->evasgl = evas_gl_new(evas_object_evas_get(ad->win));
// Create a surface and context
- ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, w, h);
+ ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, ad->surface_w, ad->surface_h);
ad->ctx = evas_gl_context_create(ad->evasgl, NULL);
EVAS_GL_GLOBAL_GLES2_USE(ad->evasgl, ad->ctx);
ad->mouse_down = EINA_FALSE;
ad->initialized = EINA_FALSE;
- // Set up the image object. A filled one by default.
- ad->img = evas_object_image_filled_add(evas_object_evas_get(ad->win));
+ ad->img = evas_object_image_filled_add(evas_object_evas_get(ad->conform));
evas_object_event_callback_add(ad->img, EVAS_CALLBACK_DEL, img_del_cb, ad);
evas_object_image_pixels_get_callback_set(ad->img, img_pixel_cb, ad);
evas_object_event_callback_add(ad->img, EVAS_CALLBACK_MOUSE_UP, mouse_up_cb, ad);
evas_object_event_callback_add(ad->img, EVAS_CALLBACK_MOUSE_MOVE, mouse_move_cb, ad);
- evas_object_event_callback_add(ad->win, EVAS_CALLBACK_RESIZE, win_resize_cb, ad);
- ecore_animator_add(animate_cb, ad->img);
-}
-
-if (!ad->sfc)
-{
- Evas_Native_Surface ns;
-
- ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, w, h);
- evas_gl_native_surface_get(ad->evasgl, ad->sfc, &ns);
- evas_object_image_native_surface_set(ad->img, &ns);
- evas_object_image_pixels_dirty_set(ad->img, EINA_TRUE);
+ ani = ecore_animator_add(animate_cb, ad->img);
+ evas_object_data_set(ad->img, "ani", ani);
+ elm_object_content_set(ad->conform,ad->img);
}
</pre>
-<p>To use Evas GL, create it, set its configuration, and create the Evas GL surface and context. For rendering, connect Evas GL with the Evas Object Image using the <span style="font-family: Courier New,Courier,monospace">evas_object_image_native_surface_set()</span> function.</p>
+<p>To use EvasGL, we first create it, then set its configuration, and create the Evas GL surface and context. For rendering, we connect EvasGL with the Evas Object Image using the <span style="font-family: Courier New,Courier,monospace">evas_object_image_native_surface_set()</span>.</p>
</li>
<li>Resize callbacks.
-<p>The Evas GL resize behavior is related to Evas Object Image or Elm Window. In the following example, the Elm Window resize callback is used. When resizing occurs, Evas GL Surface is recreated and reconnected to Evas Object Image.</p>
+<p>The EvasGL resize behavior is related to Evas Object Image or Elm Window. In the following example, the Elm Window resize callback is used. When resizing occurs, EvasGL Surface is recreated and reconnected to Evas Object Image.</p>
<pre class="prettyprint">
static void win_resize_cb(void *data, Evas *e , Evas_Object *obj , void *event_info)
{
ad->sfc = NULL;
}
- Evas_Coord w,h;
- evas_object_geometry_get(obj, NULL, NULL, &w, &h);
- evas_object_image_size_set(ad->img, w, h);
- evas_object_resize(ad->img, w, h);
+ evas_object_geometry_get(obj, NULL, NULL, &ad->surface_w, &ad->surface_h);
+ evas_object_image_size_set(ad->img, ad->surface_w, ad->surface_h);
+ evas_object_resize(ad->img, ad->surface_w, ad->surface_h);
evas_object_show(ad->img);
if (!ad->sfc)
{
Evas_Native_Surface ns;
- ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, w, h);
+ ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, ad->surface_w, ad->surface_h);
evas_gl_native_surface_get(ad->evasgl, ad->sfc, &ns);
evas_object_image_native_surface_set(ad->img, &ns);
evas_object_image_pixels_dirty_set(ad->img, EINA_TRUE);
}
+}
</pre>
</li>
<pre class="prettyprint">
evas_object_image_pixels_get_callback_set(ad->img, img_pixel_cb, ad);
</pre>
-<p>This callback function is provided for on-demand mode. Especially, if Evas GL uses <span style="font-family: Courier New,Courier,monospace">EVAS_GL_OPTIONS_DIRECT</span>, all OpenGL® ES options are called in this callback function.</p>
+<p>This callback function is provided for on-demand mode. Especially, if Evas GL uses <span style="font-family: Courier New,Courier,monospace">EVAS_GL_OPTIONS_DIRECT</span>, all OpenGL ES options are called in this callback function.</p>
<pre class="prettyprint">
static void img_pixel_cb(void *data, Evas_Object *obj)
{
glBindBuffer(GL_ARRAY_BUFFER, ad->vbo);
glBufferData(GL_ARRAY_BUFFER, 3 * 72 * 4, cube_vertices,GL_STATIC_DRAW);
init_matrix(view);
- if (w > h)
+ if (ad->surface_w > ad->surface_h)
{
- aspect = (float)w/h;
+ aspect = (float)ad->surface_w / ad->surface_h;
view_set_ortho(view, -1.0 * aspect, 1.0 * aspect, -1.0, 1.0, -1.0, 1.0);
}
else {
- aspect = (float)h/w;
+ aspect = (float)ad->surface_h / ad->surface_w;
view_set_ortho(view, -1.0, 1.0, -1.0 * aspect, 1.0 *aspect, -1.0, 1.0);
}
ad->initialized = EINA_TRUE;
}
- glViewport(0, 0, w, h);
+ glViewport(0, 0, ad->surface_w, ad->surface_h);
glClearColor(0.0f, 0.0f, 0.0f, 1.0f);
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
</li>
<li>Add animators.
-<p>The application above is technically working but the scene does not get updated unless the object is marked as such. Games usually use an animator to have a regular update of the scene. The following is an example for a default update refresh rate:</p>
+<p>The scene does not get updated unless the object is marked as such. Games usually use an animator to have a regular update of the scene. The following is an example for a default update refresh rate:</p>
<pre class="prettyprint">
static Eina_Bool animate_cb(void *data)
{
}
</pre>
-<p>The <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_dirty_set()</span> function is the Evas Object image which is connected Evas GL. After that, the <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_get_callback_set()</span> callback function is called whenever Evas renders.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_dirty_set()</span> function sets dirty bit of the Evas Object image which is connected Evas GL. After that, the <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_get_callback_set()</span> callback function is called whenever Evas renders.</p>
</li>
<li>Delete callbacks.
-<p>The delete callback is triggered when the Evas GL is destroyed from the main loop. No other callback can be called on the same object afterwards.</p>
+<p>The delete callback is triggered when the EvasGL is destroyed from the main loop. No other callback can be called on the same object afterwards.</p>
<pre class="prettyprint">
static void img_del_cb(void *data, Evas *e , Evas_Object *obj , void *event_info)
{
appdata_s *ad = data;
+ Ecore_Animator *ani = evas_object_data_get(ad->img, "ani");
+ ecore_animator_del(ani);
// Free the GL resources when image object is deleted
evas_gl_make_current(ad->evasgl, ad->sfc, ad->ctx);
\r
<h1>GLView11Cube Sample Overview</h1> \r
\r
-<p>The GLView11Cube sample demonstrates how you can use ElmGLView to create a 3D cube using OpenGL® ES 1.1.</p>\r
+<p>The GLView11Cube sample demonstrates how you can use GLView to create a 3D cube using OpenGL ES 1.1.</p>\r
\r
<table class="note"> \r
<tbody> \r
</tbody> \r
</table> \r
\r
-<p>This sample extends the functionality of OpenGL® ES 1.1 on the Tizen platform to create spinning 3D cubes. OpenGL® is a standard specification defining a cross-language, cross-platform API for writing applications that produce 2D and 3D computer graphics. OpenGL® ES 1.1 is light-weight but packed with functionalities for hardware acceleration, improved image quality with multi-texture support, and optimizations to increase performance while reducing memory bandwidth usage to save power. ElmGLView can support the surface for 3D rendering.</p>\r
+<p>This sample extends the functionality of OpenGL ES 1.1 on the Tizen platform to create spinning 3D cubes. OpenGL ES is a standard specification defining a cross-language, cross-platform API for writing applications that produce 2D and 3D computer graphics. OpenGL ES 1.1 is light-weight but powerful for hardware acceleration, improves image quality with multi-texture support, and optimizes to increase performance while reducing memory bandwidth usage to save power. GLView can support the surface for 3D rendering.</p>\r
\r
<p class="figure">Figure: GLView11Cube</p> \r
<p align="center"><img alt="GLView11Cube" src="../images/glview11_cube.png" /></p> \r
\r
\r
<h2>Initializing the Application</h2>\r
-<p>The easiest way to use OpenGL® within an EFL application is to rely on the Elementary GLView component.</p>\r
-<p>Current GLView can support both GELS2.0 and 1.1. GLView with the GLES 1.1 basic application has a similar basic format as the other GLView application.</p>\r
+<p>The easiest tool to use OpenGL ES within an EFL application is to rely on the Elementary GLView widget.</p>\r
+<p>Current GLView can support both GLES 2.0 and 1.1. GLView with the GLES 1.1 basic application has a similar format as the other GLView application.</p>\r
<p>Create a basic application:</p>\r
<pre class="prettyprint">\r
#include <Evas_GL.h>\r
#include <dlog.h>\r
</pre>\r
\r
-<p>The GLView application should include the header files as the <span style="font-family: Courier New,Courier,monospace"><Evas_GL.h></span> and <span style="font-family: Courier New,Courier,monospace"><Elementary.h></span>. The <span style="font-family: Courier New,Courier,monospace"><efl_extension.h></span> header file is related to key events and the <span style="font-family: Courier New,Courier,monospace"><dlog.h></span> header file is for seeing logs.</p>\r
+<p>The GLView application should include the header files as the <span style="font-family: Courier New,Courier,monospace"><Evas_GL.h></span> and <span style="font-family: Courier New,Courier,monospace"><Elementary.h></span>. The <span style="font-family: Courier New,Courier,monospace"><efl_extension.h></span> header file is for key events and the <span style="font-family: Courier New,Courier,monospace"><dlog.h></span> header file is for logs view.</p>\r
<pre class="prettyprint">\r
#define S(a) evas_object_show(a)\r
\r
{\r
Evas_Object *obj;\r
\r
- // Create a GLView with an OpenGL®-ES 1.1 context\r
+ // Create a GLView with an OpenGL ES 1.1 context\r
obj = elm_glview_version_add(ad->win, EVAS_GL_GLES_1_X);\r
elm_table_pack(ad->table, obj, 1, 1, 3, 1);\r
evas_object_data_set(obj, APPDATA_KEY, ad);\r
}\r
</pre>\r
\r
-<p>To create ElmGLView with GLES 1.1, use the <span style="font-family: Courier New,Courier,monospace">elm_glview_version_add()</span> function with the specific version (<span style="font-family: Courier New,Courier,monospace">EVAS_GL_GLES_1_X</span>). The current ElmGLView can support both GLES 2.0 and 1.1.</p>\r
+<p>To create GLView with GLES 1.1, use the <span style="font-family: Courier New,Courier,monospace">elm_glview_version_add()</span> function with the specific version (<span style="font-family: Courier New,Courier,monospace">EVAS_GL_GLES_1_X</span>). The current GLView can support both GLES 2.0 and 1.1.</p>\r
\r
<h2>Setting up Callbacks</h2>\r
<p>To set up callbacks:</p>\r
<ol>\r
<li>Set the initialization callback.\r
-<p>The initialization callback is called when the GLView is first created, after a valid OpenGL® context and surface have been created. This is called from the main loop, as are the 3 other callbacks.</p>\r
+<p>The initialization callback is called when the GLView is first created, after a valid OpenGL ES context and surface created. This is called from the main loop, as are the 3 other callbacks.</p>\r
<pre class="prettyprint">\r
#include <Elementary_GL_Helpers.h></pre>\r
\r
-<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenience functions and macros. To use these functions and macros, include the header file in the application.</p>\r
+<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenient functions and macros. To use these functions and macros, include the header file in the application.</p>\r
<pre class="prettyprint">\r
void\r
init_gles(Evas_Object *obj)\r
<th class="note">Note</th> \r
</tr> \r
<tr> \r
- <td class="note">OpenGL® ES 1.1 application can be implemented in Tizen. However, if OpenGL® ES 1.1 and OpenGL® ES 2.0 are used together, they cannot be used in the same file.</td> \r
+ <td class="note">OpenGL ES 1.1 application can be implemented in Tizen. However, if OpenGL ES 1.1 and OpenGL ES 2.0 are used together, they cannot be used in the same file.</td>\r
</tr> \r
</tbody> \r
</table>\r
\r
<h1>GLViewCube Sample Overview</h1> \r
\r
-<p>This sample demonstrates how to render with OpenGL® ES 2.0 using an Elementary GLView component. It goes through the creation of a simple UI and how to draw a rotating cube using simple vertex and fragment shaders.</p>\r
+<p>This sample demonstrates how to render with OpenGL ES 2.0 using an Elementary GLView Widget. It goes through the creation of a simple UI and how to draw a rotating cube using simple vertex and fragment shaders.</p>\r
\r
<table class="note"> \r
<tbody> \r
<p align="center"><img alt="GLViewCube" src="../images/glview_cube.png" /></p> \r
\r
<h2>Elementary_GL_Helpers</h2>\r
-<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenience functions and macros. To use these functions and macros, include this header file in the application.</p>\r
+<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenient functions and macros. To use these functions and macros, include this header file in the application.</p>\r
<pre class="prettyprint">\r
#include <app.h>\r
#include <Elementary.h>\r
{\r
...\r
// Create and initialize GLView\r
- gl = elm_glview_add(win);\r
+ gl = elm_glview_add(ad->conform);\r
ELEMENTARY_GLVIEW_GLOBAL_USE(gl);\r
...\r
}\r
<h2>Setting up Callbacks</h2>\r
<ol>\r
<li>Set the initialization callback.\r
-<p>The initialization callback is called when the GLView is first created, after a valid OpenGL® context and surface have been created.</p>\r
-<p>This callback function initializes shaders using the <span style="font-family: Courier New,Courier,monospace">init_shaders(obj)</span> function.</p>\r
+<p>The initialization callback is called when the GLView is first created, after a valid OpenGL ES context and surface have been created.</p>\r
+<p>This callback function initializes shaders using the <span style="font-family: Courier New,Courier,monospace">init_shaders(obj)</span>.</p>\r
\r
<pre class="prettyprint">\r
static void init_gl(Evas_Object *obj) \r
<li>Initialize the shaders.\r
<ol type="a">\r
<li>The shader instances for the fragment and vertex shader are compiled and created by passing the shader type as a parameter to the <span style="font-family: Courier New,Courier,monospace">glCreateShader()</span> function.\r
- <p>Load the shader objects, use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>\r
+ <p>We should Load the shader objects, and use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>\r
<pre class="prettyprint">\r
static void init_shaders(Evas_Object *obj) \r
{\r
glShaderSource(ad->fgmt_shader, 1, &p, NULL);\r
glCompileShader(ad->fgmt_shader);\r
</pre></li>\r
- <li>Once the shader objects have been loaded, a shader program is created. The program attaches and links the shader objects to the shader program.\r
+ <li>Once the shader objects loaded, a shader program is created. The program attaches and links the shader objects to the shader program.\r
<pre class="prettyprint">\r
ad->program = glCreateProgram();\r
glAttachShader(ad->program, ad->vtx_shader);\r
<pre class="prettyprint">\r
static void resize_gl(Evas_Object *obj) \r
{\r
- int w, h;\r
- elm_glview_size_get(obj, &w, &h);\r
- glViewport(0, 0, w, h);\r
+ appdata_s *ad = evas_object_data_get(obj, "ad");\r
+ elm_glview_size_get(obj, &ad->glview_w, &ad->glview_h);\r
}\r
</pre>\r
</li>\r
static void draw_gl(Evas_Object *obj) \r
{\r
...\r
- elm_glview_size_get(obj, &w, &h);\r
- ...\r
- glViewport(0, 0, w, h);\r
+ glViewport(0, 0, ad->glview_w, ad->glview_h);\r
</pre>\r
</li>\r
<li>The <span style="font-family: Courier New,Courier,monospace">glVertexAttribPointer()</span> function is used to define an array of generic vertex attribute data. These attributes are parameters associated with each vertex of the cube. In this case, the parameters are position and color. In both instances, the final parameter (vertices and colors) represent the previously defined arrays - vertices and colors.\r
<pre class="prettyprint">\r
static Eina_Bool anim(void *data) \r
{\r
-elm_glview_changed_set(data);\r
-return EINA_TRUE;\r
+ elm_glview_changed_set(data);\r
+ return EINA_TRUE;\r
}\r
\r
static bool app_create(void *data) \r
<h1>GLViewShader Sample Overview</h1>
-<p>The GLViewShader sample demonstrates how to render more complex geometries with OpenGL® ES 2.0, using slightly more advanced vertex and fragment shaders to draw a rotating teapot. It also demonstrates how to use Elementary GLView helper macros to port existing code easily to Tizen.</p>
+<p>The GLViewShader sample demonstrates how to render more complex geometries with OpenGL ES 2.0, using slightly more advanced vertex and fragment shaders to draw a rotating teapot. It also demonstrates how to use Elementary GLView helper macros to port existing code easily to Tizen.</p>
<table class="note">
<tbody>
<p align="center"><img alt="GLViewShader" src="../images/glview_shader.png" /></p>
<h2>Elementary_GL_Helpers</h2>
-<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenience functions and macros. To use these functions and macros, include this header file in the application.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenient functions and macros. To use these functions and macros, include this header file in the application.</p>
<pre class="prettyprint">
#include <app.h>
#include <Elementary.h>
{
...
// Create and initialize GLView
- gl = elm_glview_add(win);
+ gl = elm_glview_add(ad->conform);
ELEMENTARY_GLVIEW_GLOBAL_USE(gl);
...
}
<p>To set up callbacks:</p>
<ol>
<li>Set the initialization callback.
-<p>The initialization callback is called when the GLView is first created, after a valid OpenGL® context and surface have been created.</p>
+<p>The initialization callback is called when the GLView is first created, after a valid OpenGL ES context and surface have been created.</p>
<p>This callback function initializes shaders using the <span style="font-family: Courier New,Courier,monospace">init_shaders(obj)</span> function.</p>
-<p>A Vertex Buffer Object (VBO) allows vertex array data to be stored in a high-performance graphics memory on the server, enabling efficient data transfer.</p>
+<p>A Vertex Buffer Object (VBO) allows vertex array data to be stored in a high-performance graphics memory on the server, to maximize data transfer efficiency.</p>
<p>A VBO is created in the application for the teapot vertices. Additionally, an Index Buffer Object (IBO) is created for the indices. The <span style="font-family: Courier New,Courier,monospace">glGenBuffers()</span> function specifies an array in which the buffer object name is stored.</p>
<p>The <span style="font-family: Courier New,Courier,monospace">glBindBuffer()</span> function binds the buffer object to a specified target. In this case, the target is <span style="font-family: Courier New,Courier,monospace">GL_ARRAY_BUFFER</span>.</p>
<p>The <span style="font-family: Courier New,Courier,monospace">glBufferData()</span> function is used to create a new data storage for the current buffer object. The parameters of the function are the buffer object target, the data store size, the array of teapot vertices, and the usage function of the data store (in this case, <span style="font-family: Courier New,Courier,monospace">GL_STATIC_DRAW</span>).</p>
<li>Initialize the shaders:
<ol type="a">
- <li>The shader instances for the fragment and vertex shader are compiled and created by passing the shader type as a parameter to the <span style="font-family: Courier New,Courier,monospace">glCreateShader()</span> function.
- <p>Load the shader objects, use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>
+ <li>Vertex and fragment shaders are created and compiled by passing shader parameters to the<span style="font-family: Courier New,Courier,monospace">glCreateShader()</span> function.
+ <p>We should load the shader objects, use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>
<pre class="prettyprint">
static void init_shaders(Evas_Object *obj)
glShaderSource(ad->fgmt_shader, 1, &p, NULL);
glCompileShader(ad->fgmt_shader);
</pre></li>
- <li>Once the shader objects have been loaded, a shader program is created. The program attaches and links the shader objects to the shader program.
+ <li>Once the shader objects are loaded, a shader program is created. The program attaches and links the shader objects to the shader program.
<pre class="prettyprint">
ad->program = glCreateProgram();
glAttachShader(ad->program, ad->vtx_shader);
</pre>
</li>
-<li>Get the location for each vertex or pixel attribute in the shader program using the <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> and <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> functions. If the shader program attributes, such as <span style="font-family: Courier New,Courier,monospace">u_mvpMatrix</span> and <span style="font-family: Courier New,Courier,monospace">a_position</span> are valid, these functions return an integer value that represents the index location of the attributes. For invalid attributes, the return value is -1.
-<p>The <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> function retrieves the location of the attributes that have an effect on groups of vertices or pixels, such as model view matrix, projection matrix, or light position. The <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> retrieves the location of the attributes that have an effect on a vertex or pixel, such as position vector, normal vector, or vertex color.</p>
+<li>Get the location for each attribute in the shader program using the <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> and <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> functions. If the shader program attributes, such as <span style="font-family: Courier New,Courier,monospace">u_mvpMatrix</span> and <span style="font-family: Courier New,Courier,monospace">a_position</span> are valid, these functions return an integer value that represents the index location of the attributes. For invalid attributes, the return value is -1.
+<p>The <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> retrieves the location of the uniform related to groups of vertices or pixels, such as model view matrix, projection matrix, or light position. The <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> retrieves the location of the attributes trelated to a vertex or pixel, such as position vector, normal vector, or vertex color.</p>
<pre class="prettyprint">
ad->idx_light_dir = glGetUniformLocation(ad->program, "u_light_dir");
ad->idx_mvp = glGetUniformLocation(ad->program, "u_mvpMatrix");
<pre class="prettyprint">
static void resize_gl(Evas_Object *obj)
{
- int w, h;
- elm_glview_size_get(obj, &w, &h);
- glViewport(0, 0, w, h);
+ appdata_s *ad = evas_object_data_get(obj, "ad");
+ elm_glview_size_get(obj, &ad->glview_w, &ad->glview_h);
}
</pre>
</li>
static void draw_gl(Evas_Object *obj)
{
...
- elm_glview_size_get(obj, &w, &h);
+ elm_glview_size_get(obj, &ad->glview_w, &ad->glview_h);
...
- glViewport(0, 0, w, h);
+ glViewport(0, 0, ad->glview_w, ad->glview_h);
</pre>
</li>
<li>The <span style="font-family: Courier New,Courier,monospace">glUniform4fv()</span> function modifies the light direction in the graphic based on the light-related information of the teapot.
</li>
<li>The <span style="font-family: Courier New,Courier,monospace">glFlush()</span> function empties all buffers causing all issued commands to be executed as quickly as they are accepted by the rendering engine.
- <p>Finally, the vertex attribute arrays are disabled using the <span style="font-family: Courier New,Courier,monospace">glDisableVertexAttribArray()</span> function, and the buffer object binding is released by calling the <span style="font-family: Courier New,Courier,monospace">glBindBuffer()</span> function and specifying the buffer as 0.</p>
+ <p>Finally, the vertex attribute arrays are disabled using the <span style="font-family: Courier New,Courier,monospace">glDisableVertexAttribArray()</span> function, and the buffer object binding is released by calling the <span style="font-family: Courier New,Courier,monospace">glBindBuffer()</span> function. The buffer is reset at 0.</p>
<pre class="prettyprint">
glFlush();
</li></ol></li>
<li>Add an animator.
-<p>The application regularly triggers updates of the GLView using the <span style="font-family: Courier New,Courier,monospace">elm_glview_changed_set()</span> function.</p>
+<p>The application regularly triggers the update of the GLView using the <span style="font-family: Courier New,Courier,monospace">elm_glview_changed_set()</span> function.</p>
<pre class="prettyprint">
static Eina_Bool anim(void *data)
{
-elm_glview_changed_set(data);
-return EINA_TRUE;
+ elm_glview_changed_set(data);
+ return EINA_TRUE;
}
static bool app_create(void *data)
</li>
<li>Set the delete callback.
-<p>The delete callback is triggered when the GLView is being destroyed from the main loop.</p>
+<p>The delete callback is triggered when the GLView is destroyed from the main loop.</p>
<p>The <span style="font-family: Courier New,Courier,monospace">glDeleteBuffers()</span>, <span style="font-family: Courier New,Courier,monospace">glDeleteShader()</span>, and <span style="font-family: Courier New,Courier,monospace">glDeleteProgram()</span> functions are used to free the memory.</p>
<pre class="prettyprint">
static void del_gl(Evas_Object *obj)
</div>
<h1>EvasGLCube Sample Overview</h1>
- <p>The EvasGLCube sample application demonstrates how to implement a rotatable cube on the screen using Evas_GL with the Tizen SDK. The sample shows how to handle polygon geometry, and how to write a simple vertex and fragment shader for the cube. Evas_GL is similar to the EGL™ layer and is related to ElmGLView.</p>
+ <p>The EvasGLCube sample application demonstrates how to implement a rotatable cube on the screen using EvasGL with the Tizen SDK. The sample shows how to handle polygon geometry, and how to write a simple vertex and fragment shader for the cube. EvasGL is similar to the EGL™ layer and is related to GLView.</p>
<table class="note">
<th class="note">Note</th>
</tr>
<tr>
- <td class="note">The application presented in this overview is not a full Tizen application, since it does not use the Application Framework. The application simply starts and runs.<p>A 3D application using the OpenGL® ES must use the ElmGLView. Evas GL can be used in special cases, such as a multi-thread.</p></td>
+ <td class="note">The application presented in this overview is not a full Tizen application, since it does not use the Application Framework. The application simply starts and runs.<p>A 3D application using the OpenGL ES must use the GLView. EvasGL can be used in special cases, such as a multi-thread.</p></td>
</tr>
</tbody>
</table>
<p>The following figure illustrates the main screen of the EvasGLCube.</p>
- <p class="figure">Figure: EvasGLCubeEvasGLCube screen</p>
- <p align="center"><img alt="Evas_GL screen" src="../images/evas_gl_sd_wn.png" /></p>
-
-<h2>Setting up the OpenGL® Surface</h2>
-<p>The Evas_GL interface is similar to the EGL interface. It can be connected to Evas so that OpenGL® ES code works with Evas 2D objects.</p>
-<p>This sample shows how to implement with Evas_GL to use OpenGL® ES:</p>
+ <p class="figure">Figure: EvasGLCube screen</p>
+ <p align="center"><img alt="EvasGLCube screen" src="../images/evas_gl_sd_wn.png" /></p>
+
+<h2>Setting up the OpenGL ES Surface</h2>
+<p>The EvasGL interface is similar to the EGL interface. It can be connected to Evas so that OpenGL ES code works with Evas 2D objects.</p>
+<p>This sample shows how to implement with EvasGL to use OpenGL ES:</p>
<p>Create the application:</p>
<pre class="prettyprint">
<pre class="prettyprint">EVAS_GL_GLOBAL_GLES2_DEFINE();</pre>
-<p>The Evas_GL or ElmGLView program uses the wrapper function by the supported Evas GL. The wrapper function's interface is the same as OpenGL® ES's. This macro can provide a set of convenience wrapper function tables.</p>
+<p>The EvasGL or GLView program uses the wrapper functions by the supported Evas GL. The wrapper function's interface is the same as OpenGL ES's. This macro can provide a set of convenience wrapper function tables.</p>
<pre class="prettyprint">
Evas_Object *add_win(const char *name)
{
return win;
}
</pre>
-<p>Before creating the Elm Window, set the GL Rendering Engine using the <span style="font-family: Courier New,Courier,monospace">elm_config_accel_preference_set("opengl")</span> function because Evas GL runs with Evas GL Render Engine.</p>
+<p>Before creating the Elm Window, we set the GL Rendering Engine using the <span style="font-family: Courier New,Courier,monospace">elm_config_accel_preference_set("opengl")</span> because EvasGL runs with EvasGL Render Engine.</p>
<h2>Setting up Callbacks</h2>
<p>To set up callbacks:</p>
<ol>
-<li>Initialize the OpenGL® ES.
+<li>Initialize the OpenGL ES.
<p>The following example creates a shader:</p>
<pre class="prettyprint">
static void init_evasgl(appdata_s *ad)
{
+ Ecore_Animator *ani;
+
// Set config of the surface for Evas GL
ad->cfg = evas_gl_config_new();
- ad->cfg->color_format = EVAS_GL_RGBA_8888;
+ ad->cfg->color_format = EVAS_GL_RGB_888;
ad->cfg->depth_bits = EVAS_GL_DEPTH_BIT_24;
ad->cfg->stencil_bits = EVAS_GL_STENCIL_NONE;
ad->cfg->options_bits = EVAS_GL_OPTIONS_NONE;
// Get the window size
Evas_Coord w,h;
- evas_object_geometry_get(ad->win, NULL, NULL, &w, &h);
+ evas_object_geometry_get(ad->win, NULL, NULL, &ad->surface_w, &ad->surface_h);
// Get the Evas GL handle for doing GL things
ad->evasgl = evas_gl_new(evas_object_evas_get(ad->win));
// Create a surface and context
- ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, w, h);
+ ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, ad->surface_w, ad->surface_h);
ad->ctx = evas_gl_context_create(ad->evasgl, NULL);
EVAS_GL_GLOBAL_GLES2_USE(ad->evasgl, ad->ctx);
ad->mouse_down = EINA_FALSE;
ad->initialized = EINA_FALSE;
- // Set up the image object. A filled one by default.
- ad->img = evas_object_image_filled_add(evas_object_evas_get(ad->win));
+ ad->img = evas_object_image_filled_add(evas_object_evas_get(ad->conform));
evas_object_event_callback_add(ad->img, EVAS_CALLBACK_DEL, img_del_cb, ad);
evas_object_image_pixels_get_callback_set(ad->img, img_pixel_cb, ad);
evas_object_event_callback_add(ad->img, EVAS_CALLBACK_MOUSE_UP, mouse_up_cb, ad);
evas_object_event_callback_add(ad->img, EVAS_CALLBACK_MOUSE_MOVE, mouse_move_cb, ad);
- evas_object_event_callback_add(ad->win, EVAS_CALLBACK_RESIZE, win_resize_cb, ad);
- ecore_animator_add(animate_cb, ad->img);
-}
-
-if (!ad->sfc)
-{
- Evas_Native_Surface ns;
-
- ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, w, h);
- evas_gl_native_surface_get(ad->evasgl, ad->sfc, &ns);
- evas_object_image_native_surface_set(ad->img, &ns);
- evas_object_image_pixels_dirty_set(ad->img, EINA_TRUE);
+ ani = ecore_animator_add(animate_cb, ad->img);
+ evas_object_data_set(ad->img, "ani", ani);
+ elm_object_content_set(ad->conform,ad->img);
}
</pre>
-<p>To use Evas GL, create it, set its configuration, and create the Evas GL surface and context. For rendering, connect Evas GL with the Evas Object Image using the <span style="font-family: Courier New,Courier,monospace">evas_object_image_native_surface_set()</span> function.</p>
+<p>To use EvasGL, we first create it, then set its configuration, and create the Evas GL surface and context. For rendering, we connect EvasGL with the Evas Object Image using the <span style="font-family: Courier New,Courier,monospace">evas_object_image_native_surface_set()</span>.</p>
</li>
<li>Resize callbacks.
-<p>The Evas GL resize behavior is related to Evas Object Image or Elm Window. In the following example, the Elm Window resize callback is used. When resizing occurs, Evas GL Surface is recreated and reconnected to Evas Object Image.</p>
+<p>The EvasGL resize behavior is related to Evas Object Image or Elm Window. In the following example, the Elm Window resize callback is used. When resizing occurs, EvasGL Surface is recreated and reconnected to Evas Object Image.</p>
<pre class="prettyprint">
static void win_resize_cb(void *data, Evas *e , Evas_Object *obj , void *event_info)
{
ad->sfc = NULL;
}
- Evas_Coord w,h;
- evas_object_geometry_get(obj, NULL, NULL, &w, &h);
- evas_object_image_size_set(ad->img, w, h);
- evas_object_resize(ad->img, w, h);
+ evas_object_geometry_get(obj, NULL, NULL, &ad->surface_w, &ad->surface_h);
+ evas_object_image_size_set(ad->img, ad->surface_w, ad->surface_h);
+ evas_object_resize(ad->img, ad->surface_w, ad->surface_h);
evas_object_show(ad->img);
if (!ad->sfc)
{
Evas_Native_Surface ns;
- ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, w, h);
+ ad->sfc = evas_gl_surface_create(ad->evasgl, ad->cfg, ad->surface_w, ad->surface_h);
evas_gl_native_surface_get(ad->evasgl, ad->sfc, &ns);
evas_object_image_native_surface_set(ad->img, &ns);
evas_object_image_pixels_dirty_set(ad->img, EINA_TRUE);
}
+}
</pre>
</li>
<pre class="prettyprint">
evas_object_image_pixels_get_callback_set(ad->img, img_pixel_cb, ad);
</pre>
-<p>This callback function is provided for on-demand mode. Especially, if Evas GL uses <span style="font-family: Courier New,Courier,monospace">EVAS_GL_OPTIONS_DIRECT</span>, all OpenGL® ES options are called in this callback function.</p>
+<p>This callback function is provided for on-demand mode. Especially, if Evas GL uses <span style="font-family: Courier New,Courier,monospace">EVAS_GL_OPTIONS_DIRECT</span>, all OpenGL ES options are called in this callback function.</p>
<pre class="prettyprint">
static void img_pixel_cb(void *data, Evas_Object *obj)
{
glBindBuffer(GL_ARRAY_BUFFER, ad->vbo);
glBufferData(GL_ARRAY_BUFFER, 3 * 72 * 4, cube_vertices,GL_STATIC_DRAW);
init_matrix(view);
- if (w > h)
+ if (ad->surface_w > ad->surface_h)
{
- aspect = (float)w/h;
+ aspect = (float)ad->surface_w / ad->surface_h;
view_set_ortho(view, -1.0 * aspect, 1.0 * aspect, -1.0, 1.0, -1.0, 1.0);
}
else {
- aspect = (float)h/w;
+ aspect = (float)ad->surface_h / ad->surface_w;
view_set_ortho(view, -1.0, 1.0, -1.0 * aspect, 1.0 *aspect, -1.0, 1.0);
}
ad->initialized = EINA_TRUE;
}
- glViewport(0, 0, w, h);
+ glViewport(0, 0, ad->surface_w, ad->surface_h);
glClearColor(0.0f, 0.0f, 0.0f, 1.0f);
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
</li>
<li>Add animators.
-<p>The application above is technically working but the scene does not get updated unless the object is marked as such. Games usually use an animator to have a regular update of the scene. The following is an example for a default update refresh rate:</p>
+<p>The scene does not get updated unless the object is marked as such. Games usually use an animator to have a regular update of the scene. The following is an example for a default update refresh rate:</p>
<pre class="prettyprint">
static Eina_Bool animate_cb(void *data)
{
}
</pre>
-<p>The <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_dirty_set()</span> function is the Evas Object image which is connected Evas GL. After that, the <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_get_callback_set()</span> callback function is called whenever Evas renders.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_dirty_set()</span> function sets dirty bit of the Evas Object image which is connected Evas GL. After that, the <span style="font-family: Courier New,Courier,monospace">evas_object_image_pixels_get_callback_set()</span> callback function is called whenever Evas renders.</p>
</li>
<li>Delete callbacks.
-<p>The delete callback is triggered when the Evas GL is destroyed from the main loop. No other callback can be called on the same object afterwards.</p>
+<p>The delete callback is triggered when the EvasGL is destroyed from the main loop. No other callback can be called on the same object afterwards.</p>
<pre class="prettyprint">
static void img_del_cb(void *data, Evas *e , Evas_Object *obj , void *event_info)
{
appdata_s *ad = data;
+ Ecore_Animator *ani = evas_object_data_get(ad->img, "ani");
+ ecore_animator_del(ani);
// Free the GL resources when image object is deleted
evas_gl_make_current(ad->evasgl, ad->sfc, ad->ctx);
\r
<h1>GLView11Cube Sample Overview</h1> \r
\r
-<p>The GLView11Cube sample demonstrates how you can use ElmGLView to create a 3D cube using OpenGL® ES 1.1.</p>\r
+<p>The GLView11Cube sample demonstrates how you can use GLView to create a 3D cube using OpenGL ES 1.1.</p>\r
\r
<table class="note"> \r
<tbody> \r
</tbody> \r
</table> \r
\r
-<p>This sample extends the functionality of OpenGL® ES 1.1 on the Tizen platform to create spinning 3D cubes. OpenGL® is a standard specification defining a cross-language, cross-platform API for writing applications that produce 2D and 3D computer graphics. OpenGL® ES 1.1 is light-weight but packed with functionalities for hardware acceleration, improved image quality with multi-texture support, and optimizations to increase performance while reducing memory bandwidth usage to save power. ElmGLView can support the surface for 3D rendering.</p>\r
+<p>This sample extends the functionality of OpenGL ES 1.1 on the Tizen platform to create spinning 3D cubes. OpenGL ES is a standard specification defining a cross-language, cross-platform API for writing applications that produce 2D and 3D computer graphics. OpenGL ES 1.1 is light-weight but powerful for hardware acceleration, improves image quality with multi-texture support, and optimizes to increase performance while reducing memory bandwidth usage to save power. GLView can support the surface for 3D rendering.</p>\r
\r
<p class="figure">Figure: GLView11Cube</p> \r
<p align="center"><img alt="GLView11Cube" src="../images/glview11_cube_wn.png" /></p> \r
\r
\r
<h2>Initializing the Application</h2>\r
-<p>The easiest way to use OpenGL® within an EFL application is to rely on the Elementary GLView component.</p>\r
-<p>Current GLView can support both GELS2.0 and 1.1. GLView with the GLES 1.1 basic application has a similar basic format as the other GLView application.</p>\r
+<p>The easiest tool to use OpenGL ES within an EFL application is to rely on the Elementary GLView widget.</p>\r
+<p>Current GLView can support both GLES 2.0 and 1.1. GLView with the GLES 1.1 basic application has a similar format as the other GLView application.</p>\r
<p>Create a basic application:</p>\r
<pre class="prettyprint">\r
#include <Evas_GL.h>\r
#include <dlog.h>\r
</pre>\r
\r
-<p>The GLView application should include the header files as the <span style="font-family: Courier New,Courier,monospace"><Evas_GL.h></span> and <span style="font-family: Courier New,Courier,monospace"><Elementary.h></span>. The <span style="font-family: Courier New,Courier,monospace"><efl_extension.h></span> header file is related to key events and the <span style="font-family: Courier New,Courier,monospace"><dlog.h></span> header file is for seeing logs.</p>\r
+<p>The GLView application should include the header files as the <span style="font-family: Courier New,Courier,monospace"><Evas_GL.h></span> and <span style="font-family: Courier New,Courier,monospace"><Elementary.h></span>. The <span style="font-family: Courier New,Courier,monospace"><efl_extension.h></span> header file is for key events and the <span style="font-family: Courier New,Courier,monospace"><dlog.h></span> header file is for logs view.</p>\r
<pre class="prettyprint">\r
#define S(a) evas_object_show(a)\r
\r
{\r
Evas_Object *obj;\r
\r
- // Create a GLView with an OpenGL®-ES 1.1 context\r
+ // Create a GLView with an OpenGL ES 1.1 context\r
obj = elm_glview_version_add(ad->win, EVAS_GL_GLES_1_X);\r
elm_table_pack(ad->table, obj, 1, 1, 3, 1);\r
evas_object_data_set(obj, APPDATA_KEY, ad);\r
}\r
</pre>\r
\r
-<p>To create ElmGLView with GLES 1.1, use the <span style="font-family: Courier New,Courier,monospace">elm_glview_version_add()</span> function with the specific version (<span style="font-family: Courier New,Courier,monospace">EVAS_GL_GLES_1_X</span>). The current ElmGLView can support both GLES 2.0 and 1.1.</p>\r
+<p>To create GLView with GLES 1.1, use the <span style="font-family: Courier New,Courier,monospace">elm_glview_version_add()</span> function with the specific version (<span style="font-family: Courier New,Courier,monospace">EVAS_GL_GLES_1_X</span>). The current GLView can support both GLES 2.0 and 1.1.</p>\r
\r
<h2>Setting up Callbacks</h2>\r
<p>To set up callbacks:</p>\r
<ol>\r
<li>Set the initialization callback.\r
-<p>The initialization callback is called when the GLView is first created, after a valid OpenGL® context and surface have been created. This is called from the main loop, as are the 3 other callbacks.</p>\r
+<p>The initialization callback is called when the GLView is first created, after a valid OpenGL ES context and surface created. This is called from the main loop, as are the 3 other callbacks.</p>\r
<pre class="prettyprint">\r
#include <Elementary_GL_Helpers.h></pre>\r
\r
-<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenience functions and macros. To use these functions and macros, include the header file in the application.</p>\r
+<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenient functions and macros. To use these functions and macros, include the header file in the application.</p>\r
<pre class="prettyprint">\r
void\r
init_gles(Evas_Object *obj)\r
<th class="note">Note</th> \r
</tr> \r
<tr> \r
- <td class="note">OpenGL® ES 1.1 application can be implemented in Tizen. However, if OpenGL® ES 1.1 and OpenGL® ES 2.0 are used together, they cannot be used in the same file.</td> \r
+ <td class="note">OpenGL ES 1.1 application can be implemented in Tizen. However, if OpenGL ES 1.1 and OpenGL ES 2.0 are used together, they cannot be used in the same file.</td>\r
</tr> \r
</tbody> \r
</table>\r
\r
<h1>GLViewCube Sample Overview</h1> \r
\r
-<p>This sample demonstrates how to render with OpenGL® ES 2.0 using an Elementary GLView component. It goes through the creation of a simple UI and how to draw a rotating cube using simple vertex and fragment shaders.</p>\r
+<p>This sample demonstrates how to render with OpenGL ES 2.0 using an Elementary GLView Widget. It goes through the creation of a simple UI and how to draw a rotating cube using simple vertex and fragment shaders.</p>\r
\r
<table class="note"> \r
<tbody> \r
<p align="center"><img alt="GLViewCube" src="../images/glview_cube_wn.png" /></p> \r
\r
<h2>Elementary_GL_Helpers</h2>\r
-<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenience functions and macros. To use these functions and macros, include this header file in the application.</p>\r
+<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenient functions and macros. To use these functions and macros, include this header file in the application.</p>\r
<pre class="prettyprint">\r
#include <app.h>\r
#include <Elementary.h>\r
{\r
...\r
// Create and initialize GLView\r
- gl = elm_glview_add(win);\r
+ gl = elm_glview_add(ad->conform);\r
ELEMENTARY_GLVIEW_GLOBAL_USE(gl);\r
...\r
}\r
<h2>Setting up Callbacks</h2>\r
<ol>\r
<li>Set the initialization callback.\r
-<p>The initialization callback is called when the GLView is first created, after a valid OpenGL® context and surface have been created.</p>\r
-<p>This callback function initializes shaders using the <span style="font-family: Courier New,Courier,monospace">init_shaders(obj)</span> function.</p>\r
+<p>The initialization callback is called when the GLView is first created, after a valid OpenGL ES context and surface have been created.</p>\r
+<p>This callback function initializes shaders using the <span style="font-family: Courier New,Courier,monospace">init_shaders(obj)</span>.</p>\r
\r
<pre class="prettyprint">\r
static void init_gl(Evas_Object *obj) \r
<li>Initialize the shaders.\r
<ol type="a">\r
<li>The shader instances for the fragment and vertex shader are compiled and created by passing the shader type as a parameter to the <span style="font-family: Courier New,Courier,monospace">glCreateShader()</span> function.\r
- <p>Load the shader objects, use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>\r
+ <p>We should Load the shader objects, and use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>\r
<pre class="prettyprint">\r
static void init_shaders(Evas_Object *obj) \r
{\r
glShaderSource(ad->fgmt_shader, 1, &p, NULL);\r
glCompileShader(ad->fgmt_shader);\r
</pre></li>\r
- <li>Once the shader objects have been loaded, a shader program is created. The program attaches and links the shader objects to the shader program.\r
+ <li>Once the shader objects loaded, a shader program is created. The program attaches and links the shader objects to the shader program.\r
<pre class="prettyprint">\r
ad->program = glCreateProgram();\r
glAttachShader(ad->program, ad->vtx_shader);\r
<pre class="prettyprint">\r
static void resize_gl(Evas_Object *obj) \r
{\r
- int w, h;\r
- elm_glview_size_get(obj, &w, &h);\r
- glViewport(0, 0, w, h);\r
+ appdata_s *ad = evas_object_data_get(obj, "ad");\r
+ elm_glview_size_get(obj, &ad->glview_w, &ad->glview_h);\r
}\r
</pre>\r
</li>\r
static void draw_gl(Evas_Object *obj) \r
{\r
...\r
- elm_glview_size_get(obj, &w, &h);\r
- ...\r
- glViewport(0, 0, w, h);\r
+ glViewport(0, 0, ad->glview_w, ad->glview_h);\r
</pre>\r
</li>\r
<li>The <span style="font-family: Courier New,Courier,monospace">glVertexAttribPointer()</span> function is used to define an array of generic vertex attribute data. These attributes are parameters associated with each vertex of the cube. In this case, the parameters are position and color. In both instances, the final parameter (vertices and colors) represent the previously defined arrays - vertices and colors.\r
<pre class="prettyprint">\r
static Eina_Bool anim(void *data) \r
{\r
-elm_glview_changed_set(data);\r
-return EINA_TRUE;\r
+ elm_glview_changed_set(data);\r
+ return EINA_TRUE;\r
}\r
\r
static bool app_create(void *data) \r
<h1>GLViewShader Sample Overview</h1>
-<p>The GLViewShader sample demonstrates how to render more complex geometries with OpenGL® ES 2.0, using slightly more advanced vertex and fragment shaders to draw a rotating teapot. It also demonstrates how to use Elementary GLView helper macros to port existing code easily to Tizen.</p>
+<p>The GLViewShader sample demonstrates how to render more complex geometries with OpenGL ES 2.0, using slightly more advanced vertex and fragment shaders to draw a rotating teapot. It also demonstrates how to use Elementary GLView helper macros to port existing code easily to Tizen.</p>
<table class="note">
<tbody>
<p align="center"><img alt="GLViewShader" src="../images/glview_shader_wn.png" /></p>
<h2>Elementary_GL_Helpers</h2>
-<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenience functions and macros. To use these functions and macros, include this header file in the application.</p>
+<p>The <span style="font-family: Courier New,Courier,monospace"><Elementary_GL_Helpers.h></span> header file provides a set of convenient functions and macros. To use these functions and macros, include this header file in the application.</p>
<pre class="prettyprint">
#include <app.h>
#include <Elementary.h>
{
...
// Create and initialize GLView
- gl = elm_glview_add(win);
+ gl = elm_glview_add(ad->conform);
ELEMENTARY_GLVIEW_GLOBAL_USE(gl);
...
}
<p>To set up callbacks:</p>
<ol>
<li>Set the initialization callback.
-<p>The initialization callback is called when the GLView is first created, after a valid OpenGL® context and surface have been created.</p>
+<p>The initialization callback is called when the GLView is first created, after a valid OpenGL ES context and surface have been created.</p>
<p>This callback function initializes shaders using the <span style="font-family: Courier New,Courier,monospace">init_shaders(obj)</span> function.</p>
-<p>A Vertex Buffer Object (VBO) allows vertex array data to be stored in a high-performance graphics memory on the server, enabling efficient data transfer.</p>
+<p>A Vertex Buffer Object (VBO) allows vertex array data to be stored in a high-performance graphics memory on the server, to maximize data transfer efficiency.</p>
<p>A VBO is created in the application for the teapot vertices. Additionally, an Index Buffer Object (IBO) is created for the indices. The <span style="font-family: Courier New,Courier,monospace">glGenBuffers()</span> function specifies an array in which the buffer object name is stored.</p>
<p>The <span style="font-family: Courier New,Courier,monospace">glBindBuffer()</span> function binds the buffer object to a specified target. In this case, the target is <span style="font-family: Courier New,Courier,monospace">GL_ARRAY_BUFFER</span>.</p>
<p>The <span style="font-family: Courier New,Courier,monospace">glBufferData()</span> function is used to create a new data storage for the current buffer object. The parameters of the function are the buffer object target, the data store size, the array of teapot vertices, and the usage function of the data store (in this case, <span style="font-family: Courier New,Courier,monospace">GL_STATIC_DRAW</span>).</p>
<li>Initialize the shaders:
<ol type="a">
- <li>The shader instances for the fragment and vertex shader are compiled and created by passing the shader type as a parameter to the <span style="font-family: Courier New,Courier,monospace">glCreateShader()</span> function.
- <p>Load the shader objects, use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>
+ <li>Vertex and fragment shaders are created and compiled by passing shader parameters to the<span style="font-family: Courier New,Courier,monospace">glCreateShader()</span> function.
+ <p>We should load the shader objects, use the GLES2 Shader compiler to read and compile the shader source code for both the fragment and the vertex shader.</p>
<pre class="prettyprint">
static void init_shaders(Evas_Object *obj)
glShaderSource(ad->fgmt_shader, 1, &p, NULL);
glCompileShader(ad->fgmt_shader);
</pre></li>
- <li>Once the shader objects have been loaded, a shader program is created. The program attaches and links the shader objects to the shader program.
+ <li>Once the shader objects are loaded, a shader program is created. The program attaches and links the shader objects to the shader program.
<pre class="prettyprint">
ad->program = glCreateProgram();
glAttachShader(ad->program, ad->vtx_shader);
</pre>
</li>
-<li>Get the location for each vertex or pixel attribute in the shader program using the <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> and <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> functions. If the shader program attributes, such as <span style="font-family: Courier New,Courier,monospace">u_mvpMatrix</span> and <span style="font-family: Courier New,Courier,monospace">a_position</span> are valid, these functions return an integer value that represents the index location of the attributes. For invalid attributes, the return value is -1.
-<p>The <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> function retrieves the location of the attributes that have an effect on groups of vertices or pixels, such as model view matrix, projection matrix, or light position. The <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> retrieves the location of the attributes that have an effect on a vertex or pixel, such as position vector, normal vector, or vertex color.</p>
+<li>Get the location for each attribute in the shader program using the <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> and <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> functions. If the shader program attributes, such as <span style="font-family: Courier New,Courier,monospace">u_mvpMatrix</span> and <span style="font-family: Courier New,Courier,monospace">a_position</span> are valid, these functions return an integer value that represents the index location of the attributes. For invalid attributes, the return value is -1.
+<p>The <span style="font-family: Courier New,Courier,monospace">glGetUniformLocation()</span> retrieves the location of the uniform related to groups of vertices or pixels, such as model view matrix, projection matrix, or light position. The <span style="font-family: Courier New,Courier,monospace">glGetAttribLocation()</span> retrieves the location of the attributes trelated to a vertex or pixel, such as position vector, normal vector, or vertex color.</p>
<pre class="prettyprint">
ad->idx_light_dir = glGetUniformLocation(ad->program, "u_light_dir");
ad->idx_mvp = glGetUniformLocation(ad->program, "u_mvpMatrix");
<pre class="prettyprint">
static void resize_gl(Evas_Object *obj)
{
- int w, h;
- elm_glview_size_get(obj, &w, &h);
- glViewport(0, 0, w, h);
+ appdata_s *ad = evas_object_data_get(obj, "ad");
+ elm_glview_size_get(obj, &ad->glview_w, &ad->glview_h);
}
</pre>
</li>
static void draw_gl(Evas_Object *obj)
{
...
- elm_glview_size_get(obj, &w, &h);
+ elm_glview_size_get(obj, &ad->glview_w, &ad->glview_h);
...
- glViewport(0, 0, w, h);
+ glViewport(0, 0, ad->glview_w, ad->glview_h);
</pre>
</li>
<li>The <span style="font-family: Courier New,Courier,monospace">glUniform4fv()</span> function modifies the light direction in the graphic based on the light-related information of the teapot.
</li>
<li>The <span style="font-family: Courier New,Courier,monospace">glFlush()</span> function empties all buffers causing all issued commands to be executed as quickly as they are accepted by the rendering engine.
- <p>Finally, the vertex attribute arrays are disabled using the <span style="font-family: Courier New,Courier,monospace">glDisableVertexAttribArray()</span> function, and the buffer object binding is released by calling the <span style="font-family: Courier New,Courier,monospace">glBindBuffer()</span> function and specifying the buffer as 0.</p>
+ <p>Finally, the vertex attribute arrays are disabled using the <span style="font-family: Courier New,Courier,monospace">glDisableVertexAttribArray()</span> function, and the buffer object binding is released by calling the <span style="font-family: Courier New,Courier,monospace">glBindBuffer()</span> function. The buffer is reset at 0.</p>
<pre class="prettyprint">
glFlush();
</li></ol></li>
<li>Add an animator.
-<p>The application regularly triggers updates of the GLView using the <span style="font-family: Courier New,Courier,monospace">elm_glview_changed_set()</span> function.</p>
+<p>The application regularly triggers the update of the GLView using the <span style="font-family: Courier New,Courier,monospace">elm_glview_changed_set()</span> function.</p>
<pre class="prettyprint">
static Eina_Bool anim(void *data)
{
-elm_glview_changed_set(data);
-return EINA_TRUE;
+ elm_glview_changed_set(data);
+ return EINA_TRUE;
}
static bool app_create(void *data)
</li>
<li>Set the delete callback.
-<p>The delete callback is triggered when the GLView is being destroyed from the main loop.</p>
+<p>The delete callback is triggered when the GLView is destroyed from the main loop.</p>
<p>The <span style="font-family: Courier New,Courier,monospace">glDeleteBuffers()</span>, <span style="font-family: Courier New,Courier,monospace">glDeleteShader()</span>, and <span style="font-family: Courier New,Courier,monospace">glDeleteProgram()</span> functions are used to free the memory.</p>
<pre class="prettyprint">
static void del_gl(Evas_Object *obj)
projects / sdk / online-doc.git / commitdiff
