BAB 1 Introduction to OpenGL
1.3 Persiapan di Android Studio (AS)
1.3.8 Konfigurasi "AS + Genymotion"
Langkah-langkah untuk install Genymotion Master installer genymotion-2.3.1-vbox.exe adalah sebagai berikut :
1. Install “Genymotion”
Gambar 1.239 Install Genymotion 2. Klik OK
3. Setup Genymotion, Klik “Next”
Gambar 1.241 Setup – Genymotion I
Gambar 1.243 Setup – Genymotion III
Gambar 1.245 Setup – Genymotion V
4. Proses Installing, Klik Yes To Install Virtual Box baru
Gambar 1.247 Install VirtualBox I
Gambar 1.249 Install VirtualBox III
Gambar 1.251 Install VirtualBox VI
5. Klik Finish
Gambar 1.253 Install VirtualBox VIII
Langkah-langkah untuk Konfigurasi Genymotion di Android Studio adalah sebagai berikut :
1. Android Studio, Klik File > Settings. 2. Pilih Plugins
3. Browse Repositories, ketik “Genymotion”, Klik “Install plugin”
Gambar 1.255 Ketik “Genymotion”, Klik “Install plugin” 4. Klik Yes
Gambar 1.257 Download Plugins 5. Klik “Restart Android Studio”
Gambar 1.258 Klik “Close”
Langkah-langkah untuk Running Project OpenGL dari Android Studio (dengan emulator Genymotion) adalah sebagai berikut : 1. Android Studio, Klik File > Settings.
Gambar 1.260 Android Studio, Klik File > Settings.
2. Klik Genymotion
3. Tekan Tombol “Shift + Enter” atau Klik “Kotak Kecil” disebelah kanan text field “Select the path to the Genymotion folder”
Gambar 1.262 Klik “Kotak Kecil” disebelah kanan text field
4. Browse lokasi dimana anda menginstall Genymotion misal di “C:\Program Files\Genymobile\Genymotion”, lalu klik OK
5. Sehingga di “” tampil seperti gambar berikut, lalu klik OK
Gambar 1.264 Content Select the path to the Genymotion folder
6. Jalankan Genymotion di Android Studio dengan klik logo Genymotion
Gambar 1.265 Logo Genymotion di Android Studio
7. Tampilan beberapa list virtual device (emulator) Android di Genymotion yang sudah anda download sebelumnya dari Genymotion yang dijalankan melalui Program Files atau double klik logo Genymotion di Desktop. Jika belum ada yang tampil di list, klik Refresh
8. Pilih salah satu virtual device yang ingin anda jalankan
Gambar 1.267 Pilih salah satu virtual device 9. Klik Start untuk menjalankan virtual device
Gambar 1.268 Klik Start (Run Virtual Device)
10. Loading Android di virtual device
11. Tampilan awal virtual device Genymotion
12. Tampilan kode program
Gambar 1.275 MainActivity.java
Gambar 1.277 ESRender.java 13. Detail Sourcecode
Source Code 1.1 MainActivity.java
MainActivity.java
package com.introduction_to_opengl_es;
import android.opengl.GLSurfaceView;
import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.Window;
import android.view.WindowManager;
// By : Imam Cholissodin ([email protected])
public class MainActivity extends Activity {
/** The OpenGL view */
private GLSurfaceView glSurfaceView;
@Override
protected void onCreate(Bundle savedIn- stanceState) {
super.onCreate(savedInstanceState);
// requesting to turn the title OFF
requestWindowFea- ture(Window.FEATURE_NO_TITLE);
// making it full screen
getWin-
dow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCR EEN,
WindowManag- er.LayoutParams.FLAG_FULLSCREEN);
// Initiate the Open GL view and create an instance with this activity
glSurfaceView = new GLSurfaceView(this);
// set our renderer to be the main ren- derer with the current activity context
glSurfaceView.setRenderer(new ESRen- der());
setContentView(glSurfaceView); }
/**
* Remember to resume the glSurface */
@Override
protected void onResume() {
super.onResume();
glSurfaceView.onResume(); }
/**
* Also pause the glSurface */
@Override
protected void onPause() {
super.onPause();
glSurfaceView.onPause(); }
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.main,
menu);
return true; }
Source Code 1.2 Point_n_Lines_with_Points_Object.java
Point_n_Lines_with_Points_Object.java
package com.introduction_to_opengl_es;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
import javax.microedition.khronos.opengles.GL10;
import android.util.Log;
// By : Imam Cholissodin ([email protected])
public class Point_n_Lines_with_Points_Object {
private float vertices_line_with_points[] =
null;
private float vertices_line_with_points_color[] = null; float x, y; float step_loop = 0.001f; float x1, y1; float x2, y2; float array_factor = 2.0f;
private int loop_line, loop_line_color;
public Point_n_Lines_with_Points_Object() {
// ============ start to generate verti- ces to create line with point
========================== x1 = -1.0f; y1 = -1.0f; x2 = 1.0f; y2 = 1.0f; loop_line = 0; loop_line_color = 0; vertices_line_with_points = new
float[(int)(array_factor*(x2 - x1) / step_loop) * 3];
// 3 is number of dimension x,y,z
vertices_line_with_points_color = new float[(int)(array_factor*(x2 - x1) / step_loop) * 4];
// 4 is number of channel color r,g,b,a
float m = (y2 - y1) / (x2 - x1); // count gradient
verti-
ces_line_with_points[loop_line] = (float)(x); // as x value
verti-
ces_line_with_points[loop_line + 1] = (float)(m*(x -
x1) + y1); // as y value
verti-
ces_line_with_points[loop_line + 2] = 0; // as z val- ue, z=0 is to assume that the object is on 2D
loop_line += 3;
//Generate color for each vertex
verti-
ces_line_with_points_color[loop_line_color] = (float)Math.abs(Math.sin(x)); // Red Channel
verti-
ces_line_with_points_color[loop_line_color + 1] = (float)Math.abs(Math.cos((m*(x - x1) + y1))); // Green Channel verti- ces_line_with_points_color[loop_line_color + 2] = 0.0f; // Blue Channel verti- ces_line_with_points_color[loop_line_color + 3] =
1.0f; // set transparant value (alpha)
loop_line_color += 4; } /* x=x1; while(x<=x2){ vertices_line_with_points[loop_line] = (float) (x); // as x value vertices_line_with_points[loop_line+1] = (float) (m*(x-x1)+y1); // as y value
vertices_line_with_points[loop_line+2]=0; // as z value, z=0 is to assume that the object is on 2D
loop_line+=3;
//Generate color for each vertex verti-
ces_line_with_points_color[loop_line_color]=(float) Math.abs(Math.sin(x)); // Red Channel
verti-
ces_line_with_points_color[loop_line_color+1]=(float) Math.abs(Math.cos((m*(x-x1)+y1))); // Green Channel
verti-
Blue Channel
verti-
ces_line_with_points_color[loop_line_color+3]=1.0f; // set transparant value (alpha)
loop_line_color+=4; x+=step_loop; }
*/
// ============= end for generate verti- ces to create line with point ====================
}
// Point to our vertex buffer, return buffer holding the vertices
public static FloatBuffer makeFloatBuff- er(float[] arr) {
ByteBuffer bb = ByteBuff- er.allocateDirect(arr.length * 4);
bb.order(ByteOrder.nativeOrder());
FloatBuffer fb = bb.asFloatBuffer();
fb.put(arr);
fb.position(0);
return fb; }
/** The draw method for the primitive object with the GL context */
public void draw_points(GL10 gl) {
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
// set the global colour for all the points
gl.glColor4f(1.0f, 0.0f, 0.0f, 1.0f);
// List Point to our vertex buffer with manually
gl.glVertexPointer(3, GL10.GL_FLOAT, 0,
makeFloatBuffer(new float [] {
1.0f, 1.0f, 0.0f, // V1
- first vertex (x,y,z)
1.0f, 0.8f, 0.0f, // V2 1.0f, 0.6f, 0.0f, // V3 1.0f, 0.4f, 0.0f, // V4
// V5 1.0f, 0.0f, 0.0f, // V6 1.0f, -0.2f, 0.0f, // V7 1.0f, -0.4f, 0.0f, // V8 1.0f, -0.6f, 0.0f, // V9 1.0f, -0.8f, 0.0f, // V10 1.0f, -1.0f, 0.0f, // V11 0.8f, -1.0f, 0.0f, // V12 0.6f, -1.0f, 0.0f, // V13 0.4f, -1.0f, 0.0f, // V14 0.2f, -1.0f, 0.0f, // V15 0.0f, -1.0f, 0.0f, // V16 -0.2f, -1.0f, 0.0f, // V17 -0.4f, -1.0f, 0.0f, // V18 -0.6f, -1.0f, 0.0f, // V19 -0.7f, -1.0f, 0.0f, // V20 -0.8f, -1.0f, 0.0f, // V21 -1.0f, -1.0f, 0.0f, // V22 }));
// Draw the vertices as points
gl.glDrawArrays(GL10.GL_POINTS, 0, 22);
// 0 is start index, 22 is length of list points
//Disable the client state before leaving
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY); }
/*public void draw_line(GL10 gl){
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY); // set the global colour for the line
// Point to our vertex buffer
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, make- FloatBuffer(new float [] {
1.0f, 1.0f, 0.0f, // V1 - first vertex
(x,y,z)
-1.0f, -1.0f, 0.0f, // V2 - second vertex }));
// Draw the vertices as lines
gl.glDrawArrays(GL10.GL_LINES, 0, 2); //Disable the client state before leaving gl.glDisableClientState(GL10.GL_VERTEX_ARRAY); }*/
public void draw_line_with_points_color(GL10 gl) {
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
// Lish all points to our vertex buffer
gl.glVertexPointer(3, GL10.GL_FLOAT, 0,
makeFloatBuffer(vertices_line_with_points));
// Set/ mapping the colour for the line each vertex
gl.glColorPointer(4, GL10.GL_FLOAT, 0,
makeFloatBuffer(vertices_line_with_points_color));
// Draw the vertices as lines with points :
/////////////////////////////////////////// // start draw with exact length of array //
///////////////////////////////////////////
gl.glDrawArrays(GL10.GL_POINTS, 0, (int)(loop_line / 3)); // 3 is number of dimension x,y,z
//gl.glDrawArrays(GL10.GL_POINTS, 0, (int) (loop_line_color / 4)); // 4 is number of chan- nel color r,g,b,a
///////////////////////////////////////////
// end draw with exact length of array //
///////////////////////////////////////////
///////////////////////////////////////////////
// start draw with not exact length of array //
///////////////////////////////////////////////
//gl.glDrawArrays(GL10.GL_POINTS, 0, (int) (Math.abs((x2 - x1)) / step_loop));
// or
//gl.glDrawArrays(GL10.GL_POINTS, 0, (int) (verti-
ces_line_with_points.length/(array_factor*3))); // 3 is number of dimension x,y,z
// or
//gl.glDrawArrays(GL10.GL_POINTS, 0, (int) (verti-
// 3 is number of dimension x,y,z
///////////////////////////////////////////////
// end draw with not exact length of array //
///////////////////////////////////////////////
// to tracking log.v
// try type like this "tag:value.loop_" without quotes on search "verbose".
Log.v("value loop_line", "" + loop_line);
Log.v("value loop_line/3", "" + loop_line
/ 3);
Log.v("value loop_line_color", "" +
loop_line_color);
Log.v("value loop_line_color/4", "" +
loop_line_color / 4);
Log.v("value Math.abs((x2 - x1)) / step_loop)", "" + (Math.abs((x2 - x1)) / step_loop));
Log.v("value verti-
ces_line_with_points.length", "" + verti- ces_line_with_points.length);
Log.v("value verti-
ces_line_with_points.length/(array_factor*3)", "" + (int)(vertices_line_with_points.length / (array_factor
* 3)));
Log.v("value verti-
ces_line_with_points_color.length", "" + verti- ces_line_with_points_color.length);
Log.v("value verti-
ces_line_with_points_color.length/(array_factor*4)",
"" + (int)(vertices_line_with_points_color.length / (array_factor * 4)));
//Disable the client state before leaving
gl.glDisableClientState(GL10.GL_COLOR_ARRAY); }
}
Source Code 1.3 ESRender.java
ESRender.java
package com.introduction_to_opengl_es;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import android.opengl.GLSurfaceView.Renderer;
import android.opengl.GLU;
// By : Imam Cholissodin ([email protected])
public class ESRender implements Renderer {
private Point_n_Lines_with_Points_Object point_n_linesobject;// the object to be drawn
/** Constructor to set the handed over context */
public ESRender() {
this.point_n_linesobject = new Point_n_Lines_with_Points_Object();
}
@Override
public void onDrawFrame(GL10 gl) {
gl.glClearColor(1.0f, 1.0f, 1.0f, 1.0f);
// set background with white color
//gl.glClearColor(0.0f, 0.0f, 0.0f, 1.0f); // set background with black color
gl.glClear(GL10.GL_COLOR_BUFFER_BIT |
GL10.GL_DEPTH_BUFFER_BIT); // clear Screen and Depth Buffer
gl.glPushMatrix(); // start freeze state/event to each object
gl.glTranslatef(0.0f, 0.0f, -5.0f);
gl.glPointSize(3);
gl.glEnable(GL10.GL_POINT_SMOOTH);
point_n_linesobject.draw_points(gl);
gl.glPopMatrix(); // end freeze state/event to each object
// display drawing create line with points
gl.glPushMatrix();
gl.glTranslatef(0.0f, 0.0f, -5.0f);
gl.glPointSize(3); // set size of points
gl.glEnable(GL10.GL_POINT_SMOOTH); point_n_linesobject.draw_line_with_points_color( gl); gl.glPopMatrix(); } @Override
public void onSurfaceChanged(GL10 gl, int width, int height) {
if (height == 0)
height = 1; // To prevent divide by zero
float aspect = (float)width / height;
// Set the viewport (display area) to cover the entire window
gl.glViewport(0, 0, width, height);
// Setup perspective projection, with as- pect ratio matches viewport
gl.glMatrixMode(GL10.GL_PROJECTION); // Select projection matrix
gl.glLoadIdentity(); // Reset projection matrix
// Use perspective projection
GLU.gluPerspective(gl, 45, aspect, 0.1f,
100.f);
gl.glMatrixMode(GL10.GL_MODELVIEW); // Select model-view matrix
gl.glLoadIdentity(); // Reset
}
@Override
point_n_linesobject = new Point_n_Lines_with_Points_Object();
} }
14. Klik Run ‘app’ untuk menjalankan project OpenGL
Gambar 1.278 Run 'app'
Gambar 1.279 Gradle: Executing Tasks [:app:assembleDebug]
15. Pilih running device, klik OK
Gambar 1.280 Pilih running device
Gambar 1.281 Gradle build finished
17. “Log.v” di kode program
Gambar 1.283 “Log.v” di kode program
18. Tampilan tracking log.v “try type like this "tag:value.loop_" without quotes on search "verbose" di Android Device Monitor.