Issue figuring out setup with NativeShell

[MostHated]

Hey there, I am having a bit of an issue figuring out exactly where these components are supposed to go within the overall application hierarchy. I tried to look for other projects on github which might be using the mixture of NativeShell and this library, but to my surprise, the only thing that came up was this repo's readme and the actual implementation within the library. Unfortunately, that didn't give me much to try and compare with. If at all possible, could I be pointed in the right direction on what needs to go where? Below is the bare minimum NativeShell setup necessary to produce a working window, which I was using from the Test folder of NativeShell. I wanted to start as minimal as possible to make sure things would work as expected before trying to build out anything, but I can't seem to get a window to load once I try and implement this library. I am most certainly missing a silly detail on where the AdwHeaderBar.minimalNativeshell() needs to actually go, but I just can't quite put my finger on where.

P.S. I tried using fix46, as I was looking at other repos that used this lib without NativeShell, so I figured it was worth a go since it had a header / body field, but unfortunately that would not build with NativeShell, something about the url_launcher it doesn't seem to like. The main branch at least build and "runs", even if I can't see it, so I figure best to probably stick with that.

Minimum from project test folder

```dart import 'package:flutter/material.dart'; import 'package:nativeshell/nativeshell.dart'; void main() async { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( home: DefaultTextStyle( style: TextStyle( color: Colors.white, fontSize: 14, ), child: Container( color: Colors.black, child: WindowWidget( onCreateState: (initData) { WindowState? state; state ??= MainWindowState(); return state; }, ), ), ), ); } } class MainWindowState extends WindowState { @override WindowSizingMode get windowSizingMode => WindowSizingMode.atLeastIntrinsicSize; @override Widget build(BuildContext context) { return WindowLayoutProbe( child: Container( padding: EdgeInsets.all(20), child: Center(child: Text('Welcome to NativeShell!')), ), ); } } ```

My attempt to implement the library into the test

```dart import 'package:flutter/material.dart'; import 'package:flutter/widgets.dart'; import 'package:nativeshell/nativeshell.dart'; import 'package:adwaita/adwaita.dart'; import 'package:get/get.dart'; import 'package:libadwaita/libadwaita.dart'; void main() async { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return GetMaterialApp( theme: AdwaitaThemeData.dark(), // <--- added theme here home: DefaultTextStyle( style: TextStyle( color: Colors.white, fontSize: 14, ), child: Container( color: Colors.black, child: WindowWidget( onCreateState: (initData) { WindowState? state; state ??= MainWindowState(); return state; }, ), ), ), ); } } class MainWindowState extends WindowState { @override WindowSizingMode get windowSizingMode => WindowSizingMode.atLeastIntrinsicSize; // I tried several different overall setups, but could not get any to work. // Such as putting the bar ^ up in the parent class wrapping the WindowWidget // also a few variations of what you see here below, but so far everything // I have tried results in no window actually loading. @override Widget build(BuildContext context) { return AdwHeaderBar.minimalNativeshell( // <---- Header here? window: Window.of(context) , // .parentWindow, currentWindowMenu start: [ WindowLayoutProbe( // <--- Does this go in start? child: Container( padding: EdgeInsets.all(20), child: Center(child: Text('Welcome to NativeShell!')), ), ), ], ); } } ```

Any help would be greatly appreciated! Thanks, -MH

[prateekmedia]

This Is the hierarchy

• WindowWidget or WindowLayoutProbe // whatever is used as a top level object goes here
  • Column
  • HeaderBar
  • Scaffold or AdwScaffold

And if you are using fix46 branch then it would be even simpler (if it builds for you):

• WindowWidget or WindowLayoutProbe
  • AdwScaffold(headerbar: AdwHeaderBar, body: body)

[prateekmedia]

If you still face any issue then I will reopen this.

[MalcolmMielle]

@prateekmedia or @MostHated it would be very interesting if someone could push an example of how to use it with native Shell. Especially since we have the constructors for it.

[MostHated]

I have got this, so far, but a bit busy with work at the moment. Will try to get something better when I get a chance.

[prateekmedia]

@prateekmedia or @MostHated it would be very interesting if someone could push an example

Yes I will try to create a example2 with nativeshell or add example code in README

[MostHated]

Ok, so here is what I have so far. The code below produces this window. I am not sure if there is a shortcut built in, but it looks like in order to actually make the minimize/close etc buttons work you may have to utilize a platform channel back to rust, which makes sense I suppose. There is a shortcut built in, I updated the code below to include it. (I posted it in this gist as well, hopefully it might make it easily searchable for others in the future: https://gist.github.com/instance-id/05e3e805f8b28fa86f427be7c7efde14)

Looks like most of the window actions are located here: https://github.com/nativeshell/nativeshell/blob/498154ec9db2ed6244e32bb6ffbe3d0d2aada077/nativeshell/src/shell/api_constants.rs

Minimal example

```yaml #pubspec.yaml # Not sure if you *need* all of these, some were left over from the # original NativeShell example, which was more complex than this cupertino_icons: ^1.0.4 nativeshell: ^0.1.13 adwaita: libadwaita: window_decorations: ^2.0.0 path_provider: ^2.0.8 package_info_plus: ^1.3.0 shared_preferences: ^2.0.13 # url_launcher: ^6.0.6 # I had to comment this out as I can't compile with this for some reason. # Same reason I could not use the fix46 branch. Some sort of dependency confliction ``` ```dart // main.dart import 'package:flutter/material.dart'; import 'package:flutter/widgets.dart'; import 'package:libadwaita/libadwaita.dart'; import 'package:nativeshell/nativeshell.dart'; import 'package:adwaita/adwaita.dart'; import 'package:window_decorations/window_decorations.dart'; void main() async { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, theme: AdwaitaThemeData.dark(), home: DefaultTextStyle( style: TextStyle( color: Colors.white, fontSize: 14, ), child: Container( color: Colors.black, child: WindowWidget( onCreateState: (initData) { WindowState? state; state ??= MainWindowState(); return state; }, ), ), ), ); } } class MainWindowState extends WindowState { final pc = Get.put(PlatformController()); @override Future initializeWindow(Size intrinsicContentSize) async { await window .setStyle(WindowStyle(canResize: true, frame: WindowFrame.noTitle)); await window.show(); } Future windowAction(String action) async { switch (action) { case 'hide': await window.hide(); break; case 'restore': await window.activate(); break; case 'quit': await window.close(); break; default: } } @override WindowSizingMode get windowSizingMode => WindowSizingMode.atLeastIntrinsicSize; final ThemeType _currentThemeType = ThemeType.auto; @override Widget build(BuildContext context) { return WindowLayoutProbe( child: Column(mainAxisSize: MainAxisSize.max, children: [ AdwHeaderBar.minimalNativeshell(height: 30, window: window, start: [ Builder(builder: (context) { return AdwHeaderButton( icon: const Icon(Icons.view_sidebar, size: 15), // isActive: _flapController.isOpen, onPressed: () { // _flapController.toggle(); }); }) ], end: [ DecoratedMinimizeButton( width: 25, type: _currentThemeType, onPressed: () => windowAction('hide'), ), DecoratedMaximizeButton( width: 25, type: _currentThemeType, onPressed: () => windowAction('restore'), ), DecoratedCloseButton( width: 25, type: _currentThemeType, onPressed: () => windowAction('quit'), ) ]), Container( padding: EdgeInsets.all(20), child: Center(child: Text('Welcome to NativeShell!')), ) ])); } } ```

[prateekmedia]

I have added an example for nativeshell users: https://github.com/gtk-flutter/libadwaita/blob/main/example/example.md#minimal-nativeshell-usage