LAPORAN PRAKTIKUM
GRAFIKA KOMPUTER
MODUL 4
"Interaksi dengan Keyboard dan Mouse"
dibimbing oleh Bapak Heru Wahyu Herwanto, S.T, M.KOM
PENYUSUN :
Ananda Putri Syaviri
( 130533608243 )
S1 PTI – B 2013
UNIVERSITAS NEGERI MALANG
FAKULTAS TEKNIK
JURUSAN TEKNIK ELEKTRO
PRODI S1 PENDIDIKAN TEKNIK INFORMATIKA 2013 B
MARET 2015
TUJUAN
Memahami prinsip-prinsip deteksi input berupa interaksi dari keyboard.
Membuat objek 2D yang dikendalikan dengan keyboard.
Memahami prinsip-prinsip pembuatan interaksi objek 2D menggunakan mouse.
Membuat interaksi objek 2D menggunakan mouse.
DASAR TEORI
INTERAKSI KEYBOARD
1. Fungsi dasar pembuatan animasi dengan menggunakan KeyboardFunction
GLUTAPI void APIENTRY glutKeyboardFunc(void (GLUTCALLBACK
*func)(unsigned char key, int x, int y));
Dalam penggunaan glutKeyboardFunc dimungkinkan untuk mendeteksi input dari keyboard. Fungsi ini diletakkan pada fungsi main dari program, dan parameternya adalah callback function yang telah didefinisikan berupa fungsi dengan 3 parameter, seperti contoh di bawah ini.
void myKeyboard(unsigned char key, int x, int y){
if(key == 'a') glTranslatef(4,0,0); //seleksi tombol yang ditekan
}
void mySpecialKeyboard(int key, int x, int y){ switch(key){
case GLUT_KEY_??? : …; break;
}
}
Agar fungsi keyboard ini dapat dideteksi terus maka fungsi untuk animasi (update) harus telah disertakan.
Untuk fungsi callback yang memanggil tombol keyboard normal/biasa adalah
glutKeyboardFunc(myKeyboard); //hanya memanggil fungsi myKeyboard
sedangkan untuk mendeteksi tombol-tombol keyboard yang bersifat spesial seperti tombol F1, arah panah, Home, Enter, dsb dapat menggunakan callback function
glutSpecialFunc(mySpecialKeyboard); //hanya memanggil fungsi mySpecialKeyboard untuk tombol - tombol spesialnya adalah sebagai berikut :
INTERAKSI MOUSE
1. Fungsi dasar pembuatan interaksi dengan menggunakan MouseFunction
GLUTAPI void APIENTRY glutMouseFunc(void (GLUTCALLBACK *func)(int button, int state, int x, int y));
Paramater func adalah fungsi yang akan ditangani dengan event klik mouse.
GLUTAPI void APIENTRY glutMotionFunc(void *func(int x, int y));
Fungsi di atas adalah fungsi pelengkap dari fungsi interaksi mouse untuk mendeteksi gerakan mouse.
2. Inisialisasi dalam penggunaan MouseFunction
void mouse(int button, int state, int x,int y){
if(button==GLUT_LEFT_BUTTON && state==GLUT_DOWN) drawDot(x,480-y);
if(button==GLUT_RIGHT_BUTTON && state==GLUT_DOWN) drawDot2(x,480-y);
if(button==GLUT_MIDDLE_BUTTON && state==GLUT_DOWN) drawDot3(x,480-y);
}
void motion(int x,int y){
}
GLUT_LEFT_BUTTON untuk inisialisasi button mouse kiri.
GLUT_RIGHT_BUTTON untuk inisialisasi button mouse kanan.
GLUT_MIDDLE_BUTTON untuk inisialisasi button mouse tengah.
Fungsi dari GLUT_DOWN adalah untuk inisialisasi ketika tombol mouse ditekan. Fungsi dari GLUT_UP adalah untuk inisialisasi ketika tombol mouse dilepaskan.
Kemudian pada main program perlu menambahkan fungsi untuk callback fungsi MouseFunction.
glutMouseFunc(mouse);
glutMotionFunc(motion);
JOBSHEET PRAKTIKUM
(INTERAKSI KEYBOARD)
LATIHAN 1
Syntax Program
#include
#include
void Persegi() {
glBegin(GL_QUADS);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glColor3f(0,0,1);
Persegi();
glFlush();
}
void myKeyboard(unsigned char key, int x, int y)
{
if (key == 'a')
glTranslatef (-4, 0, 0);
else if (key == 'd')
glTranslatef (4, 0, 0);
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void update (int value)
{
glutPostRedisplay();
glutTimerFunc(50, update,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (640,480);
glutCreateWindow ("LATIHAN INTERAKSI KEYBOARD");
gluOrtho2D(-250., 250., -250., 250.);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutKeyboardFunc(myKeyboard);
//glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
tekan keyboard a
tekan keyboard d
Penjelasan
Program diatas merupakan program interaksi keyboard yang diterapkan dalam objek persegi, dengan alur kerjanya , jika menekan keyboard a maka objek akan bergeser kearah kiri, dan jika menekan keyboard d maka objek akan bergeser kea rah kanan. Menggunakan fungsi display untuk menampilkan objek dengan warna biru ( kode 001). Kemudian menggunakan fungsi myKeyboard yang digunakan untuk penedeklarasian fungsi keyboard a dan d , dengan perkondisian if. Jika key == a maka menggunakan fungsi translate dengan parameter -4,0,0 yang artinya bergerak ke arah x= -4 , y=0 dan z=0. Jika key ==d maka di translate dengan parameter 4,0,0 yang artinya bergerak kea rah x=4, y=0, dan z=0. Untuk memanggil fungsi keybard menggunakan "glutKeyboardFunc(myKeyboard)".
LATIHAN 2
Syntax Program
#include
#include
void Persegi() {
glBegin(GL_QUADS);
glVertex2d(0,0);
glVertex2d(0,30);
glVertex2d(80,30);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glColor3f(0,0,1);
Persegi();
glFlush();
}
void myKeyboard(unsigned char key, int x, int y)
{
if (key == 'a')
glTranslatef (-4, 0, 0);
else if (key == 'd')
glTranslatef (4, 0, 0);
else if (key == 's')
glTranslatef (0,-4,0);
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void update (int value)
{
glutPostRedisplay();
glutTimerFunc(50, update,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (640,480);
glutCreateWindow ("LATIHAN INTERAKSI KEYBOARD");
gluOrtho2D(-250., 250., -250., 250.);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutKeyboardFunc(myKeyboard);
//glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
tekan keyboard s
Penjelasan
Program diatas sama seperti program sebelumnya, hanya saja ada tambahan fungsi jika menekan keyboard s, maka objek akan bergeser kearah bawah ( dengan parameter 0, -4, 0 yang artinya bergerak kea rah x=0 , y=-4, z=0). Sama seperti program latiahan 1 menggunakan keyboard a dan d , jika menekan keyboard a maka objek akan bergeser kearah kiri, dan jika menekan keyboard d maka objek akan bergeser kea rah kanan. Menggunakan fungsi display untuk menampilkan objek dengan warna biru ( kode 001). Kemudian menggunakan fungsi myKeyboard yang digunakan untuk penedeklarasian fungsi keyboard a dan d , dengan perkondisian if. Jika key == a maka menggunakan fungsi translate dengan parameter -4,0,0 yang artinya bergerak ke arah x= -4 , y=0 dan z=0. Jika key ==d maka di translate dengan parameter 4,0,0 yang artinya bergerak kea rah x=4, y=0, dan z=0. Untuk memanggil fungsi keybard menggunakan "glutKeyboardFunc(myKeyboard)".
LATIHAN 3
Syntax Program
#include
#include
void Persegi() {
glBegin(GL_QUADS);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glColor3f(0,0,1);
Persegi();
glFlush();
}
void myKeyboard(unsigned char key, int x, int y)
{
if (key == 'a')
glTranslatef (-4, 0, 0);
else if (key == 'd')
glTranslatef (4, 0, 0);
}
void mySpecialKeyboard (int key, int x, int y)
{
switch(key)
{
case GLUT_KEY_LEFT :
glRotatef(4,0,0,1);
break;
}
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void update (int value)
{
glutPostRedisplay();
glutTimerFunc(50, update,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (640,480);
glutCreateWindow ("LATIHAN INTERAKSI KEYBOARD");
gluOrtho2D(-250., 250., -250., 250.);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutKeyboardFunc(myKeyboard);
glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
tekan keyboar navigasi kiri.
Penjelasan
Program diatas sama dengan latihan 1, hanya menambahkan fungsi specialKeyboard menggunakan keyboard navigasi kiri untuk memutar objek kearah kiri dengan menggunakan fungsi rotate berparameter (4,0,01) dan jika menekan keyboard a maka objek akan bergeser kearah kiri, dan jika menekan keyboard d maka objek akan bergeser kea rah kanan. Menggunakan fungsi display untuk menampilkan objek dengan warna biru ( kode 001). Kemudian menggunakan fungsi myKeyboard yang digunakan untuk pendeklarasian fungsi keyboard a dan d , dengan perkondisian if. Jika key == a maka menggunakan fungsi translate dengan parameter -4,0,0 yang artinya bergerak ke arah x= -4 , y=0 dan z=0. Jika key ==d maka di translate dengan parameter 4,0,0 yang artinya bergerak kea rah x=4, y=0, dan z=0. Untuk memanggil fungsi keybard menggunakan "glutKeyboardFunc(myKeyboard);". Untuk memanggil fungsi special Keyboard dengan menggunakan "glutSpecialFunc(mySpecialKeyboard)".
LATIHAN 4
Syntax Program
#include
#include
void Persegi() {
glBegin(GL_QUADS);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glColor3f(0,0,1);
Persegi();
glFlush();
}
void myKeyboard(unsigned char key, int x, int y)
{
if (key == 'a')
glTranslatef (-4, 0, 0);
else if (key == 'd')
glTranslatef (4, 0, 0);
}
void mySpecialKeyboard (int key, int x, int y)
{
switch(key)
{
case GLUT_KEY_LEFT :
glRotatef(4,0,0,1);
break;
case GLUT_KEY_RIGHT :
glRotatef(-4,0,1,0);
break;
}
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void update (int value)
{
glutPostRedisplay();
glutTimerFunc(50, update,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (640,480);
glutCreateWindow ("LATIHAN INTERAKSI KEYBOARD");
gluOrtho2D(-250., 250., -250., 250.);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutKeyboardFunc(myKeyboard);
glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
tekan keyboard navigasi kiri
tekan keyboard navigasi kanan
Penjelasan
Program diatas sama seperti program latihan 3 , hanya saja menambahkan fungsi pada keyboard navigasi kanan yang fungsinya mempersempit objek kearah kiri dengan parameter (-4,0,1,0). Fungsi ini ditambahakan pada fungsi specialKeyboard.
LATIHAN 5
Syntax Program
#include
#include
void Persegi() {
glBegin(GL_QUADS);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
Persegi();
glFlush();
}
void myKeyboard(unsigned char key, int x, int y)
{
if (key == 'a')
glTranslatef (-4, 0, 0);
else if (key == 'd')
glTranslatef (4, 0, 0);
else if (key == 'w')
glTranslatef (0,4,0);
else if (key == 's')
glTranslatef (0,-4,0);
else if (key == 'z')
glColor3f (1,0,0);
else if (key == 'x')
glColor3f (0,1,0);
else if (key == 'c')
glColor3f (0,0,1);
else if (key == 'v')
glColor3f (0,1,1);
}
void mySpecialKeyboard (int key, int x, int y)
{
switch(key)
{
case GLUT_KEY_LEFT :
glRotatef(4,0,0,1);
break;
case GLUT_KEY_RIGHT :
glRotatef(-4,0,1,0);
break;
}
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void update (int value)
{
glutPostRedisplay();
glutTimerFunc(50, update,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (640,480);
glutCreateWindow ("LATIHAN INTERAKSI KEYBOARD");
gluOrtho2D(-250., 250., -250., 250.);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutKeyboardFunc(myKeyboard);
glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
tekan keyboard w
tekan keyboard z
tekan keyboard x
tekan keyboard c
tekan keyboard v
Penjelasan
Program diatas sama seperti pada program 1 dan 2 , hanya saja menambahkan fungsi color3f jika menekan keyboard z,x,c,v utnuk merubah warna objek. Jika menekan keyboard z= merah, x=hijau, c=biru, v=cyan. Untuk merubah warna objek dapat ditambahkan fungsi glColor3f pada fungsi myKeyboard. Menggunakan fungsi keyboard a untuk geser kiri, d geser kanan, s geser kebawah dan w geser keatas.
(INTERAKSI MOUSE)
LATIHAN 1
Syntax Program
#include
#include
int w = 480;
int h = 480;
float x = 0;
float y = 0;
float z = 0;
void Persegi() {
glBegin(GL_QUADS);
glColor3f(0,0,1);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glPushMatrix();
glTranslatef(x,y,z);
Persegi();
glPopMatrix();
glFlush();
}
void mouse(int button, int state, int xmouse, int ymouse)
{
if (button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)
{
x = xmouse - (w/2);
y = (h/2) - ymouse;
}
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (w,h);
glutCreateWindow ("LATIHAN INTERAKSI MOUSE");
gluOrtho2D(-w/2, w/2, -h/2, h/2);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutMouseFunc(mouse);
//glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
Memindahkan objek jika mouse klik.
Penjelasan
Program diatas adalah penerapan interaksi pada kouse. Menggunakan fungsi mouse untuk pengaturan interaksi apa yang terjadi jika mengklik atau kursor mouse digunakan. Pada program ini menunjukkan jika mengklik mouse pada posisi sembarang maka objke tersebut akan berpindah sesuai dimana mouse diklik dengan pengaturan x= xmouse-(w/2); y=(h/2)-ymouse; yang artinya jika x berfungsi mengatur posisi sumbu x dari objek ketika mouse di klik dan Y berfungsi mengatur posisi sumbu y dari objek ketika mouse di klik.
LATIHAN 2
Syntax Program
#include
#include
int w = 480;
int h = 480;
float x = 0;
float y = 0;
float z = 0;
void Persegi() {
glBegin(GL_QUADS);
glColor3f(0,0,1);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glPushMatrix();
glTranslatef(x,y,z);
Persegi();
glPopMatrix();
glFlush();
}
void mouse(int button, int state, int xmouse, int ymouse)
{
if (button == GLUT_RIGHT_BUTTON && state == GLUT_DOWN)
{
glScalef(2,2,1);
}
else if (button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)
{
glScalef(0.5,0.5,1);
}
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (w,h);
glutCreateWindow ("LATIHAN INTERAKSI MOUSE");
gluOrtho2D(-w/2, w/2, -h/2, h/2);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutMouseFunc(mouse);
//glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
jika menekan tombol mouse kanan
menekan tombol mouse kiri
Penjelasan
Program diatas berfungsi untuk merubah ukuran objke dengan menggunakan fungsi Scalef dengan parameter, jika ingin merubah objek menjadi semakin besar (2,2,1) jika ingin mengecilkan ukuran objek dengan parameter (0.5,0.5,1).
Fungsi yang digunakan dengan perkondisian if yang nantinya akan merubah objek (x,y) menjadi 2kali lebih besar dari ukuran awal (tomol kanan):
if (button == GLUT_RIGHT_BUTTON && state==GLUT_DOWN){
x= xmouse-(w/2);
y=(h/2)-ymouse;
glScalef(2,2,2);
digunakan untuk mengatur tombol klik kiri maka ukuran x dan y yang ukurannya 2x lebih kecil dari ukuran awal.
else if (button == GLUT_LEFT_BUTTON && state==GLUT_UP){
x= xmouse-(w/2);
y=(h/2)-ymouse;
glScalef(0.5,0.5,1);
LATIHAN 3
Syntax Program
#include
#include
int w = 480;
int h = 480;
float x = 0;
float y = 0;
float z = 0;
void Persegi() {
glBegin(GL_QUADS);
glColor3f(0,0,1);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glPushMatrix();
glTranslatef(x,y,z);
Persegi();
glPopMatrix();
glFlush();
}
void mouse(int button, int state, int xmouse, int ymouse)
{
if (button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)
{
glScalef(2,2,1);
}
else if (button == GLUT_RIGHT_BUTTON && state == GLUT_UP)
{
glScalef(0.5,0.5,1);
}
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (w,h);
glutCreateWindow ("LATIHAN INTERAKSI MOUSE");
gluOrtho2D(-w/2, w/2, -h/2, h/2);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutMouseFunc(mouse);
//glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
jika menekan tombol mouse kiri
menekan tombol mouse kanan
Penjelasan
Program diatas sama seperti program latihan 2 namun kebalikannya. Berfungsi untuk merubah ukuran objek dengan menggunakan fungsi Scalef dengan parameter, jika ingin merubah objek menjadi semakin besar (2,2,1) jika ingin mengecilkan ukuran objek dengan parameter (0.5,0.5,1).
Fungsi yang digunakan dengan perkondisian if yang nantinya akan merubah objek (x,y) menjadi 2kali lebih besar dari ukuran awal (tomol kiri):
if (button == GLUT_LEFT_BUTTON && state==GLUT_DOWN){
x= xmouse-(w/2);
y=(h/2)-ymouse;
glScalef(2,2,2);
digunakan untuk mengatur tombol klik kanan maka ukuran x dan y yang ukurannya 2x lebih kecil dari ukuran awal.
else if (button == GLUT_RIGHT_BUTTON && state==GLUT_UP){
x= xmouse-(w/2);
y=(h/2)-ymouse;
glScalef(0.5,0.5,1);
LATIHAN 4
Syntax Program
# include
#include
float x=0, y=0, z=0;
int w=480;
int h=480;
void drawQuad(void) {
glBegin(GL_QUADS);
glVertex2f(0.,0.);
glVertex2f(0.,100.);
glVertex2f(200.,100.);
glVertex2f(200.,0.);
glEnd();
}
void myDisplay(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glPushMatrix();
glTranslatef(x,y,z);
drawQuad();
glPopMatrix();
glFlush();
}
void mouse(int button, int state, int xmouse, int ymouse)
{
if (button == GLUT_RIGHT_BUTTON && state==GLUT_DOWN){
x= xmouse-(w/2);
y=(h/2)-ymouse;
glScalef(2,2,2);
}
else if (button == GLUT_RIGHT_BUTTON && state==GLUT_UP){
x= xmouse-(w/2);
y=(h/2)-ymouse;
glScalef(0.5,0.5,0.5);
}
}
void update(int value)
{
glutPostRedisplay();
glutTimerFunc(50,update,0);
}
void main(int argc, char **argv)
{
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize(w,h);
glutCreateWindow("Gesta Wahyu sasongko");
gluOrtho2D(-100,100,-100,100);
glutDisplayFunc(myDisplay);
glutTimerFunc(50,update,0);
glutMouseFunc(mouse);
glutMainLoop();}
Screen Shoot Hasil Program
tampilan awal
Jika menekan tombl mouse kiri maka akan merubah objek menjadi kecil, tombol mouse kanan untuk merubah objek menjadi besar, namun perubahan skalanya kearah pointer mouse.
Penjelasan
mouse
OPEN GL
Untuk open GL, objek akan terletak pada koordinat 0,0 terletak (tengah window), sedangkan untuk mouse koordinat 0,0 terletak pada dimana posisi pointer mouse diletakkan, sehingga tidak secara otomatis berada pad tengah window yang digunakan seperti pada open GL.
LATIHAN 5
Syntax Program
#include
#include
int w = 480;
int h = 480;
float x = 0;
float y = 0;
float z = 0;
void Persegi() {
glBegin(GL_QUADS);
glColor3f(0,0,1);
glVertex2d(0,0);
glVertex2d(0,50);
glVertex2d(80,50);
glVertex2d(80,0);
glEnd();
}
void Display()
{
glClear (GL_COLOR_BUFFER_BIT);
glPushMatrix();
glTranslatef(x,y,z);
Persegi();
glPopMatrix();
glFlush();
}
void mouse(int button, int state, int xmouse, int ymouse)
{
if (button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)
{
x = xmouse - (w/2);
y = (h/2) - ymouse;
}
}
void motion (int xmouse, int ymouse)
{
x=xmouse-(w/2);
y=(h/2)-ymouse;
}
void timer (int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void main (int argc, char **argv)
{
glutInit (&argc, argv);
glutInitDisplayMode (GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100,100);
glutInitWindowSize (w,h);
glutCreateWindow ("LATIHAN INTERAKSI MOUSE");
gluOrtho2D(-w/2, w/2, -h/2, h/2);
glutDisplayFunc(Display);
glutTimerFunc(1000,timer,0);
glutMouseFunc(mouse);
//glutSpecialFunc(mySpecialKeyboard);
glutMotionFunc(motion);
glutMainLoop();
}
Screen Shoot Hasil Program
Penjelasan
Program diatas menggunakan fungsi motion yang berfungsi mengatur letak objek berdasarkan posisi mosue diletakkan/diklik. Sama seperti pada latihan 1, bedanya hanya ketika objek diklik dan ditahan maka objek akan ikut berpindah dengan pergerakan pointer mouse.
TUGAS ASISTENSI
TUGAS ASISTENSI 1
Syntax Program
#include
#include
void drawQuad(void){
glClear(GL_COLOR_BUFFER_BIT);
glBegin(GL_TRIANGLES);
glColor3f(1,0,0);
glVertex2f(0.,100.);
glVertex2f(80.,0.);
glVertex2f(-80.,0.);
glColor3f(1,1,1);
glVertex2f(0.,-100.);
glVertex2f(80.,0.);
glVertex2f(-80.,0.);
glEnd();
glFlush();
}
void renderScene(){
glClear(GL_COLOR_BUFFER_BIT);
drawQuad();
glFlush();
}
void myKeyboard(unsigned char key, int x, int y) {
if (key == 'k') glRotatef (4,0,0,1);
else if (key == 'l') glRotatef (-4,0,0,1);
}
void update(int value){
glutPostRedisplay();
glutTimerFunc(60,update,0);
}
void main(int argc, char **argv) {
glutInit (&argc, argv);
glutInitDisplayMode(GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA) ;
glutInitWindowPosition(100,100);
glutInitWindowSize(480,480);
glutCreateWindow("ASISTENSI 1 SYAVIRI");
gluOrtho2D(-320.,320.,-320.,320.0);
glutDisplayFunc(renderScene);
glutKeyboardFunc(myKeyboard);
glutTimerFunc(60, update, 0);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
tekan keyboard k
tekan keyboard l
Penjelasan
Pada program diatas menggunakan fungsi triangle untuk membuat dua buah objek berwarna merah dan putih , yang dideklarasikan pada fungsi drawQuad. Kemudian untuk mengubah posisi objek menggunakan fungsi myKeyboard yang didalamnya dideklarasikan jika menekan tombol k dan l akan dirotatef sesuai dengan parameter masing- masing, untuk tombol k kearah kiri , tombol l kearah kanan.
TUGAS ASISTENSI 2
Syntax Program
#include
#include
int a, p, j, n;
void drawQuad(){
glBegin(GL_QUADS);
glColor3f(0, 0, 1);
glVertex2i(0, 0);
glVertex2i(0, 95);
glVertex2i(-95, 95);
glVertex2i(-95, 0);
glEnd();
}
void myKeyboard(unsigned char key, int x, int y){
if (key == 'A' "" key == 'a') {
a -= 3;
}
else if (key == 'J' "" key == 'j'){
p -= 3;
}
else if (key == 'N' "" key == 'n'){
a += 3;
}
else if (key == 'P' "" key == 'p'){
p += 3;
}
}
void drawSegitiga(){
glBegin(GL_TRIANGLES);
glColor3f(0, 1, 1);
glVertex2f(100.,100.);
glVertex2f(150.,0.);
glVertex2f(50.,0.);
glEnd();
}
void mySpecialKeyboard(int key, int x, int y){
switch (key){
case GLUT_KEY_LEFT:
j -= 3;
break;
case GLUT_KEY_RIGHT:
j += 3;
break;
case GLUT_KEY_UP:
n += 3;
break;
case GLUT_KEY_DOWN:
n -= 3;
break;
}
}
void renderScene(){
glClear(GL_COLOR_BUFFER_BIT);
glPushMatrix();
glTranslatef(a, p, 0);
drawQuad();
glPopMatrix();
glPushMatrix();
glTranslatef(j, n, 0);
drawSegitiga();
glPopMatrix();
glFlush();
}
void update(int value){
glutPostRedisplay();
glutTimerFunc(50, update, 0);
}
void main(int argc, char **argv) {
glutInit(&argc, argv);
glutInitDisplayMode(GLUT_DEPTH " GLUT_SINGLE " GLUT_RGBA);
glutInitWindowPosition(100, 100);
glutInitWindowSize(640, 480);
glutCreateWindow("ASISTENSI 2 SYAVIRI");
gluOrtho2D(-220.0, 220.0, -200.0, 200.0);
glutTimerFunc(50, update, 1);
glutDisplayFunc(renderScene);
glutKeyboardFunc(myKeyboard);
glutSpecialFunc(mySpecialKeyboard);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
posisi kedua objek setelah menekan keyboard a/p/j/n dan navigasi kiri-kanan-atas-bawah
Penjelasan
Program diatas merupakan penerapan dari kombinasi tombol keyboard biasa dan tombol special keyboard. Untuk mengatur penggunaan tombol keyboard biasa , menggunakan tombol a,p,j,n dideklarasikan pada fungsi myKeyboard. Sedangkan untuk tombol navigasi keyboard, menggunakan fungsi mySpecialKeyboard untuk pendeklarasian fungsi-fungsinya. Menggunakan dua bua objek sebagai contoh pembuktian hasil program , persegi dan segitiga dengan pendeklarasian warna dan system koordinat yang digunakan pada fungsi drawQuad untuk persegi dan drawSegitiga untuk segitiga. Menggunakan fungsi translate untuk perpindahan objek, kemudian menggunakan fungsi popMatrix dan pushMatrix untuk menambah modifikasi program diatas.
TUGAS ASISTENSI 3
Syntax Program
#include
#include
#include
int w = 480;
int h = 480;
float a=1;
float b=1;
int c=0;
int d=0;
void draw()
{
glBegin(GL_QUADS);
glVertex2i(0,0);
glVertex2i(0,100);
glVertex2i(100,100);
glVertex2i(100,0);
glEnd();
}
void render(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glColor3f(1,1,0);
glPushMatrix();
glScalef(a,1,0);
glScalef(1,b,0);
draw();
glPopMatrix();
glFlush();
}
void timer(int value)
{
glutPostRedisplay();
glutTimerFunc(10,timer,0);
}
void motion(int x, int y)
{
c=x-240;
d= -(y-240);
printf("posisi pointer mouse (%d,%d) \n", c, d);
}
void mouse(int button, int state, int xmouse, int ymouse)
{
if (button == GLUT_RIGHT_BUTTON && state == GLUT_UP)
{
a += c/100;
b += d/100;
}
}
void main(int argc, char **argv){
glutInit(&argc, argv);
glutInitWindowSize(w,h);
glutCreateWindow("Gesta Wahyu Sasongko");
gluOrtho2D(-w/2,w/2,-h/2,h/2);
glutDisplayFunc(render);
glutTimerFunc(100,timer,0);
glutMouseFunc(mouse);
glutMotionFunc(motion);
glutMainLoop();
}
Screen Shoot Hasil Program
Penjelasan
Program diatas menampilkan posisi mouse pada window yang menampilkan objek. Ketika pada window objek , mouse diklik, maka pada window lainnya yang kosong akan muncul informasi mengenai posisi pointer mouse saat mouse diklik. Posisi mouse akan terbaca jika mouse digerakkan dan di klik. Untuk mendeteksi pergerakan pointer mouse menggunakan fungsi motion.
TUGAS ASISTENSI 4
Syntax Program
#include "stdlib.h"
#include "stdio.h"
#include
#include "glut.h"
float x=1,y=1,z=0;
int w=480, h=480, flag=0,flg;
void drawQuad() {
glBegin(GL_POLYGON);
glColor3f(0,0,1);
glVertex2f(-40.,-40.);
glVertex2f(40.,-40.);
glVertex2f(40.,40.);
glVertex2f(-40.,40.);
glEnd();
}
void mouse(int button, int state, int xmouse, int ymouse){
if(flg==0){
if(button==GLUT_LEFT_BUTTON && state==GLUT_DOWN){
flag++;
if(flag==2){
flg=3;
x=3;
y=3;
flag=3;
}
}
}
if (flg==3){
if(button==GLUT_LEFT_BUTTON && state==GLUT_DOWN){
flag--;
if(flag==0){
x=1;
y=1;
flg=0;
}
}
}
}
void renderScene(void){
glClear(GL_COLOR_BUFFER_BIT);
glPushMatrix();
glScalef(x,y,z);
drawQuad();
glPopMatrix();
glFlush();
}
void timer(int value){
glutPostRedisplay();
glutTimerFunc(50,timer,0);
}
void main (int argc, char **argv){
glutInit(&argc, argv);
glutInitWindowPosition(100,100);
glutInitWindowSize(w,h);
glutCreateWindow("ASISTENSI 4 SYAVIRI");
gluOrtho2D(-w/2,w/2,-h/2,h/2);
glutDisplayFunc(renderScene);
glutMouseFunc(mouse);
glutTimerFunc(1,timer,0);
glutMainLoop();
}
Screen Shoot Hasil Program
tampilan awal
double klik pertama
double klik kedua
Penjelasan
Program diatas menggunakan perkondisian if untuk mendeteksi event double klik. Dideklarasikan dalam fungsi mouse untuk merubah ukuran objek, untuk double klik pertama merubah ukuran objek menjadi lebih besar, kemudian untuk double klik kedua merubah ukuran objke menjadi seperti semula. Jika flag ==0 , maka x dan y ditamabh 3, jika flag==3 maka x dan y=1 yang artinya kembali pada bentuk awal.
KESIMPULAN
Untuk mendeklarasikan penggunaan tombol keyboard alphabet maka menggunakan fungsi myKeyboard, karena tombol alphabet merupakan tombol biasa.
Untuk mendeklarasikan penggunaan tombol navigasi keyboard, menggunakan fungsi mySpecialKeyboard , karena tombol navigasi merupakan tombol special.
Untuk penggunaan system koordinat openGL , maka posisi objek akan berada pada dimana pointer mouse tersebut diletakkan.
Sedangkan untuk penggunaan system koorsinat menggunakan fungsi mouse, maka posisi objek akan berada pada posisi tengah window yang digunakan.
Penggunaan fungsi motion berfungsi untuk menggerakkan objek ketika mengklik dan menahan , sehingga hasilnya objek tersebut akan ikut bergerak mengikuti arah pointer mouse.
Untuk merubah posisi objek dapat menggunakan fungsi translatef da rotatef(memutar), sedangkan untuk mengubah ukuran objek dapat menggunaka fungsi scalef.
DAFTAR PUSTAKA
Modul 4 Praktikum Grafika Komputer 2015. Interaksi dengan Keyboard dan Mouse.. Universitas Negeri Malang. Fakultas Teknik. Jurusan Teknik Elektro