Figma2Flutter package holds code and image assets generated by the Figma2Flutter Figma plugin.

This package also contains Figma2Flutter SDK Library with functions and classes used to interface with the generated Flutter widgets.

Features

• UI generated from Flutter document for entire Flutter app or
• UI libarary to be included in existing projects
• Access generated widgets by their Flutter instance name
• Listen to Flutter events on generated widgets
• Fill generated ListViews or GridViews with items

Getting started

1. Install Figma2Flutter Figma plugin
2. Annotate your Figma project for export
3. Export and download Flutter project or include this package into existing project

Usage

import 'package:my_generated_package_f2f/figma2flutter.dart' as f2f;

// ...



void main() {

    runApp(
        f2f.getApp(
            withInit: (){
                f2f.subscribeToEvent('pageLoaded', (e) async {

                    var pageName = e.payload;

                    /*
                    Setting custom text on Figma TEXT node named "node_name_from_figma".
                    - node with such name should exist in the page
                    - node should be of TEXT type in Figma
                    */
                    f2f.setComponentText('node_name_from_figma', 'Page ${pageName} loaded.'); 

                });
            }
        )
    );
}

Additional information

This package is part of the generated code by Figma2Flutter plugin. More information can be found on Figma2Flutter Website