[flutter] figma2flutter 이용해보기

figma에서 flutter 코드로 자동으로 바꿔주는 플러그인이 있다고 해서 사용해봤다.

 

 

1. 바꾸고자 하는 프레임 선택 

 

 

2. Actions 탭 > Plugin > Figma2Flutter 클릭 

 

 

3. Screen, Popup, Menu 중에서 선택한다. 

 

4. 잠시 대기하면 

 

 

5. 아래처럼 코드가 생성된다. 

 

main.dart

import 'package:flutter/material.dart';
        import 'package:_3652277877_f2f/figma_to_flutter.dart' as f2f;
        
void main() {

    runApp(
        f2f.getApp(
            withInit: (){

                print('Figma to Flutter initialized!');
                f2f.subscribeToEvent('pageLoaded', (e) async {

                    String pageName = e.payload;
                    print('$pageName loaded');

                });

            }
        )
    );

}

 

 

6. 일부분 발췌해서 쓸 수 있는 코드가 아니라 프로젝트를 내려주는데, 

받아서 실행해보니 실행도 안된다. 

다른 방법을 찾아야 한다. 

▶ https://ddoance.tistory.com/313

[flutter] figma to code 이용해보기

 

 

 

 

Figma2flutter - Dart API docs

Figma2flutter - Dart API docs

f2f.bostonux.com/tutorial

X의 Boston UX님(@BostonUX_)