macosui / macos_ui

Flutter widgets and themes implementing the current macOS design language.
https://macosui.github.io/macos_ui/#/
MIT License
1.81k stars 178 forks source link

Example app broken on non-macOS platforms #436

Closed jmatth closed 1 year ago

jmatth commented 1 year ago

Description

Launching the app on non-macOS platforms results in immediate exceptions. I've so far tested on Windows and Chrome, but based on the exceptions I'm almost certain the same errors will occur on any platform other than macOS

Steps To Reproduce

  1. Run the example app in this repo targeting a device other than macos.

Expected behavior

Example app should open and display the widgets gallery.

Actual behavior

An exception is immediately thrown. Since the exception is thrown in main before runApp is called, the app seemingly freezes with a blank screen without even displaying Flutter's red error screen in debug mode.

Screenshots

Windows

image

Chrome

image

Logs

Logs Logs generated without `--verbose` since doing so adds a bunch of useless noise that pushes the comment length above Github's limit. ``` Launching lib\main.dart on Windows in debug mode... Building Windows application... 6.6s √ Built build\windows\runner\Debug\example.exe. [ERROR:flutter/runtime/dart_vm_initializer.cc(41)] Unhandled Exception: MissingPluginException(No implementation found for method initialize on channel macos_window_utils/window_manipulator) #0 MethodChannel._invokeMethod (package:flutter/src/services/platform_channel.dart:308:7) #1 WindowManipulator.initialize (package:macos_window_utils/window_manipulator.dart:38:5) #2 MacosWindowUtilsConfig.apply (package:macos_ui/src/macos_window_utils_config.dart:71:5) #3 _configureMacosWindowUtils (package:example/main.dart:19:3) #4 main (package:example/main.dart:23:3) Syncing files to device Windows... 72ms Flutter run key commands. r Hot reload. R Hot restart. h List all available interactive commands. d Detach (terminate "flutter run" but leave application running). c Clear the screen q Quit (terminate the application on the device). A Dart VM Service on Windows is available at: http://127.0.0.1:54997/cCv-1HuzTj4=/ The Flutter DevTools debugger and profiler on Windows is available at: http://127.0.0.1:9103?uri=http://127.0.0.1:54997/cCv-1HuzTj4=/ Application finished. ``` ``` Analyzing example... No issues found! (ran in 1.1s) ``` ``` [!] Flutter (Channel stable, 3.10.5, on Microsoft Windows [Version 10.0.22621.1848], locale en-US) ΓÇó Flutter version 3.10.5 on channel stable at C:\Users\josh\fvm\versions\3.10.5 ! Upstream repository C:\Users\josh\Projects\forks\flutter is not a standard remote. Set environment variable "FLUTTER_GIT_URL" to C:\Users\josh\Projects\forks\flutter to dismiss this error. ΓÇó Framework revision 796c8ef792 (8 days ago), 2023-06-13 15:51:02 -0700 ΓÇó Engine revision 45f6e00911 ΓÇó Dart version 3.0.5 ΓÇó DevTools version 2.23.1 ΓÇó If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades. [ΓêÜ] Windows Version (Installed version of Windows is version 10 or higher) [ΓêÜ] Android toolchain - develop for Android devices (Android SDK version 33.0.2) ΓÇó Android SDK at C:\Users\josh\AppData\Local\Android\sdk ΓÇó Platform android-33, build-tools 33.0.2 ΓÇó Java binary at: C:\Program Files\Common Files\Oracle\Java\javapath\java.exe ΓÇó Java version Java(TM) SE Runtime Environment (build 18.0.2.1+1-1) ΓÇó All Android licenses accepted. [ΓêÜ] Chrome - develop for the web ΓÇó Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe [ΓêÜ] Visual Studio - develop for Windows (Visual Studio Community 2022 17.6.3) ΓÇó Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community ΓÇó Visual Studio Community 2022 version 17.6.33801.468 ΓÇó Windows 10 SDK version 10.0.22621.0 [!] Android Studio (not installed) ΓÇó Android Studio not found; download from https://developer.android.com/studio/index.html (or visit https://flutter.dev/docs/get-started/install/windows#android-setup for detailed instructions). [ΓêÜ] IntelliJ IDEA Community Edition (version 2022.2) ΓÇó IntelliJ at C:\Users\josh\AppData\Local\JetBrains\Toolbox\apps\IDEA-C\ch-0\222.4345.14 ΓÇó Flutter plugin can be installed from: https://plugins.jetbrains.com/plugin/9212-flutter ΓÇó Dart plugin can be installed from: https://plugins.jetbrains.com/plugin/6351-dart [ΓêÜ] VS Code (version 1.79.2) ΓÇó VS Code at C:\Users\josh\AppData\Local\Programs\Microsoft VS Code ΓÇó Flutter extension version 3.66.0 [ΓêÜ] Connected device (3 available) ΓÇó Windows (desktop) ΓÇó windows ΓÇó windows-x64 ΓÇó Microsoft Windows [Version 10.0.22621.1848] ΓÇó Chrome (web) ΓÇó chrome ΓÇó web-javascript ΓÇó Google Chrome 114.0.5735.134 ΓÇó Edge (web) ΓÇó edge ΓÇó web-javascript ΓÇó Microsoft Edge 112.0.1722.64 [ΓêÜ] Network resources ΓÇó All expected network resources are available. ! Doctor found issues in 2 categories. ```

Further details

The initial exception comes from an unconditional call into macos_window_utils right at the top of main. Since that plugin understandably only supports macOS, this call throws. After fixing this the app is still broken due to an unconditional use of PlatformMenuBar, which is again only supported on macOS. Adding conditional logic to only execute this code on macOS allows the example app to run.

Edit: for web, an additional fix is needed to prevent accessing Platform.isMacOS in utils.dart.

GroovinChip commented 1 year ago

Been trying to make this work on web and I think this it be more trouble than its worth. We may need to make it clear that from 2.0 on, it is expected that macos_ui only be used on macOS.

whiplashoo commented 1 year ago

Indeed, I too believe that supporting only macOS (and providing a web playground for showcasing the components) would be optimal going forward.

GroovinChip commented 1 year ago

I've got it sort of working on web:

Screenshot 2023-07-19 at 9 54 23 AM

Theming is borked for some reason

EDIT: only dark theme is borked, light looks fine:

Screenshot 2023-07-19 at 9 55 52 AM
GroovinChip commented 1 year ago

Minimum reproducible sample using 2.0.0-beta.9:

import 'package:flutter/material.dart';
import 'package:macos_ui/macos_ui.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MacosApp(
      title: 'Flutter Demo',
      theme: MacosThemeData.light(),
      darkTheme: MacosThemeData.dark(),
      themeMode: ThemeMode.dark,
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return MacosWindow(
      child: MacosScaffold(
        children: [
          ContentArea(
            builder: (context, _) => const Center(child: Text('Content')),
          ),
        ],
      ),
    );
  }
}