rss_feed

GTK-3 OpenGL inside a drawing area

homeHome
pagesGTK-3
pagespython
pageswidgets
pagesopengl

Textview widget

Example of rendering opengl inside a gtk drawing area. I have seperated out the opengl code from the main gtk widget this makes it simpler to use in your own applications.

The example below will draw a basic opengl triangle so you know everything is setup and working, it also attaches to the drawing area resize events so you can resize the window.

  1
  2
  3
  4
  5
  6
  7
  8
  9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
#!/usr/bin/env python
import sys
from OpenGL.GL import *
from OpenGL.GLU import *
from OpenGL import GLX
from OpenGL.raw._GLX import struct__XDisplay
from OpenGL import GL
from ctypes import *

import Xlib
from Xlib.display import Display
from gi.repository import Gtk, GdkX11, Gdk


class gtkgl:
    """ these method do not seem to exist in python x11 library lets exploit the c methods """
    xlib = cdll.LoadLibrary('libX11.so')
    xlib.XOpenDisplay.argtypes = [c_char_p]
    xlib.XOpenDisplay.restype = POINTER(struct__XDisplay)
    xdisplay = xlib.XOpenDisplay(None)
    display = Xlib.display.Display()
    attrs = []

    xwindow_id = None
    width = height = 200

    def __init__(self):
        """ lets setup are opengl settings and create the context for our window """
        self.add_attribute(GLX.GLX_RGBA, True)
        self.add_attribute(GLX.GLX_RED_SIZE, 1)
        self.add_attribute(GLX.GLX_GREEN_SIZE, 1)
        self.add_attribute(GLX.GLX_BLUE_SIZE, 1)
        self.add_attribute(GLX.GLX_DOUBLEBUFFER, 0)

        xvinfo = GLX.glXChooseVisual(self.xdisplay, self.display.get_default_screen(), self.get_attributes())
        configs = GLX.glXChooseFBConfig(self.xdisplay, 0, None, byref(c_int()))
        self.context = GLX.glXCreateContext(self.xdisplay, xvinfo, None, True)

    def add_attribute(self, setting, value):
        """just to nicely add opengl parameters"""
        self.attrs.append(setting)
        self.attrs.append(value)

    def get_attributes(self):
        """ return our parameters in the expected structure"""
        attrs = self.attrs + [0, 0]
        return (c_int * len(attrs))(*attrs)

    def configure(self, wid):
        """  """
        self.xwindow_id = GdkX11.X11Window.get_xid(wid)
        if(not GLX.glXMakeCurrent(self.xdisplay, self.xwindow_id, self.context)):
            print ('failed configuring context')
        glViewport(0, 0, self.width, self.height)

    def draw_start(self):
        """make cairo context current for drawing"""
        if(not GLX.glXMakeCurrent(self.xdisplay, self.xwindow_id, self.context)):
            print ("failed to get the context for drawing")

    def draw_finish(self):
        """swap buffer when we have finished drawing"""
        GLX.glXSwapBuffers(self.xdisplay, self.xwindow_id)

    def test(self):
        """Test method to draw something so we can make sure opengl is working and we can see something"""
        self.draw_start()

        glClearColor(0.0, 0.0, 0.0, 0.0)
        glClear(GL_COLOR_BUFFER_BIT)
        glBegin(GL_TRIANGLES)
        glIndexi(0)
        glColor3f(1.0, 0.0, 0.0)
        glVertex2i(0, 1)
        glIndexi(0)
        glColor3f(0.0, 1.0, 0.0)
        glVertex2i(-1, -1)
        glIndexi(0)
        glColor3f(0.0, 0.0, 1.0)
        glVertex2i(1, -1)
        glEnd()

        self.draw_finish()


class gui():
    glwrap = gtkgl()

    def __init__(self):
        """ create a gtk window, attach a drawing area and connect the relevant events"""

        self.window = Gtk.Window()
        self.window.realize()
        self.window.resize(self.glwrap.width, self.glwrap.height)
        self.window.set_resizable(True)
        self.window.set_reallocate_redraws(True)
        self.window.set_title("GTK3 with opengl")
        self.window.connect('delete_event', Gtk.main_quit)
        self.window.connect('destroy', lambda quit: Gtk.main_quit())

        self.drawing_area = Gtk.DrawingArea()
        self.drawing_area.connect('configure_event', self.on_configure_event)
        self.drawing_area.connect('draw', self.on_draw)
        self.drawing_area.set_double_buffered(False)
        self.drawing_area.set_size_request(self.glwrap.width, self.glwrap.height)

        self.window.add(self.drawing_area)
        self.window.show_all()

    def on_configure_event(self, widget, event):
        """if we recieve a configure event for example a resize, then grab the context settings and resize our scene """
        self.glwrap.configure(widget.get_window())
        self.glwrap.test()
        return True

    def on_draw(self, widget, context):
        """if we recieve a draw event redraw our test triangle"""
        self.glwrap.test()


def main():
    g = gui()
    Gtk.main()

if __name__ == '__main__':
    main()