Langsung ke konten utama

Event Handling pada Mouse & Keyboard dengan Font & Text pada PyOpenGL

Hai semua, kembali lagi bersama saya, kali ini saya akan memberikan contoh penerapan Event Handling pada Mouse & Keyboard dengan Font & Text pada PyOpenGL. Untuk menjalankan program font & text, diperlukan Library OpenGLContext, PyVRML97, dan Pillow. Ketiga library ini harus sudah ter-install sebelumnya. Simak penjelasan berikut.

1. Tambahkan library OpenGLContext
from OpenGLContext import testingcontext
from OpenGL.GL import *
from OpenGL.GLU import *
from OpenGL.GLUT import *
2. Buat variable public
# Koordinat x dan y untuk posisi kotak
pos_x = 0
pos_y = 0

# Warna Kotak
merah = 0
hijau = 0
biru = 0

# Teks Warna Objek
warna_objek = "Hitam"

# Teks Warna Background
warna_background = "Hitam"
3. Buat fungsi drawBitmapText(), reshape(), dan drawText untuk memproyeksikan teks pada window
def drawBitmapText(string,x,y,z) :
    glRasterPos3f(x,y,z)
    for c in string :
        glutBitmapCharacter(GLUT_BITMAP_TIMES_ROMAN_24,ord(c))

def reshape(w, h):
    glViewport(0,0,w,h)
    glMatrixMode(GL_PROJECTION)
    glLoadIdentity()
    gluOrtho2D(0,w,h,0)
    glMatrixMode(GL_MODELVIEW)
    glLoadIdentity()

def drawText():
    glColor3f(1.0,1.0,0.0)
    drawBitmapText("Warna",-460,-350,0)
    drawBitmapText("Objek : " + warna_objek,-460,-400,0)
    drawBitmapText("Backgorund : " + warna_background ,-460,-450,0)
4. Pada fungsi display() deklarasikan fungsi drawText() untuk menampilkan teks ke window
def display():
    glClear(GL_COLOR_BUFFER_BIT)
    #Deklarasi fungsi drawText()
    drawText();

    glColor3f(1.0,1.0,1.0) 
    glBegin(GL_LINES)
    glVertex2f(-500.0, 0.0)
    glVertex2f(500.0, 0.0)
    glVertex2f(0.0, 500.0)
    glVertex2f(0.0, -500.0)
    glEnd()

    glPushMatrix()
    kotak()
    glPopMatrix()

    glFlush()
5. Tambahkan variable warna_untuk objek pada fungsi input_mouse() untuk mengubah teks sesuai warna kotak / objek saat mouse klik kanan atau klik kiri.
def input_mouse(button, state, x, y):
    global merah, hijau, biru
    global warna_objek
    
    # Saat klik kanan warna kotak akan berubah menjadi warna hijau dan biru
    if button == GLUT_RIGHT_BUTTON and state == GLUT_DOWN:
        if hijau < 1:
            merah = 0
            hijau = 1
            biru = 0
            warna_objek = "Hijau"
        elif biru < 1:
            merah = 0
            hijau = 0
            biru = 1
            warna_objek = "Biru"
        print("Klik Kanan ditekan ", "(", x, ",", y, ")")
     # Saat klik kiri warna kotak akan berubah menjadi warna merah dan hitam
    elif button == GLUT_LEFT_BUTTON and state == GLUT_DOWN:
        if merah < 1:
            merah = 1
            hijau = 0
            biru = 0
            warna_objek = "Merah"
        else:
            merah = 0
            hijau = 0
            biru = 0
            warna_objek = "Hitam"
            
        print("Klik Kiri ditekan ", "(", x, ",", y, ")")
6. Pada fungsi input_keyboard tambahkan variable warna_background untuk mengatur teks sesuai dengan warna background
def input_keyboard(key,x,y):
    global pos_x, pos_y
    global warna_background

    # Untuk mengubah posisi kotak

    if key == GLUT_KEY_UP:
        pos_y += 5
        print("Tombol Atas ditekan ", "x : ", pos_x, " y : ", pos_y)
    elif key == GLUT_KEY_DOWN:
        pos_y -= 5
        print("Tombol Bawah ditekan ", "x : ", pos_x, " y : ", pos_y)
    elif key == GLUT_KEY_RIGHT:
        pos_x += 5
        print("Tombol Kanan ditekan ", "x : ", pos_x, " y : ", pos_y)
    elif key == GLUT_KEY_LEFT:
        pos_x -= 5
        print("Tombol Kiri ditekan ", "x : ", pos_x, " y : ", pos_y)

    # Untuk Mengubah Warna backgorund window
    
    # Background Kiri Atas berubah warna menjadi Merah
    if pos_x < 0 and pos_y > 0:
        glClearColor(1.0, 0.0, 0.0, 1.0)
        warna_background = "Merah"

    # Background Kanan Atas berubah warna menjadi Hijau
    if pos_x > 0 and pos_y > 0:
        glClearColor(0.0, 1.0, 0.0, 1.0)
        warna_background = "Hijau"

    # Background Kanan Bawah berubah warna menjadi Biru
    if pos_x > 0 and pos_y < 0:
        glClearColor(0.0,0.0,1.0,1.0)
        warna_background = "Biru"

    # Background Kiri Bawah berubah warna menjadi Hitam
    if pos_x < 0 and pos_y < 0:
        glClearColor(0.0,0.0,0.0,1.0)
        warna_background = "Hitam"

Source Code lengkapnya seperti dibawah ini : 
from OpenGLContext import testingcontext
from OpenGL.GL import *
from OpenGL.GLU import *
from OpenGL.GLUT import *

# Koordinat x dan y untuk posisi kotak
pos_x = 0
pos_y = 0

# Warna Kotak
merah = 0
hijau = 0
biru = 0

# Teks Warna Objek
warna_objek = "Hitam"

# Teks Warna Background
warna_background = "Hitam"

def init():
    glClearColor(0.0, 0.0, 0.0, 1.0)
    gluOrtho2D(-500.0, 500.0, -500.0, 500.0)

def drawBitmapText(string,x,y,z) :
    glRasterPos3f(x,y,z)
    for c in string :
        glutBitmapCharacter(GLUT_BITMAP_TIMES_ROMAN_24,ord(c))

def reshape(w, h):
    glViewport(0,0,w,h)
    glMatrixMode(GL_PROJECTION)
    glLoadIdentity()
    gluOrtho2D(0,w,h,0)
    glMatrixMode(GL_MODELVIEW)
    glLoadIdentity()

def drawText():
    glColor3f(1.0,1.0,0.0)
    drawBitmapText("Warna",-460,-350,0)
    drawBitmapText("Objek : " + warna_objek,-460,-400,0)
    drawBitmapText("Backgorund : " + warna_background ,-460,-450,0) 
    
# Membuat bentuk kotak
def kotak():
    global pos_x, pos_y
    glColor3f(merah,hijau,biru)
    
    glBegin(GL_POLYGON)
    # Kiri Atas
    glVertex2f(-50 + pos_x,-50 + pos_y)
    # Kanan Atas
    glVertex2f(50 + pos_x,-50 + pos_y)
    # Kanan Bawah
    glVertex2f(50 + pos_x,50 + pos_y)
    # Kiri Bawah
    glVertex2f(-50 + pos_x,50 + pos_y)
    glEnd()


def display():
    glClear(GL_COLOR_BUFFER_BIT)

    drawText();

    glColor3f(1.0,1.0,1.0) 
    glBegin(GL_LINES)
    glVertex2f(-500.0, 0.0)
    glVertex2f(500.0, 0.0)
    glVertex2f(0.0, 500.0)
    glVertex2f(0.0, -500.0)
    glEnd()
    
    glPushMatrix()
    kotak()
    glPopMatrix()

    glFlush()

def input_mouse(button, state, x, y):
    global merah, hijau, biru
    global warna_objek
    
    # Saat klik kanan warna kotak akan berubah menjadi warna hijau dan biru
    if button == GLUT_RIGHT_BUTTON and state == GLUT_DOWN:
        if hijau < 1:
            merah = 0
            hijau = 1
            biru = 0
            warna_objek = "Hijau"
        elif biru < 1:
            merah = 0
            hijau = 0
            biru = 1
            warna_objek = "Biru"
        print("Klik Kanan ditekan ", "(", x, ",", y, ")")
     # Saat klik kiri warna kotak akan berubah menjadi warna merah dan hitam
    elif button == GLUT_LEFT_BUTTON and state == GLUT_DOWN:
        if merah < 1:
            merah = 1
            hijau = 0
            biru = 0
            warna_objek = "Merah"
        else:
            merah = 0
            hijau = 0
            biru = 0
            warna_objek = "Hitam"
            
        print("Klik Kiri ditekan ", "(", x, ",", y, ")")

def input_keyboard(key,x,y):
    global pos_x, pos_y
    global warna_background

    # Untuk mengubah posisi kotak

    if key == GLUT_KEY_UP:
        pos_y += 5
        print("Tombol Atas ditekan ", "x : ", pos_x, " y : ", pos_y)
    elif key == GLUT_KEY_DOWN:
        pos_y -= 5
        print("Tombol Bawah ditekan ", "x : ", pos_x, " y : ", pos_y)
    elif key == GLUT_KEY_RIGHT:
        pos_x += 5
        print("Tombol Kanan ditekan ", "x : ", pos_x, " y : ", pos_y)
    elif key == GLUT_KEY_LEFT:
        pos_x -= 5
        print("Tombol Kiri ditekan ", "x : ", pos_x, " y : ", pos_y)

    # Untuk Mengubah Warna backgorund window
    
    # Background Kiri Atas berubah warna menjadi Merah
    if pos_x < 0 and pos_y > 0:
        glClearColor(1.0, 0.0, 0.0, 1.0)
        warna_background = "Merah"

    # Background Kanan Atas berubah warna menjadi Hijau
    if pos_x > 0 and pos_y > 0:
        glClearColor(0.0, 1.0, 0.0, 1.0)
        warna_background = "Hijau"

    # Background Kanan Bawah berubah warna menjadi Biru
    if pos_x > 0 and pos_y < 0:
        glClearColor(0.0,0.0,1.0,1.0)
        warna_background = "Biru"

    # Background Kiri Bawah berubah warna menjadi Hitam
    if pos_x < 0 and pos_y < 0:
        glClearColor(0.0,0.0,0.0,1.0)
        warna_background = "Hitam"        

def update(value):
    glutPostRedisplay()
    glutTimerFunc(10,update,0)

def main():
    glutInit(sys.argv)
    glutInitDisplayMode(GLUT_SINGLE|GLUT_RGB)
    glutInitWindowSize(500,500)
    glutInitWindowPosition(100,100)
    glutCreateWindow("Event handling Mouse & Keyboard - Font & Text")

    glutDisplayFunc(display)

    glutSpecialFunc(input_keyboard)
    glutMouseFunc(input_mouse)

    glutTimerFunc(50, update, 0)

    init()
    glutMainLoop()
    
main()
Output :





Selamat Mencoba.

Komentar

Postingan populer dari blog ini

Membuat Piramida 3D Menggunakan PyOpenGL

Bagaimana sih cara membuat piramida 3 dimensi? Langsung saja ya kita bahas. Sebuah piramida terdiri dari :  1 alas,  4 sisi, dan  5 sudut. Berikut langkah-langkahnya : 1. B uat fungsi rgb() untuk memudahkan konversi format dari warna rgb ke format warna PyOpenGL . # Fungsi konversi rgb def rgb(n): return n / 255.0 2.  Buat fungsi pivot() untuk tampilan garis pivot x,y,z untuk mempermudah dalam membuat bentuk 3D. # Fungsi Pivot def pivot(): glBegin(GL_LINES) glColor3f(1,0,0) #merah x glVertex3f(10,0,0) glVertex3f(-10,0,0) glColor3f(0,1,0) #hijau y glVertex3f(0,10,0) glVertex3f(0,-10,0) glColor3f(0,0,1) #biru x glVertex3f(0,0,10) glVertex3f(0,-0,-10) glEnd() 3. B uat fungsi piramida() untuk membuat bentuk piramida 3D. # Bentuk Piramida 3D def piramida(): # Depan glBegin(GL_LINE_STRIP) glColor3f(rgb(231),rgb(1),rgb(10)) glVertex3f(-1.0, -1.0, 1.0) glVertex3f(1.0, -1.0, 1.0) glV...

Event Handling Mouse dan Keyboard pada PyOpenGL

Hai teman-teman, kali ini saya akan memberi contoh penerapan Event Handling pada Mouse dan Keyboard. Langsung simak saja ya. OpenGL menyediakan fungsi yang didefinisikan oleh user dan dipanggil pada saat ada event yang bersesuaian. OpenGL memonitor peralatan input, ketika ada sesuatu yang terjadi,misalkan saat mouse down , key press , dan lain-lain. Pada OpenGL terdapat fungsi Callback GLUT, yaitu fungsi yang berjalan saat ada kejadian (event-driven). Program-program yang menggunakan window untuk input/output,menunggu sampai ada kejadian dan kemudian mengeksekusi beberapa fungsi yang didefinisikan sebelumnya berdasarkan input dari user. Kejadian yang dimaksud : key press, mouse button press dan release, window resize , dan lain-lain. Program OpenGL yang dibuat akan berjalan tak terbatas ( infinite loop ). EVENT KEYBOARD glutKeyboardFunc(nama_fungsi) def nama_fungsi(key, x, y) Fungsi ini mencatat apa yang terjadi ketika sebuah tombol keyboard di tekan. Parameter key me...

Membuat Gambar Objek Berbentuk Hati Menggunakan PyOpenGL

Halo semua, balik lagi nih dengan saya. Kali ini saya akan memberikan contoh source code untuk pembuatan gambar objek berbentuk hati, yaitu sebagai berikut : Source Code : from OpenGL.GL import * from OpenGL.GLU import * from OpenGL.GLUT import * import numpy as np def init(): glClearColor(0.0, 0.0, 0.0, 0.0) gluOrtho2D(-2.0, 2.0, -2.0, 2.0) def plotpoints(): glClear(GL_COLOR_BUFFER_BIT) glColor3f(0.0, 1.0, 0.0) glPointSize(13) glBegin(GL_LINES) glVertex2f(-500, 0) glVertex2f(500, 0) #glColor3f digunakan sebagai warna garis horizontal dan vertical yang tertera pada screen capture glVertex2f(0, -500) glVertex2f(0, 500) glEnd() heart_shape() glFlush() def heart_shape(): glBegin(GL_LINE_STRIP) glColor3f(0.0, 1.0, 0.0) x = -1.139 #digunakan untuk fill gambar, disini saya memakai warna hijau while(x <= 1.139): delta = np.cbrt(x*x) * np.sqrt(x*x) - 4*x*x + 4 y1 = (np.cbrt(x*x) + np.sqrt(delta...