Flutter Desktop click through window

Question

I'm building a transparent app using Flutter Desktop for Linux, is there a way to click through the main app window, still showing the app? I'm trying to write some kind of overlay app.

I've tried using the IgnorePointer widget on the root widget but that still doesn't forward the click events behind the window.

I assume there's some kind of binding to add in the application.cc file.

Answer 1

1. Make the App Transparent

• Open your application.cc file in the Linux folder of your Flutter project.
• Add code to make the window background transparent using GTK (a Linux window library).

EX:

#include <gtk/gtk.h>

// Make the window transparent
gtk_widget_set_visual(gtk_window, gdk_screen_get_rgba_visual(gdk_screen_get_default()));

2. Enable Click-Through

• Use X11 to make the app ignore mouse clicks.
• Add this code to ignore mouse input:

EX:

#include <X11/extensions/shape.h>
#include <X11/Xlib.h>

// Ignore mouse clicks for the window
XShapeCombineRegion(display, window, ShapeInput, 0, 0, None, ShapeSet);

3. Rebuild the App

• After making the changes, rebuild your app using:

flutter build linux