gui

The gui project is a graphical user interface template project. It has the following features:

• Lightweight: distributable application binaries are as small as 5MB
• C and C++: the application code is C++ with various supporting libraries written in C and C++
• No changes to any system files (all build files and dependencies are contained)
• Cross-platform with support for macOS, windows, ubuntu, raspbery pi, and StratifyOS.
• Permissive licenses for all libraries (MIT, BSD, zlib, apache)

API Features

The gui project contains built-in support for:

• InetAPI: HTTP, HTTPS, TLS based on mbedtls, and BSD sockets
• JsonAPI: based on jansson library
• CryptoAPI: AES, ECDSA, ECDH, and SHA256
• GraphicsAPI: based on lvgl
• WindowAPI: based on libsdl
• Filesystems, Threads, Data Management, Timers, Testing, Printing: Stratify Labs API framework

Prerequisites

To build gui on your computer you need to install:

• git
• cmake: 3.19 or higher
• A compiler (MinGW on Windows, clang on macOS or GCC on Linux)

All other dependencies are automatically cloned and built with your application.

Building

You can build the project with the following commands:

On Windows, you might need to do cmake -DGENERATOR=Ninja -P bootstrap.cmake depending on what the default generator is on your system.

git clone https://github.com/StratifyLabs/gui.git
cd gui
# Choose a stable branch (main might now be stable)
git switch v1.0
cmake -P bootstrap.cmake
cd cmake_link
cmake .. -GNinja
ninja sdl
rm -Rf *
cmake .. -GNinja
ninja

Anatomy of a GUI Application

The gui application executes an lvgl runtime loop in the main thread. All operations in the main thread should return quickly to avoid a sluggish user interface. The View classes create objects on the gui and use the lvgl event handler system to process user input. The View classes are purely static functions. They do not retain any data. They turn the memory management of the GUI over to the lvgl memory system. The LvglAPI allows you to attach user data to a specific object. Data shared among objects can be placed in the Model.

The Model is a C++ singleton class that can be accessed from anywhere in the program. Model access is assumed to be in a multi-threaded environment. The Model::Scope class locks the Model and allows for access to the model within the scope.

int my_function(){
 Model::Scope model_scope;
 model().is_dark_theme = false;
}

If the user input requires processing that cannot be completed quickly, a Worker is used to create a separate thread for processing the request. The Worker code should act as a go-between for the Logic and the Model/View. The Logic can and should be completely decoupled from the graphical portion. The GUI cannot be updated directly from a background thread. The design::Worker class provides a mechanism to push tasks into the lvgl runtime and to maintain thread safety while doing so.