New tooling releases - Improved Code completion, New UI-as-Code lints and assists

[Nilay Yener]

Happy Friday Flutter-Dev!

New tooling releases are available, check below for the details!

Improved code completion!

We now show code completion for symbols that are not yet in scope. When one of these completions is selected, we’ll auto-update the imports for the file automatically. Users will need to do a lot less manual maintenance of their imports, and will be able to use code completion to better explore the set of available classes.

In the below example, choosing the top item in the list will add automatically an import for dart:math. To enable completions for other packages just add them to your pubspec.yaml.

This feature is available in IntelliJ 2019.1. It’s not current available in Android Studio stable version (3.4), but will be available in the upcoming Android Studio 3.5.

New UI-as-Code lints and assists

We’ve added several new lints and code assists to aid in using the new UI-as-code language features (spread collections and conditional expressions in lists).

The prefer_spread_collections lint: “Use spread collections when possible. Collection literals are excellent when you want to create a new collection out of individual items. But, when existing items are already stored in another collection, spread collection syntax leads to simpler code.”

The prefer_if_elements_to_conditional_expressions lint: “When building collections, it is preferable to use if elements rather than conditionals.”

The prefer_for_elements_to_map_fromIterable lint: “When building maps from iterables, it is preferable to use for elements.”

Changelog

More details about changes are fixes are available in our changelog.

[Nilay Yener]

New Flutter IntelliJ Plugin feature in the M35.1 release!

Editor UI Guides

To address user feedback on the challenge of seeing widget tree structures from code, we added a new feature called Editor UI Guides in this release. UI Guides help developers better visualize the structure of their widget code, especially in large build methods.

Here’s an example from a Calculator app, where the UI Guides clearly illustrate how the UI is built (from an Expanded Column containing several KeyRow’s of NumberKeys):

Based on feedback from developers who tried the UI Guides in a UX study, we also added visual indicators on the editor’s scrollbar to help developers quickly locate the widget code in a large Dart file:

Since both features are new, they’re not on by default yet. To see them,  enable the ‘UI Guides’ setting in Preferences > Languages & Frameworks > Flutter (see the screenshot below). We encourage you to give it a try! You can send us your feedback at github.com/flutter/flutter-intellij/issues.

[Diego Garcia]

Very nice !!!

Kudos :)

--
You received this message because you are subscribed to the Google Groups "Flutter Dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flutter-dev...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Rabih M. ElBaba (Gmail)]

Hello...

How do I enable this feature in android studio? I am currently using it in PHP editor it called guidelines.

Thank you in advance.

[jacobr]

Preferences > Languages & Frameworks > Flutter

Check UI Guides to enable the feature in VSCode. Let me know how it works for you.

Thanks!

Jacob

To unsubscribe from this group and stop receiving emails from it, send an email to flutt...@googlegroups.com.

[Rabih M. ElBaba (Gmail)]

How can I enable it in Android Studio?

Regards

To unsubscribe from this group and stop receiving emails from it, send an email to flutter-dev...@googlegroups.com.

[Jacob Richman]

Sorry when I wrote VSCode I meant to write AndroidStudio!

Instructions:
in Android Studio or IntelliJ go to:

Preferences > Languages & Frameworks > Flutter

Check UI Guides to enable the feature . Let me know how it works for you.

[Rabih M. ElBaba (Gmail)]

Sorry, I don't have such as this path in my android studio 3.4, I'm running on windows 10

Regards

[Jacob Richman]

Open the Preferences dialog and search for Flutter. Here is what I see on Android Studio.

[Rabih M. ElBaba (Gmail)]

With reference to the following thread:

https://stackoverflow.com/questions/30588696/window-preferences-missing-in-android-studio-after-update

It seems the File > Settings is the replacement to Window > Preferences

On Tue, May 7, 2019 at 12:15 AM Jacob Richman <jac...@google.com> wrote:

[M. Blu.]

Oh, I found the solution. There is a letter in the right bottom corner of the suggest-window. I change it to "sort by relevance" and it looks better for me.

Am Mittwoch, 11. September 2019 22:03:31 UTC+2 schrieb M. Blu.:

Hi Nilay,

I have a problem with the improved Code Completion. Since the update I have many duplicate lines in the suggestion. e.g. why I see five times "EdgeInsets.only". Is it possible to group it to show only the parameter? I don't need all the different packages.

thanks

[Katleho Motumi]

in studio code where can we get