Adobe XD support for Flutter, Architecture Framework, temporary closures with Places API, & more!
Announcing Adobe XD support for Flutter. Create in XD and export to working Flutter code

XD to Flutter Plugin Installation & Setup

In the Adobe XD menubar, go to Plugins > Discover Plugins, then search for and install the “Flutter” plugin. It will now show up in your plugins sidebar in the bottom left of XD.

If you haven’t already, install VS Code, and the Flutter / Dart extensions for it:

https://flutter.dev/docs/get-started/editor?tab=vscode

If you’ve never worked with Flutter before, it may be worth creating a starter app to gain some familiarity:

https://flutter.dev/docs/get-started/codelab

Hot Reload

Hot reload will alow you to see changes you make reflected on a device or simulator immediately each time you export from XD.

To enable it, open the settings for the Dart extension in VS Code, and turn on Preview Hot Reload On Save Watcher. This will automatically hot reload your Flutter app whenever an external application (such as Adobe XD) saves changes to a .dart file in your project.

Flutter Dependencies

Certain features have dependencies on custom widgets that are defined in the adobe_xd package on pubdev. In your Flutter project, add it as a dependency in your pubspec.yaml similar to:

// in pubspec.yaml
dependencies:
  adobe_xd: ^0.1.0

https://github.com/AdobeXD/xd-to-flutter-plugin

#flutter #adobe xd