Komputer Grafis adalah cabang dari Ilmu Komputer dan berkai-tan dengan manipulasi visual content dan proses sistesisnya secara digital. Walaupun istilah ini sering mengacu kepada komputer grafik 3 dimensi, tetapi sebenarnya juga mencakup grafik 2 dimensi dan pen-golahan citra. Grafik meliputi gambar dan pencitraan lain yang dihasil-kan oleh komputer berbentuk garis, lengkungan, kurva dan seba-gainya. Komputer dapat menghasilkan pencitraan dalam sejumlah pixel, dan printer dot matrix akan mencetak citra/gambar tersebut da-lam sejumlah titik. Perkembangan grafika komputer menuntut para pengembang sistem aplikasi grafika komputer untuk dapat mengembangkan suatu informasi yang dilengkapi dengan visualisasi dan animasi, agar dapat lebih mudah dipahami oleh pihak yang menggunakan sistem tersebut. Grafika komputer telah menunjukkan kemajuan yang pesat dalam pengembangan berbagai aplikasi untuk menghasilkan gambar.

1. Grafika Komputer - Primitive &Transformations
Membuat Objek Kotak Bergaris dengan menggunakan Eclips
package com.example.Rectangle;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
import javax.microedition.khronos.opengles.GL10;
public class Rectangle {
private float vertices[] = {
-0.7f, -0.5f, 0.0f, // V1 - first vertex
(x,y,z)
-0.7f, 0.5f, 0.0f, // V1 - first vertex (x,y,z)
0.7f, 0.5f, 0.0f, // V1 - first vertex (x,y,z)
0.7f, -0.5f, 0.0f, // V2 - second vertex
-0.7f, -0.5f, 0.0f // V1 - first vertex (x,y,z)
};
private float vertices_color[] = {
1.0f, 1.0f, 1.0f, 1.0f, // V1 - first vertex
(x,y,z)
1.0f, 1.0f, 1.0f, 1.0f, // V1 - first vertex
(x,y,z)
1.0f, 1.0f, 1.0f, 1.0f, // V1 - first vertex
(x,y,z)
1.0f, 1.0f, 1.0f, 1.0f, // V2 - second vertex
1.0f, 1.0f, 1.0f, 1.0f // V1 - first vertex
(x,y,z)
};
public static FloatBuffer makeFloatBuffer(float[] arr){
ByteBuffer bb = ByteBuffer.allocateDirect(arr.length * 4);
bb.order(ByteOrder.nativeOrder());
FloatBuffer fb = bb.asFloatBuffer();
fb.put(arr);
fb.position(0);
return fb;
}
public void draw_kotak(GL10 gl) {
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
// Point to our vertex buffer
gl.glVertexPointer(3, GL10.GL_FLOAT, 0,
makeFloatBuffer(vertices));
// Draw the vertices as square
gl.glColorPointer(4, GL10.GL_FLOAT, 0,
makeFloatBuffer(vertices_color));
gl.glDrawArrays(GL10.GL_TRIANGLES, 0, 3);

2. gl.glColorPointer(4, GL10.GL_FLOAT, 0,
makeFloatBuffer(vertices_color));
gl.glDrawArrays(GL10.GL_TRIANGLES, 2, 3);
//Disable the client state before leaving
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
gl.glDisableClientState(GL10.GL_COLOR_ARRAY);
}
public void draw_line(GL10 gl) {
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
//gl.glEnableClientState(GL10.GL_COLOR_ARRAY);
// set the colour for the line (pemberian warna untuk garis)
gl.glColor4f(0.0f, 0.0f, 0.0f, 1.0f);
// Point to our vertex buffer (mendata nilai lokasi/posisi titik yang
menyusun garis)
gl.glVertexPointer(3, GL10.GL_FLOAT, 0, makeFloatBuffer(new float [] {
0.0f, 1.0f, 0.0f, // V1 - first vertex (x,y,z)
0.0f, 0.0f, 0.0f, // V2 - second vertex
}));
// Draw the vertices as lines (menggambar garis dari titik-titik)
gl.glDrawArrays(GL10.GL_LINES, 0, 2);
//Disable the client state before leaving
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
//gl.glDisableClientState(GL10.GL_COLOR_ARRAY);
}
}
GIRenderer.java
package com.example.Rectangle;
import javax.microedition.khronos.opengles.GL10;
import javax.microedition.khronos.egl.EGLConfig;
import com.example.Rectangle.Rectangle;
import android.opengl.GLU;
import android.opengl.GLSurfaceView.Renderer;
public class GlRenderer implements Renderer {
private Rectangle object; // the triangle to be drawn
/** Constructor to set the handed over context */
public GlRenderer() {
this.object = new Rectangle();
}
@Override
public void onDrawFrame(GL10 gl) {
// clear Screen and Depth Buffer

3. gl.glClear(GL10.GL_COLOR_BUFFER_BIT |
GL10.GL_DEPTH_BUFFER_BIT);
gl.glLoadIdentity();
// menampilkan persegi dengan gradasi warna
gl.glPushMatrix();
gl.glTranslatef(0.0f, 0.0f, -5.0f);
object.draw_kotak(gl);
gl.glPopMatrix();
//menampilkan arsiran garis
gl.glPushMatrix();
gl.glTranslatef(0.0f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
//geser kanan
gl.glPushMatrix();
gl.glTranslatef(0.1f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(0.2f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(0.3f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(0.4f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(0.5f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(0.6f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
//geser kiri
gl.glPushMatrix();
gl.glTranslatef(-0.1f, -0.5f, -5.0f);

4. gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(-0.2f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(-0.3f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(-0.4f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(-0.5f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
gl.glPushMatrix();
gl.glTranslatef(-0.6f, -0.5f, -5.0f);
gl.glLineWidth(1.0f);
gl.glEnable(GL10.GL_LINE_SMOOTH);
object.draw_line(gl);
gl.glPopMatrix();
}
@Override
public void onSurfaceChanged(GL10 gl, int width, int height) {
if(height == 0) { //Prevent
A Divide By Zero By
height = 1; //Making
Height Equal One
}
gl.glViewport(0, 0, width, height); //Reset The Current
Viewport
gl.glMatrixMode(GL10.GL_PROJECTION); //Select The Projection
Matrix
gl.glLoadIdentity(); //Reset
The Projection Matrix
//Calculate The Aspect Ratio Of The Window
GLU.gluPerspective(gl, 45.0f, (float)width / (float)height,
0.1f, 100.0f);
gl.glMatrixMode(GL10.GL_MODELVIEW); //Select The Modelview
Matrix
gl.glLoadIdentity(); //Reset
The Modelview Matrix

5. }
@Override
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
object = new Rectangle();
}
}
MainActivity.java
package com.example.Rectangle;
import com.example.Rectangle.GlRenderer;
import android.opengl.GLSurfaceView;
import android.os.Bundle;
import android.app.Activity;
import android.view.Window;
import android.view.WindowManager;
public class MainActivity extends Activity {
private GLSurfaceView glSurfaceView;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// requesting to turn the title OFF
requestWindowFeature(Window.FEATURE_NO_TITLE);
// making it full screen
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.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 renderer with
// the current activity context
glSurfaceView.setRenderer(new GlRenderer());
setContentView(glSurfaceView);
}
/**
* Remember to resume the glSurface
*/
@Override
protected void onResume() {
super.onResume();
glSurfaceView.onResume();
}
/**

6. * Also pause the glSurface
*/
@Override
protected void onPause() {
super.onPause();
glSurfaceView.onPause();
}
}
Hasil Screenshoot :