Readit News logoReadit News
chrisdalke · 3 years ago
Related, check out raylib, the rendering/game engine made by the same author!

I’ve used Raylib and raygui on a few RPi based projects and recommend it. It’s a really simple, intuitive way to get an OpenGL-based UI running. Good alternative to web-based UIs because it has similar simplicity but runs on devices with lower specs. I built this pinball machine with raylib: https://youtu.be/iiBn7FVzlcc

wly_cdgr · 3 years ago
Ray is amazing. He's been at it since around 2014. Super friendly, super responsive dude
deckarep · 3 years ago
Brilliant project and execution. I love the idea of bringing the tactile experience together with a digital gaming experience.
matthewfcarlson · 3 years ago
This is fantastic, it’s a shame this doesn’t have more views. If it’s okay, I submitted it to the hackaday.com tip line.
chrisdalke · 3 years ago
Thanks! A little more detail at https://www.chrisdalke.com/projects/mini-pinball-machine/, and the Raylib-based code is on GitHub: https://github.com/chrisdalke/mini-pinball-machine
deaddodo · 3 years ago
Raylib is great and one of my preferred libraries for writing emulators in. But I will say if you’re expecting something like imgui or nuklear with Raygui, it’s not nearly as advanced or usable.
deckarep · 3 years ago
Curious what makes Raylib good for emulators? I’m genuinely interested in this.
akselmo · 3 years ago
Ive been making a simple wolfenstein 3d clone with raylib and C, its so easy to jump into even for a complete newbie in C like me!
noduerme · 3 years ago
That's just super cool. I love what you did with the scoreboard!
a-priori · 3 years ago
Before you start picking up a library like this, keep in mind that no immediate-mode GUI library I'm aware of (including this one from what I can see in the source code) has support for assistive technologies such as screen readers.

To them the whole UI is one big black box, so your program is completely useless to anyone with a wide range of disabilities.

eliasnaur · 3 years ago
The immediate mode Gio (gioui.org) toolkit has support for accessibility (on Android for now), IME and, recently, RTL text layout.

Disclaimer: I'm the author.

mwcampbell · 3 years ago
I can also report some modest progress on my own work on accessibility of immediate-mode GUIs. I have a branch of the Rust egui library [1] that has basic accessibility on Windows using my AccessKit project [2]. I do have a long way to go to make this fully usable and ready to submit upstream, especially when taking non-Windows platforms into account.

[1]: https://github.com/mwcampbell/egui/tree/accesskit

[2]: https://github.com/AccessKit/accesskit

a-priori · 3 years ago
That’s great, thanks for the letting me know!
yashasolutions · 3 years ago
pretty awesome lib!
milansuk · 3 years ago
Do operation systems have APIs, so the program can send them what is on the screen? I mean just description like: There is the button with title "Push me" in the rectangle(50, 50, 100, 70), etc.

Or are there any "screen reader" libraries?

malkia · 3 years ago
Even systems like Qt, where things are drawn using non-native widgets support that (I was long proponent of wxWidgets, because I thought assistive tech is only support only if you use native widgets. The idea of API where you explain what you are showing, and how to interact with it never came to my mind, but with ARIA - like any browser that's the way to go).

Not only that, but I thhink assistive tech should allow you do to easier GUI testing too, but haven't digged into that idea yet (probably folks already are)

jcelerier · 3 years ago
Yes, OSes have APIs. Another commenter talked about the Mac one, Linux has AT-SPI and Windows has MSAA (historic) and UIA. If I'm not mistaken, they generally are about representing the UI as a tree of items as this is what the accessibility hardware expects / works best with.
a-priori · 3 years ago
Yes. I don’t know about Windows but I know that for OSX you need to implement the NSAccessibility protocol in AppKit. This gives you a way to describe the hierarchy of the UI and to notify the system of important changes.
fatih-erikli · 3 years ago
There's a10n standards defined by w3c, https://www.w3.org/TR/using-aria/.
pjmlp · 3 years ago
Yes they do, at least Apple, Google and Microsoft ones.

On GNU/Linux, I think the only thing that exists in the Gtk+ features that were originally sponsored by Sun.

underwater · 3 years ago
Aren't you then trying to bridge an immediate mode API (rendering controls) and a retained mode API (assistive tech).
nikki93 · 3 years ago
I've been using an immediate mode api that generates html elements in web, so that you do get the things that html offers. I basically have a thin wrapper around http://google.github.io/incremental-dom/ (I'm using it from wasm) -- calling it per frame has actually been reasonable perf-wise.
CJefferson · 3 years ago
Thanks for making the post I was coming to make :)

While it's popular to mock electron, it does make it easy to make accessible cross-platform apps, whereas most of the "minimal alternatives" are entirely inaccessible.

schleck8 · 3 years ago
I think egui (Rust) supports screenreaders
grishka · 3 years ago
Seeing that it uses char* for strings, I'd also assume it doesn't support unicode and thus non-Latin scripts.
sunout2 · 3 years ago
Raygui supports unicode for input and output.

https://github.com/raysan5/raygui/issues/99

synergy20 · 3 years ago
I have seen quite often 'immediate mode gui' on HN and elsewhere these days,I rarely do GUI myself, where are these im-gui's use cases? gaming only? or some embedded boards with limited resources can benefit to draw some pixels on a small LCD for a simple GUI(even that people are more likely use some light-weight x11 like libraries instead of im-gui library)?

Other than game-development why is im-gui better than those normal widget kits we are relatively more familiar with: gtk, qt,etc)? or im-gui is specifically for gaming coding?

Adverblessly · 3 years ago
IMO The main benefit of immediate mode GUI is that (unlike "normal widget kits"), the data required to "drive" the widgets is not actually owned by the widgets themselves, making widgets controlled directly by the "program's" data. You make some sort of change to the program's data and it is immediately reflected on the screen. This is as opposed to the "normal widget kits" where you need some "glue" to reflect those changes for example maybe you need to let the widget know its contents were updated and it needs to redraw or redo its layout.

This makes it easier to create certain types of UIs where the main interaction is to modify some data structure directly, which is how many simple tools behave.

gmueckl · 3 years ago
The unfortute truth to these toolkits is that they need to keep a ton of shadow state internally and diff that to the data coming in with each new frame. The most trivial example would be a button. The user redeclares this button each frame as if it was new, but the UI must unify that to a single persistent button instance to get the stateful button behavior right. Every interactive control needs similar logic. In essence you trade tailor-made, performant UI update code with an implicit, complicated and expensive semi-"transparent" generic update logic. It works for simple UI patterns with not too much data in the controls, but anything more heavy will r7n into problems.
quotemstr · 3 years ago
Many people at a certain point in their careers become infatuated with the idea of making a "small", "simple", and "opinionated" component free from legacy "BS". They have the skill to implement the core of that component but lack the wisdom and humility to understand that the "BS" complexity exists for good reasons, that their "small" component is subject to those reasons, and that they haven't actually found a fundamentally better approach that avoids the "BS", but merely skipped the hard parts of software engineering.

You just have to let people go through this phase. You should nod, smile, and compliment them on the economy of their vision. This phase hones skills people need for more serious endeavors. Butt God help you if you actually use one of these "small" systems in production!

throwaway684936 · 3 years ago
Immediate mode is generally used for quick and dirty developer tools. It's rarely used for user-facing UI. You're free to waste your time carefully architecting an MVC application any time you want a few text boxes and sliders to fiddle with something. Microsoft, Google, Nvidia, Valve, Id, Blizzard, Ubisoft will continue to use immediate mode where they deem it useful, in spite of your advice.
astrobe_ · 3 years ago
Apparently you know the feeling when a competitor comes up and do 80% of what you're doing for half the cost (in dev time, memory weight, etc.). Hell, it still feels unfair even when it's a coworker who gets tasked with redoing (usually using some trendy new stuff) the system you've been maintaining for so long and know by heart, and that you've dreamed to rewrite for an equally long time.

You comfort yourself by saying they will run into the same problems that just wait their time in a dark corners of software or hardware. But they generally are in a much better position, with their smaller and simpler software, to deal with it than with old software.

AussieWog93 · 3 years ago
What your heuristic may be accurate in the general sense, it's absolutely not the case for ImGUIs. I've used the technology on a real commercial product before and it was vastly superior to the old way of doing things.

The "BS" complexity of retained-mode GUIs, as you suggested, is not really BS but the logical result of using a client/server model. That said, for the average desktop application (where all necessary state is local to the user's own machine) this model really is a poor fit and ImGUIs shine.

A lot of the evangelism comes from the fact that many more conservative devs still insist on using the more complex client/server retained-mode paradigm, even when immediate-mode is more suitable to the task at hand.

AussieWog93 · 3 years ago
>Other than game-development why is im-gui better than those normal widget kits we are relatively more familiar with: gtk, qt,etc)?

I was tasked with using both types of frameworks back in my old job.

ImGui eliminates entire classes of bugs related to state synchronisation, and was much easier to make performant because it was overall simpler[1].

It's also much simpler to customise, as widgets are nothing more than functions that draw graphics according to a couple of input variables.

I think a lot of people get confused, as they think ImGuis mean redrawing every asset every frame and therefore performance should be bad. In practice, though, there are driver-side caches and it's absolutely excellent to both work with and use the results of.

[1] While in theory retained-mode GUIs should be as performant as ImGuis or better, in practice it's much easier in retained-mode to accidentally perform an expensive action multiple times in a row in response to a single user interaction. Just tick "select all" on a WordPress page with 100+ elements and you'll see it immediately (well, immediately after several billion cycles have passed anyway!).

avodonosov · 3 years ago
The immediate mode gui is largely a myth, IMHO.

The concept of gui fully controlled by program data works well for interfaces consisting of a single button. As soon as we have two buttons, each button has a position, and the positions is the data of the gui itself (retained data), not of the program.

Imagine a multi-tab interface - which tab is currently active and has its controls drawn is the property of the gui (retained data), again.

An action that can be invoked through a menu and can also be added to a toolbar. The toolbar can be expanded or collapsed. Again, that's data of the gui itself (of the view), not of the program (the model).

The currently focused button should be highlighted somehow - the property of the gui again.

Selected elements of a list (they should be highlighted). Expanded/collapsed state of a tree widget nodes. Scroll positions.

So, the immediate mode guis are interesting and somewhat liberating because they demonstrate one can easily build simple ui without complex widget libs, but the results are limited, and very soon stop being really immediate mode. When evolving, they become reinvented wheels of retained mode guis.

cyber_kinetist · 3 years ago
All of these functionalities that you have described can b e easily implemented in an immediate-mode UI framework, and in my opinion much easily than retained-mode UI frameworks. (I know this because I have used Dear IMGUI extensively, and have done almost all of the things you’ve said).

I think you’re arguing with some fundamental “philosophical” stance on what data should be owned by the user and what data should be owned by the GUI. But I feel that pragmatically immediate-mode GUIs are the most efficient at creating complex interfaces (like the ones you have described). The parts where IMGUi are lacking is in complex flexbox layouting, theming, and animations, which isn’t required in editor-like applications for professionals but might matter with end-user applications.

flohofwoe · 3 years ago
It's (more or less) just a different approach to describe a UI through code which does away with objects, event handlers or data binding. Very convenient for purely code driven UI development.
schaefer · 3 years ago
Immediate mode guis let you structure your code differently than traditional libraries. (gtk, etc.)

It’s can be such a fast and light way to work. Get this thing done. And move on to the next thing.

To me it’s just a valuable addition to our toolbox and our quest to use the right tool for the right job.

pjmlp · 3 years ago
Retained UIs can be faster, because they only run the code related to the widget tree that is actually needed.

It is like in games, everyone ends up implementing their own scene graph, while asserting they don't need the one offered by retained mode APIs.

lostdog · 3 years ago
Yeah, but isn't there a CPU cost to having to run through your code on every frame?
throwaway684936 · 3 years ago
Immediate mode GUIs can be used for almost anything that retained mode GUI toolkits (GTK, Qt) can be used for. It removes a lot of the overhead and boilerplate to speed up development.
frankzander · 3 years ago
The used font is really cruel ... I hope it's interchangeable
crispyalmond · 3 years ago
It does support changing the font
b20000 · 3 years ago
very cool. there are already immediate mode libs with a focus on tools. what i’m more interested in is really great gui libs that make architecting multimedia or audio applications easy without requiring me to learn and use game engines. ideally on top of opengl(es) and linux (arm) support. i am thinking about applications where you want cooler UI effects and UX than what we are all used to, like what you sometimes see in games. i just don’t want to do all the drawing myself and don’t want to use game engines. stuff like qt is too heavyweight and too much traditional UI focused. most UI frameworks also have little support built in for advanced producer/consumer or multithreading/work load balancing scenarios and expect you to roll all that stuff yourself over and over.
Flankk · 3 years ago
JUCE is the best option. Shopify came out with React Native Skia, which allows you to draw whatever you need. You can also use Skia directly but it's only a drawing library. I wanted to use something like IMGUI but it's hard to theme and not designed for consumer products. This raygui looks cool but it's bitmap fonts which is no good for i18n.

Edit: Looks like it uses real fonts it just includes a crappy one. I'll have to take a closer look at this.

teawrecks · 3 years ago
Immediate mode GUIs are usually pretty inefficient. I wouldn't use it as a permanent solution in a product. More like a quick way to add controls to avoid having to close the app and edit a config file, or recompile with different params.

Usually you want app GUIs with a style that matches the rest of the apps. Though mobile kinda changed that. I don't know of a performant UI framework for building non traditional desktop apps.

Pulcinella · 3 years ago
Cocoa and CoreAnimation on the Mac allow you to apply arbitrary CoreImage filters to UI elements (not just images) and you can even write your own filters using the Metal shading language (though that’s basically doing a lot of the drawing yourself).

Unfortunately this doesn’t work on iOS (probably for power consumption reasons). Apple does have some filters for things like Gaussian blurs, but they are a private API.

999900000999 · 3 years ago
Would it be possible to define the GUI with XML, Unity just added this officially and it makes life much better.

Then you do something like rootGUI.Query("elementID").RegisterCallback( e => otherFunc(e));

dividuum · 3 years ago
The joy of immediate mode guis is that you don't have to register callbacks or manually modify (for example) the visibility of elements in response to some action. Instead you do:

    if checkbox(&show_debug, "Show debugging features") {
        if button("Run some test") {
            test()

pjmlp · 3 years ago
Joy for ones, pain for others, I don't miss coding GUIs like MS-DOS MODE X or Linux's SVGAlib.
999900000999 · 3 years ago
But then if you need to change some non interactive parts of the UI, your digging though source code instead of modifying XML.

Defining the UI via code becomes cumbersome, stuff like adding attributes, etc

formerly_proven · 3 years ago
This is almost by definition incompatible with the immediate mode paradigm and UXML is for UI Toolkit, which is retained-mode.
conradludgate · 3 years ago
Wait until you find out about HTML and the document object in Javascript
jensus · 3 years ago
The evolution of HTML and CSS clearly shows that HTML isn't suited to describe a interface without massive hints to a rendering engine to manipulate it

Deleted Comment

infogulch · 3 years ago
There has been a recent explosion of immediate-mode GUIs recently, but I'm skeptical that an immediate-mode solution can cover our GUI needs now and into the future.

High refresh rate screens are a reality so you only have 3-6ms to render each frame, as well as high resolution screens at 4k-8k. That's a lot of pixels to push with a CPU on every frame. As another comment points out we also need accessibility. I would generalize this need as "GUIs need to be reinterpretable", this need is not limited to those with disabilities and such a capability can be useful to anyone that wants to customize, automate, and integrate their digital tools.

Are immediate-mode GUIs up to the task? What is driving their authors to pursue this design? Why aren't they choosing a declarative design?

ltadeut · 3 years ago
I don't get your point here. What's the problem with high refresh rates? Games deal with it no problem, and they do way more complicated stuff than a UI with a bunch of buttons and text.

> Are immediate-mode GUIs up to the task?

Yes, there's no reason why imgui's can't do any of that.

> What is driving their authors to pursue this design?

To name a few: Ridiculous bloat and complicated development with things like Qt. No real GUI framework provided by Microsoft apart of their 4-5 half-abandoned offerings.

Also imgui is way simpler to wrap your head around. It's just straight up function calls with no complicated abstractions.

> Why aren't they choosing a declarative design?

Why should it be declarative though? imgui code looks fairly declarative when you read it and it's easy to understand what UI events cause changes

throwaway684936 · 3 years ago
>What is driving their authors to pursue this design?

The fact that it requires an order of magnitude less code to do functionally the same thing as traditional toolkits.

>Why aren't they choosing a declarative design?

Because they aren't trying to build a native, standalone desktop application. Declarative design makes little sense for quick and dirty developer tools that just need to directly view and modify simple data structures.

AussieWog93 · 3 years ago
>That's a lot of pixels to push with a CPU on every frame.

This is a common misconception.

At least with Dear ImGui, all of the actual rendering is performed by the graphics driver, which has a cache.

So, while you may have to queue 100 "render texture" calls every frame, there's no real difference between ImGUI and retained-mode when it comes to the actual frames being rendered.

eliasnaur · 3 years ago
With intelligent frame pacing you can sacrifice, say, a frame of input latency to sustain high frame rates. See https://raphlinus.github.io/ui/graphics/gpu/2021/10/22/swapc....

> Are immediate-mode GUIs up to the task? What is driving their authors to pursue this design? Why aren't they choosing a declarative design

Immediate mode UIs make managing state much easier, and avoids callbacks for event processing. That alone is worth it in my opinion.

oreally · 3 years ago
God the notion that declarative design will somehow fix everything and is the end all be all needs to go away. As people grow more experienced with programming they want more control over the flow of their program, so they can focus on fixing the bugs instead of playing the abstraction game to fix the (internal) bugs, if they can at all.

> Are immediate-mode GUIs up to the task?

Enough for companies like Unity/UE4 to sponsor the github projects.

hexomancer · 3 years ago
All these pixels have to be pushed every frame even with classic GUI. The only difference is that it is usually done by the operating system.
infogulch · 3 years ago
The advantage of a declarative design is that it can be accelerated by the GPU which has a much better scaling computational architecture to serve this need.