GUI Toolkit in OpenGL

Question

I'd like to develop an application (in C++) similar to Pure Data, but with a cool GUI and a better documentation... Yes, something like Max/MSP or Reaktor, but free and open!

In order to create an appealing, reactive and portable interface I was thinking of using OpenGL. In my mind there is something like Blender GUI.

Before starting to develop my custom GUI toolkit I googled around in order to understand if there exist something that I could use, and I found:

• Juce: it seems quite supported, but I didn't understand if you can only embed OpenGL canvas in your interface or it is possible to render all the widgets using OpenGL.
• nUI: it seems really cool and portable, but... Its forum is a desert, and it's really hard to find a tutorial!
• ceGUI, FLTK, GLUI: so flat and gray ;-) and any aren't still maintained.

Do you know other toolkit? As you understand I'm looking for a portable library (in C++), fast and supported.

The other possibility is developing from scratch my custom toolkit using SDL or Freeglut, in this case which could be the best solution?

P.S.: Reading other threads about this topic I noticed that many devs suggest using Qt... Could Qt relies on OpenGL for rendering? Or it could only host OpenGL canvas? Anyway do you think is possible (with good performance) creating something like this in Qt:

• Reaktor GUI example 1
• Reaktor GUI example 2
• Blender Compositing example

Huskamp

nUI does have some tutorials in its github repository (see Wiki tab). – Archiepiscopal

@Archiepiscopal You're right, but as you can read here nUI Wiki: <<This wiki is currently being salvaged from a backup of the original website so it is incomplete and many features are broken (no images, missing links, etc.). Please bear with us as we fix the problems...>>. Anyway thanks... I think I'll give it a try! – Huskamp

Ross Bencina's Audiomulch program fulfills some of the things you're describing interface-wise (although as a music/audio environment it's higher level than what you're proposing) and it uses Qt. You may want to get in touch with him. – Militarist

Answer 1

There isn't really a good openGL toolkit, they tend to get invented for a particular app and then sort of abandoned.

Yes Qt works very well with openGL, there is an openGL QGlWidget with full hardware acceleration (and optional links to openCL). You can have as many QGLwidgets as you like in a Qt app - each with their own openGL commands inside them.

You can also mix Qt and openGL in the same QGlWidget (http://doc.qt.nokia.com/qq/qq26-openglcanvas.html)

Slightly off topic: You can also select Qt to use openGL for all it's rendering - this is still a bit experimental but means that 2d Qt can be much faster on some embedded platforms like phones.
edit: To clarify -the entire app are still normal Qt but drawn with openGL commands 'under the hood'

Rejection

Thanks Martin for your answer... So if I understand correct, with Qt is possible (as experimental way) using OpenGL to render the widget graphics. This is could be nice... Or anyway there is the possibility to embedded many OpenGL widgets with custom and accelerated drawing logic inside. – Huskamp

Answer 2

I like Clutter and MX.

See http://www.clutter-project.org/ and https://github.com/clutter-project/mx

Philae

I wrote Toonloop, a "live" stop motion editor, in Clutter. My main concern with Clutter is that they tend to deprecate their API, or at least they did it a lot in the past. I will move forward to Qt5 with QML and QtQuick if I write a new version of Toonloop in the future, I think. – Philae

Answer 3

Qt 5.7 and up offers QtQuick Controls 2.0 in QML, which are implemented in OpenGL.

http://doc.qt.io/qt-5/qtquickcontrols2-index.html

Their API is very stable and works on Android, iOS, macOS, Windows, GNU/Linux, etc.

Here is a small hello world in a great book about QML. https://qmlbook.github.io/en/ch02/index.html#hello-world

You write JavaScript in QML and the QMake build system turns it into C++ object code.

import QtQuick 2.5

Rectangle {
    width: 360
    height: 360
    Text {
        anchors.centerIn: parent
        text: "Hello World"
    }
    MouseArea {
        anchors.fill: parent
        onClicked: {
            Qt.quit();
        }
    }
}

Philae

Not sure why this is downvoted. Qt Quick 2 might well be one of the best options for this. – Obregon

It's simply because I posted this answer only 23 hours ago. Please vote for it! – Philae