Flutter Support

[jonas-jonas]

For Flutter to be completely supported there are a few extra steps to be taken:

1. Flutter ships its own SDK distribution (version)
   -> We need to add a Flutter location to the preferences (<flutter_root>/bin/cache/dart-sdk/)
2. Identifying a project as a Flutter project
   -> In the pubspec.yaml file of a project flutter is listed as a dependency
   Might need to parse the yaml file here to be sure about this upfront (using a PropertyTester)
3. In Flutter projects we should use the flutter cli tools instead of the Dart tools
   e.g. use flutter pub get instead of pub get, etc.
   Probably also shouldn't use the shipped Dart SDK directly (as that might cause problems) [=> 1.]
4. Add the necessary config for flutter run etc. via launch configurations
   Maybe we can also implement shortcuts for the AVD Manager and simplify the whole process of setting up Flutter for the first time (which is quite tedious).

These are a few considerations to be aware of.
There might be more.

[vogella]

@jonas-jonas any progress here?

[jonas-jonas]

No, currently working on #110. Will provide updates on that soon though and start working on this as well.

[androidworx]

Here are some observations from my attempt to open a Flutter project using Dartboard. The project is the "Hello world" example created by using the default Android Studio Flutter template.

1. When I open the project, I see it displayed in Package Explorer with file-type-specific icons. Good.
2. When I open the pubspec.yaml file with the YEdit YAML editor, I get a "Missing node.js" warning dialog. There is no problem if I use the Yaml Editor from the Market Place.
3. The main.dart file has been located by the template in a "lib" sub directory. When I open this file with the generic editor, I see syntax highlighting and no errors. However, if I try to launch the application, it fails because the main.dart file is expected to be in the root project folder.
4. If I copy main.dart to the root project folder and try to launch the project again, I get mutliple errors, all reporting "Error: Not found 'dart:ui'. Here is an example:
   file:///D:/flutter/flutter/packages/flutter/lib/src/material/animated_icons.dart:9:8: Error: Not found: 'dart:ui' import 'dart:ui' as ui show Paint, Path, Canvas;

I am trying out Dartboard on a fresh Windows 8.1 Pro installation, thus using the latest release versions of all tools. One thing I noticed during the Flutter set up on Android Studio is that a Dart plugin is installed as well. I expect there will be a lot of issues around the role of this plugin in getting a Flutter editor to work.

If you have any questions or need assistance, I can be contacted using the email address in my profile.

Regards
Andrew

[jonas-jonas]

Hi Andrew,

thanks for taking the time to test this. The problem with Flutter apps is that they ship their own version of the Dart SDK (customized). This is not accounted for in the plugin, and thus Flutter projects are not supported yet. I'm working on it and it should be released by the end of the month.

When I open the pubspec.yaml file with the YEdit YAML editor, I get a "Missing node.js" warning dialog. There is no problem if I use the Yaml Editor from the Market Place.

We recommend using the WWD plugin. pubspec.yaml is just a plain yaml file, nothing special about so any Yaml editor should do, but personally I use WWD during development.

The main.dart file has been located by the template in a "lib" sub directory. When I open this file with the generic editor, I see syntax highlighting and no errors. However, if I try to launch the application, it fails because the main.dart file is expected to be in the root project folder.

There should be a popup on first selection of the "Run as Dart program" that lets you specify the location of the main file.

If I copy main.dart to the root project folder and try to launch the project again, I get mutliple errors, all reporting "Error: Not found 'dart:ui'. Here is an example:
file:///D:/flutter/flutter/packages/flutter/lib/src/material/animated_icons.dart:9:8: Error: Not found: 'dart:ui' import 'dart:ui' as ui show Paint, Path, Canvas;

This is because the Flutter project setup expects src files to be inside the lib/ folder. This should not be necessary though, if you specify the correct location in the launch configuration.

One thing I noticed during the Flutter set up on Android Studio is that a Dart plugin is installed as well. I expect there will be a lot of issues around the role of this plugin in getting a Flutter editor to work.

I'm not sure I understand what you're saying here. The Flutter & Dart plugin are separate projects in IntelliJ/AS. This is just their setup. For us we combined these features for now and will only ship one plugin that supports Dart, Flutter and Dart Webdev projects instead of splitting them up.
Currently, It's just a matter of work to be done for the Flutter support to land.

[androidworx]

There should be a popup on first selection of the "Run as Dart program" that lets you specify the location of the main file.

Ok, In the launch dialog I changed the "Main class:" field from "main.dart" to "lib/main.dart". This fixed the the problem of finding the main.dart file, but I still got multiple "Not found 'dart.ui'" errors.

[DanTup]

still got multiple "Not found 'dart.ui'" errors.

dart:ui is only included in Flutter's version of the Dart SDK, so this is expected if it's using a standard Dart SDK. I think that's what point 1 on the original list at the top here is about. If you can force it to use the SDK from inside the Flutter repo (by config or setting it on PATH - I'm not very familiar with this project), that might get the analysis working correctly.

[jonas-jonas]

but I still got multiple "Not found 'dart.ui'" errors.

Yes, as @DanTup says. The dart:ui package is only included in the Flutter Dart SDK. We do not have that set up and use the $ dart command directly to launch Dart files. So I don't think there is way right now to use Dartboard for Flutter projects.

I plan on adding a way to configure the Dart SDK from Flutter for Flutter projects though. I will ping this issue once Flutter development is ready for testing and usage.

If you can force it to use the SDK from inside the Flutter repo (by config or setting it on PATH - I'm not very familiar with this project), that might get the analysis working correctly.

You could use the preference page to set the Dart SDK location to Flutter manually. This would also get the analysis working. You would however need to launch the application from a command line manually.

[mickaelistria]

We need to add a Flutter location to the preferences (<flutter_root>/bin/cache/dart-sdk/)

I don't think a preference is an immediate requirement, you can just find the location of the SDK by invoking which flutter or where flutter to retrieve the SDK location and infer the dart-sdk location from it. That would probably cover 90% of cases already without adding configuration load onto users.
The preference can come later, as a future and separate improvement.

Identifying a project as a Flutter project

Is it really necessary in a 1st iteration? I don't get what value this would bring.

In the pubspec.yaml file of a project flutter is listed as a dependency [...] Might need to parse the yaml file here to be sure about this upfront (using a PropertyTester)

I think you don't need to parse, just checking if raw text file contains flutter should also cover the majority of cases properly and be acceptable for a 1st iteration.

Add the necessary config for flutter run etc. via launch configurations

Does a combination of Dartboard and flutter run works in CLI to deploy the flutter app on a phone? If yes, I'd love to see a video; and I think the Run As > Flutter Application... launch config would really become the most interesting feature (beyond all other ones), even if it shows up on plain Dart projects (this can be refined later).

[jonas-jonas]

Is it really necessary in a 1st iteration? I don't get what value this would bring.

We do have to decide whether to run pub get or flutter pub get and this applies to a whole lot of other commands (like running the app, etc.)

I think you don't need to parse, just checking if raw text file contains flutter should also cover the majority of cases properly and be acceptable for a 1st iteration.

This is how it is done in the VSCode plugin, and I think it's a good approach.

Does a combination of Dartboard and flutter run works in CLI to deploy the flutter app on a phone? If yes, I'd love to see a video; and I think the Run As > Flutter Application... launch config would really become the most interesting feature (beyond all other ones), even if it shows up on plain Dart projects (this can be refined later).

Yes, but this is why we need a way to decide whether the project is a Flutter project or just Dart.

I have started some work on this, but have become busy the past few weeks. So progress is slow at this time, but I definitely have it as a priority for the coming weeks.

[vogella]

First iteration done in the wip-flutter branch. @jonas-jonas already opened new issues for the remaining items.