Theoreticaly, could you implement the XMB in lvgl?

General discussion
1

Long story short: I, personally, love the Xross Media Bar used on the PSP, PS3 and a few Bravia TVs and I would love to have this kind of UI for a small media pc I am working on. Thing is, there is no real re-implementation aside from the one found in RetroArch.

Now, using the Sokol library, it would be pretty easy to have LVGL run on “kind of” anything, and with a predefined JSON structure, it’d be easy to declare a menu structure and maybe by using a language like Lua it would even be scriptable. But - could I even use lvgl to do this?

I have been reading all over the API lately and have started a little bit of work to make lvgl a GUI for homebrew applications on the Playstation Vita (using the community developed vita2d library, found in the VitaSDK on Github). So I have found myself with a rough understanding of what the library is capable of. However, there are a few things I have not figured out just yet:

  • Can I create custom controls?
  • Can I create an animated background (gpu accelerated)?

So far, I think that all that it would take to make an XMB would be a background, a horizontal list of icons (tabs) which have an event handler upon selection to change text in a label (usually top-left or underneath the icon itself) to show the tab’s name and a vertical list of icons. The focused icon has a horizontal offset to allow text to be displayed and the menu entries above the selected icon must float above the horizontal tabs, whilst following entries may not have any “gap”, since there would be nothing they would be overlaying.

So: background, horizontal icons (tabs) and vertical list entries with icons (menu). Selecting a menu brings up a submenu without changing the tab.

Could this be implemented in lvgl? And if so, how? I’d love to put this together, but with a visual impairment (and thus always having absolutely shied away from anything graphical in terms of programming…i regret this decision) I am only able to really see how the tabs and menus would look like. But - I have not found any APIs that would let me make custom controls that i could allow to be controlled with existing input devices.

Technically, I probably could get away with a combination of tabs and lists; but would have to apply heavy re-styling. That is why I wanted to know if custom controls exist, because at that point, writing a custom control might just be easier :slight_smile:

Got any idea? Would love to hear about it!

Kind regards,
Ingwie

2

Sounds very interesting! However, it’s a quite special control and I don’t think you can use any of the built-in widget to get something like this.

It’s certainly doable but requires a new widget. It’d require some time to implement this widget but it’s surely possible. We have a widget implementation service exactly for these cases. Please contact us via the form on the website if you are interested.

Yes, you can. See for example how lv_led is created

By animated background do you mean a live wallpaper?

3

I do have a budget, but this is a hobby project so I would rather try to make it myself. A service for that sounds like it could be expensive - so I’d probably be better off doing it on my own :slight_smile:

Will do so! Thanks for the pointer.

Yes. Since I am not sure how to best implement it, it’d either be a short and looped video clip or, if possible a GPU rendered one. But is that even possible or would I have to make LVGL draw on a transparent background and overlay it ontop of a native gpu context (i.e. openGL)?

4

The most simple way is using an lv_canvas object and render the video there. lv_canvas is managed by LVGL so it can be the part of your UI as any “normal” widget.

5

So I took a look at the lv_canvas APIs and noticed the _draw routines. I’ll have to see how, but I bet it’d be possible to process with the GPU and then later draw the given frames into the canvas. What I did not find is if these were threadsafe so that I could delegate a separate thread to process the background as to make the remaining code run independently. Is it threadsafe?

6

None of the LVGL APIs except lv_tick_inc are thread safe. However, if you use a mutex to ensure that you don’t invalidate the canvas while lv_task_handler is running on another thread, and you are just drawing into the canvas’ backing buffer, you should be able to safely process the background on another thread.