What is the difference between retained and immediate mode GUI?

1.01K views

I’ve been having problems with differentiating the two.

Thanks in advance!

In: Technology

3 Answers

Anonymous 0 Comments

Can I get an ELI5 on the title?

Anonymous 0 Comments

When asking a GUI library to draw something…

…in retained mode, it retains that request in a list until it is time to render the scene. When it’s time to render, it goes through the list rendering each item. It may do pre-processing on that list (e.g., z-ordering or optimisation) before rendering too.

…in immediate mode, it immediately renders the request to the screen and nothing more.

Anonymous 0 Comments

Immediate mode essentially means that the GUI is a function of the application state. In other words, each time the interface is drawn, the visual components are derived from the actual values/data that make up what the application is doing. Because of this, an immediate-mode GUI is never out of sync with its underlying application. For example, if a user moves a slider from 0 to 100% for a volume slider in an immediate mode GUI, as the slider moves, it changes the actual value of the volume variable, then the GUI is drawn again based on the actual value of the volume. Thus, the GUI and the rest of the app always agree with each other.

Retained mode is somewhat of a corollary. A good mental model for a retained mode UI is that the UI itself has its own state and it doesn’t have direct interaction with the logic of the application. The app has its own space in memory for values/data that represents what it’s doing, then it separately synchronizes those values to and from the GUI via events. In other words, when the application does something, it separately tells the GUI what to do. At the same time, when the user does something, it notifies the rest of the application that something happened. It’s now the responsibility of the programmer to make sure both sides agree with each other, or are “synchronized.” The previous volume slider example with a retained mode UI would work something like this:

1. Application has a variable set to 0%.
2. GUI has a separate variable also set to 0%.
3. User slides the slider to 100%. The variable inside the UI has now changed to 100%, but the volume has not changed.
4. The GUI notifies the application of the change.
5. The application handles the event and changes its internal variable and now the volume has changed.

I hope this helps. 🙂