New graphical user interface system

Project Page Next project post Post History

I've been working on The Dark Room's interface GUI system. It's been troubling me that, up until now, I've had to manufacture my own interface system. Quite literally, drawing things pixel by pixel, and sorting out all the mouse interactions like hover, mouse down and clicks etc. This includes keyboard use as well.

Building custom 'widgets' doesn't bother me - I'm happy to make my own gizmos. But most of the time, they're just small things. The trouble with the way I've designed this software, is that the entire viewport is a single display area and I can't just stick native Cinema4D (or other operating system widgets) over it. It just won't let you. So, I have to come up with another solution. Which is why I began making my own.

Instead, I spent some time researching libraries that might help with making a more intiuitive programming system. I came across a popular one called Dear ImGui (link goes to the code on GitHub). This library is what's called an 'Immediate Mode GUI'. In short, the library helps draw interface gizmos into your windowing system, among a few other things.

But it's never that simple, is it. My render window is off-screen, which makes it difficult because the user interaction is actually not done in window that makes the viewport draw. It's posed quite a challenge to solve. For example, mouse interactions do not work 'natively', because they happen in the main Dark Room window. I've had to build my own wrapper to deal with this, which hasn't been straight forward. That said, I don't mind building things like this, if it takes the pressure off drawing things in micro detail myself.

Here's a screen capture of the viewport with the new 'description system':

Example screen capture of The Dark Room's new 'description' user interface system

The looks can be styled (colours, rounded edges, font etc.). I have tried to grab colours from Cinema4D to keep things similar in that respect. A little hard to see in this screen capture, but you may also notice some transparency in the gizmo window backgrounds as well. Neat.

I've still got some work to do on the interactive side of things - like the various input fields etc. But it's a better system moving forward. I don't have to do all the drawing myself. And, the looks can be made to be consistent across plugins as well. The system works by accessing a wrapper that's embedded in the base plugin structure. So all plugins can use the same central system to draw with.

The draw pipeline now consists of 4 stages. Two on the GPU, and two on the CPU. I can still draw using the old methods if I need them as well, because the new system is in addition to what's already available. But mostly, for me, it means that making engines and plugins should become faster, and with less time consuming draw work.