Flutter Interact: All you need to know!
It's only been couple hours that Flutter Interact Keynote ended and I just found myself there to write you those great releases and news they have made.
First of all, all announcements were like “That’s not enough!!” and when I was watching the Keynote I was surprised and get crazy on every announcement. So let’s look what we have fresh..
Flutter 1.12
With the new Flutter release there are couple good enhancements on Framework, new cupertino widgets and more like:
- iOS 13 Dark mode available: We all know that Flutter has support for Material App and you can use that feature both android and iOS apps but now you can use Dark mode also on your Cupertino App components.
- AndroidX included: Now all Flutter projects is coming with AndroidX support so you no longer need to handle all AndroidX based errors!!
- Add-to-App support: Yess!! Now with Android Studio you can add fully Flutter module/screen/feature in your Android and iOS apps!!
- Google Fonts Support: No more downloading and adding your font in your app and you pubspec.yaml. With Flutter Google Fonts plugin you can use the font that you prefered directly in your dart code!!
- Flutter Galley: Flutter Gallery app fully renewed so you can look the code base for the new widgets and features and try it by running on your preferred platform.
You can checkout all new features came with 1.12 version below.
So far soo good but beginning from now thing will gonna be UIish..
A̶n̶d̶r̶o̶i̶d̶ F͟l͟u͟t͟t͟e͟r͟ ͟S͟t͟u͟d͟i͟o͟
So yes, it hurts but true… During the keynote like all the audience we have been like “Is this happening right now ?”.. Because I didn’t believed when I first saw the Hot UI!!
From beginning of Flutter Development there is no possible preview and see our UI without any running emulator or device. But now things have changed so with Hot UI tool for Android Studio we can preview our Flutter app UI directly from Android Studio IDE, you can make chances on Hot UI and see those changes via Hot Reload without touching the code.
Hot UI available the last preview version of Android Studio.
Brand New Dart Dev Tools
With Dart Dev Tools you were able to debug your flutter app and inspect your flutter code. But now with new Preview of Dart Dev Tools things get crazy! They redeveloped Dart Dev Tools using Flutter and made it a standalone app. So yes now we gonna use a platform to debug our apps that developed with Flutter. Now you can debug your apps and measure your performance and other metrics with Dart Dev Tools.
Layout Explorer: It’s a brand new feature that you can see your widget tree and you can directly interact with it by clicking on DevTool and also it highlighted on virtual device. Also you can make some changes on it and escape from overflow error. After that you can back to your code and see what is changed and which part of code that causes the problem.
Flutter Octopus: VS Code code debug
Ok, they keep getting crazy…
With new VS Code multi-debugging tool you can run your code on multiple devices and platforms simultaneously. But that’s not enough.
You also can put a breakpoint on your dart code and you can track your code debugging on multiple devices.
Yes that’s true. On Keynote they brought a table on stage with 7 devices connected a mac and running a Flutter app on debug, they made some changes and reflect it on 7 devices simultaneously with Hot Reload and track which device is activated and hit the break point.
Supernova
Supernova is a tool that you helps you to generate UI code for many platforms including Flutter. So with Supernova you can integrate Sketch or Adobe Ex UI and it directly creates your components and allow you edit them from editor and on the other side you can see an app running on a real device. So when you get all the things done and choose a project file for your code, you can hot reload your dart code from Supernova and its simultaneously changes on your Flutter project. At the end you can see your code on your IDE and run it on emulator or your device.
It’s magic!!
For more you can visit Supernova website and also you can download and use Supernova free for Flutter Development.
In my opinion the UI integration features are enough but they don’t think so…
Adobe Ex Flutter Plugin
With Adobe Ex Flutter Plugin, you can directly export your UI to Dart code. Wait for it.. It’s also supports hot reload? Yess.. When you gonna change something from Adobe Ex and save it, you can see directly the change on your emulator or your device. But that’s not all..
Also you can parameterize your component and allow it to take parameters in Widget. So during the development you can give parameters while you call your widget and make changes on it. Cool stuff..
Checkout more below.
Flutter For Web
Now Flutter For Web can actively usable on beta. Page routing, native text controls and mobile accessibility are new features and there are many cool plugins that you can use.
For more about Flutter For Web you can checkout the blogpost below.
Flutter For Desktop
Flutter For Desktop is now on alpha version for macos. Also Flutter Gallery app has Desktop support. Furthermore there are a lot of improvements for keyboard accessibility and more. You can checkout for more for Flutter For Desktop.
Apps Made with Flutter
Conclusion
Flutter make a spectacular progress during the 2019 and for me they bring the dream to life!! Imagine in one year of progress they give us a lot of tools to develop, debug, and make great UI’s easier and now we can even run our apps on web and desktop with just enabling them for our projects.
