gtk_window

Description:

gtk window

GTK Window #
A package that add some missing gtk4 windowing features to flutter. Works for linux but it can also work for MacOS and Windows.




Before
After













Features #

Window Command buttons like Maximize, Minimize, and Close
Back button when there's a view that can be poped
Custom leading and trailing widgets
PreferedSize bottom widgets
Light and Dark mode
Headerbar reacts to the window focus state
On window resize call allows you to add custom logic in reaction to the window resize
Curved corners (thanks to handy_window)

Getting started #
Linux: #
To get rounded corners move the two lines to the end of the my_application_activate class
from:
gtk_window_set_default_size(window, 1280, 720);
//gtk_widget_show(GTK_WIDGET(window));
copied to clipboard
FlView* view = fl_view_new(project);
//gtk_widget_show(GTK_WIDGET(view));
gtk_container_add(GTK_CONTAINER(window), GTK_WIDGET(view));
copied to clipboard
to:
static void my_application_activate(GApplication* application) {
...

gtk_widget_show(GTK_WIDGET(window));
gtk_widget_show(GTK_WIDGET(view));
}
copied to clipboard
Usage of GTKHeaderBar #
It's a drop in replacment for the AppBar widget. So It allows you to just replace the Material with it for desktop clients.
Basic title #
import 'package:gtk_window/gtk_window.dart';
Scaffold(
appBar: GTKHeaderBar(
middle: Text('example title'),
),
)
copied to clipboard
Basic title with overflow hamburger menu: #
import 'package:gtk_window/gtk_window.dart';
Scaffold(
appBar: GTKHeaderBar(
middle: Text('example title'),
trailing: ElevatedButton(
child: Icon(child: Icons.menu,)
),
),
)
copied to clipboard
Basic title with search bottom: #
import 'package:gtk_window/gtk_window.dart';
Scaffold(
appBar: GTKHeaderBar(
middle: Text('Settings'),
trailing: GTKButton(
child: Icon(child: Icons.menu,)
),
bottom: PreferredSize(
preferredSize: const Size.fromHeight(48),
child: TextField()
)
),
)
copied to clipboard
Complicated split view with bottom search_bar: #
Check out this fork

Current limitations #

The OS doesn't treat the appbar natively so it can't be hidden in the case of using a window manager.
Currenlty right-clicking on the header does nothing.

Why not just use the native headerbar provided by flutter? #
Due to the wide array of supported platforms that the flutter team mantain, they have to bundle features together to work on as much platforms as they can to simplify development. So they made the GTK appbar version to be just like MacOS's and Windows' as they just hover over the content without having so muchcontrol over them. In GTK the appbar's can have lots of widgets contained in them, which without this package you would have no control over them.
Disclaimer #
I not very profecient with GTK itself and every suggestion is welcome.
Used plugins #
I actually didn't write any platform specific codes for this package. I relied on the amazing work done by handy_window and window_manager maintainers.