input-remapper icon indicating copy to clipboard operation
input-remapper copied to clipboard

GUI Redesign based on libadwaita and multiple "pages"

Open sezanzeb opened this issue 3 years ago • 2 comments

I'll try to collect ideas and resources for a new GUI here. I think it is really hard to fit all of the features of the beta branch into one single window.

goals:

  • a clean and non-cluttered GUI, similar to gnome-music
  • work well with the modern adwaita theme
  • use headerbars
  • reuse as many elements from the mapping configuration of the beta GUI as possible / recreate them with libadwaita
  • use modern dialogs https://developer.gnome.org/hig/patterns/feedback/dialogs.html

concept:

  1. application starts and shows a device list. Analogous to how gnome-music shows the album list on start
  2. select device from list. The complete GUI transitions to a different view, which shows the preset list. gnome-music also has that transition. On the top left in the headerbar a back button < is shown
  3. selecting a preset from list acts in the same way
  4. This leads to the preset configuration, which might look exactly like the stuff we have on beta

resources:

  • adwaita python demo https://github.com/timlau/adw_pydemo
  • gnome-music, which is also written in python https://gitlab.gnome.org/GNOME/gnome-music/
  • libadwaita docs https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/
  • cambalache, the GUI designer for libadwaita/gtk4 https://www.linuxadictos.com/en/swap-a-tool-for-creating-gtk-user-interfaces.html

sezanzeb avatar Sep 09 '22 18:09 sezanzeb

They do things like

@Gtk.Template(resource_path="/org/gnome/Music/ui/AlbumsView.ui")
class AlbumsView(Gtk.Stack):

it's not a single ui file like we have

sezanzeb avatar Sep 10 '22 08:09 sezanzeb

I also think it is a good idea to have a wizard with a more curated process for creating a new mapping.

  1. What kind of Mapping?
    • Analog axis
    • key
    • macro
  2. Record the input
    • provide a warning if the input is incompatible with the selected mapping type
  3. provide a window with the relevant information for mapping type

jonasBoss avatar Sep 14 '22 16:09 jonasBoss

How about instead of using libadwaita, you port the app to Tauri and write the frontend in something like Vue.js?

TerrorSquad avatar Sep 20 '22 22:09 TerrorSquad

I want desktop apps to properly integrate with the look and feel of the rest of the desktop

sezanzeb avatar Sep 21 '22 06:09 sezanzeb

Understandable.

But that's only for the GNOME desktop? Is it going be easy to integrate with the look and feel of KDE or Cinnamon?

TerrorSquad avatar Sep 21 '22 10:09 TerrorSquad

Cinnamon is GTK based just like Gnome and Libadwaita, the only difference is that their own apps probably don't use headerbars like Gnomes do. The theme will be consistent. KDE will theme GTK apps, so it's similar to Cinnamon here.

sezanzeb avatar Sep 21 '22 11:09 sezanzeb

It should be possible to write arbitrary user interfaces for input-remapper in any language or framework, it just needs to communicate with the daemon and manage the config files. There are some apps that have both qt and gtk variants.

This is the first time I heard of Tauri and it looks really interesting, since it claims to use less memory and disk space than electron. I'll keep that in mind

sezanzeb avatar Sep 21 '22 12:09 sezanzeb

Great to hear it will work on both Cinnamon and KDE as well.

I'm using Mint on my laptop and Kubuntu on my desktop since I'm not a GNOME fan.

I found some reddit discussions about not being able to theme libadwaita apps on KDE, such as this one: https://www.reddit.com/r/kde/comments/ry20h7/are_there_any_plans_by_kde_to_try_and_tame_the/ That was the only reason why I asked about about DEs.

As for Tauri, their basic Hello World app with Vite and Vue.js requires about 28MB of RAM. Binary is 6.5MB, DEB file 2.5MB and AppImage is about 70MB. (Additional compression can be applied with tools such as UPX)

It could prove useful and allow for faster development since there are more web developers compared to gtk developers (more potential contributors).

TerrorSquad avatar Sep 21 '22 13:09 TerrorSquad

Thanks. I have just seen https://gitlab.gnome.org/GNOME/gtk/-/issues/3409, maybe we shouldn't use libadwaita after all. There is some crazy stuff possible though, like https://www.reddit.com/r/gnome/comments/xfelgq/adwtaboverview_in_action/

Thinking that "Libadwaita is still GTK so it will continue to work the way it used to" was apparently somewhat naive. I thought the theming restrictions were only a matter of the Gnome user interface, since overwriting GTK_THEME worked

sezanzeb avatar Sep 21 '22 13:09 sezanzeb

@TerrorSquad the new gui is still running on GTK 3, it will theme the same way it used to. Thanks for your remarks

it is available on the beta branch

sezanzeb avatar Oct 16 '22 12:10 sezanzeb

If I have to choose between rewriting everything in qt and using libadwaita, I'd rather give qt a try as of now.

I dislike the theming restrictions, and their arguments why they made that move don't convince me.

sezanzeb avatar Oct 16 '22 17:10 sezanzeb

I would suggest not using qt but kirigami which is based on qml which in turn is based on qt. Kirigami is the standard framework for new kde applications (as far as I know). It allows for fully convergent GUIs, a good example is discover, and it does not look out of place on a gnome desktop.

jonasBoss avatar Oct 17 '22 09:10 jonasBoss