ESP32 Gets Advance Windowed Apps Using This VGA GUI Library

We featured [Fabrizio Di Vittorio]’s FabGL library for the ESP32 back in April of this year. This library allows VGA output using a simple resistor based DAC (3 resistors for 8 colors; 6 resistors for 64 colors), and includes functions for PS/2 mouse and keyboard input, a graphics library, and many of the miscellaneous functions you might need to develop games on the ESP32. Now, a GUI interface library has been added to ease application development.

The GUI, of course, runs on the VGA output. The library includes what you’d expect from a minimal windowing GUI, like keyboard and mouse support, windows with the usual minimize/maximize/close controls, and modal and message dialog boxes. For input controls, there are labels, text boxes, buttons, radio buttons, checkboxes, normal and editable combo boxes, and listboxes — you know, pretty much everything you need to develop a modern GUI application. All the code is open-source (GPL 3.0) and in the GitHub repo.

While the original FabGL had a game-development orientation, the addition of this new GUI functionality opens up a new range of applications. If you want to find out more about using the FabGL library, you can check out our previous coverage of the mostly game-oriented functions.

You can get a look at the new GUI functions in action in the video, after the break.

36 thoughts on “ESP32 Gets Advance Windowed Apps Using This VGA GUI Library

  1. It’d be interesting to see a vnc port to that vga hardware. I used to have one for the old-school black and white Palm PDAs, but it was useless because I only had the docking station and not a modem or other way to remotely connect.

    1. Do you mean porting the graphics library to export its display via VNC instead of VGA? I don’t imagine it would be TOO difficult, the only question would be implementing the compression algorithms in the resources available.

      I have previously implemented the Keyboard/Mouse part of a VNC server in a couple hundred lines of code. It would be interesting to see if this would be feasible.

      However, I suspect that using HTTP rather than VNC would be a better fit for any remote interfaces, since it offloads the UI processing to a more capable device, with minimal load on the resource-constrained microprocessor.

      1. I was thinking the other direction actually.
        Although while searching around I found something I forgotten about, someone did write a micro-vnc server for 8-bit microcontrollers. Apparently they even had a C64 that people could vnc into at one time. http://dunkels.com/adam/uvnc/
        So that direction is certainly possible.

        I was thinking it would be interesting if you could have a vnc client on the ttgo esp32 vga board and use it to vnc into another computer. IIRC, you can set options in vnc to limit the number of colors that it transfers, so the 64 colors shouldn’t be a huge problem. I’m not sure if there’s enough ram for it though.

  2. It would be helpful if you could explain what things mean.

    Example: “a simple D-based, A-doing, C-thing (DAC)”

    Sadly it appears that the Hackady Stylebook doesn’t allow for that. :(

    1. DAC = Digital to analog converter. Opposite of an ADC.

      We _do_ try to spell things out when we think it would be helpful. Unfortunately, we can’t get it right all the time, or for everyone. Sometimes a common acronym will slip under the RADAR.

      It’s also context dependent. This is, after all, an article about an ESP32 VGA SDL GUI!

    2. Probably it won’t matter much as people that don’t know DAC likely won’t know what is Digital to Analog Converter either. Google will give you much more.

      More importantly is to spell out units like megabits vs megabytes as the difference is a factor of 8 and people have a really bad habit of not following proper cases – some capatialize first letter cap = English naming convention, some lower case everything and some uppercase everything. Do it right the first time and save lots of confusion and correcting afterwards. This is something that google won’t help.

  3. While this is really neat, the ESP32 being a dual core MMU-less microcontroller with limited RAM and no GPU is not the ideal platform for GUIs in my mind. I’d very much prefer to use a Raspberry Pi Zero / 3 / 4 with a library like Qt / GTL or even Nuklear.

    1. A pi zero W has a lot of advantages over this guy, but this is at least cool. Beyond that, there could be very specific applications that could benefit from a simple gui. Maybe you have a vga kvm switch in a server room and you need a specific appliance for monitoring things or resetting rogue machines? It would have to be pretty specific to warrant this over a pi. Maybe some real time constraint that would be hard to accomplish with a pi.

      1. No I didn’t…It is a really neat piece of software. Neat and geeky. Not the most efficient way of doing GUI in 2019, but a real hoot to play around with if you are into that sort of thing.

    2. Well before you were born systems like the Atari ST, Amiga and PC-AT’s running GEOS with 512k RAM were the norm for desktop window machines and we did just fine with them.

      I remember when Windows 3.1 was the norm for 286 and 386 based desktop systems in AF flight test.

      We didnt need some Pi and gigabytes of RAM to write a simple “hello world” program.

      1. Yeah the 80s were great thirty something years ago. I get it. But we Live in 2019. We have the tech and hardware to do GUI better. Also RAM is a heck of a lot cheaper than it was in 1976.

          1. I get it I really do. It’s awesome and a really cool hack. But that doesn’t change the fact that If I was to build a GUI to be used by an average person in 2019, I’d have to use a more modern solution/approach. That’s all I’m saying.

            Also a modern solution would probably be easier to setup and use, but less satisfying than developing an old school GUI library on under-powered hardware and older video output hardware.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.