How to adapt figma sizes to in flutter app?

General Discussion
1

I have design Figma, I need to apply this in my flutter app. but I have certain difficulties, so in order.

The first thing I tried was to use auto import tools, I tried:

  • Adobe XD to Flutter
  • Supernova Studio

Unfortunately these tools are still at the beginning of their journey. they provide some benefit, but do not give full imports

Also I use several plugins for Figma:

  • Figma to flutter
  • Figma to code

but the capabilities of these plugins are also limited. I realized that I need to do it myself.

Figma page dimensions are 320 px. Device screen sizes will vary. but I need it to look as close as possible. I decided to use the “proportional approach”. I am using the dimensions of the figma elements with the following extension:

   ```

double w() {
//current device width
double screenWidth = SizeConfig.screenWidth;
var res = (this / 320.0) * screenWidth;
return res;
}
```

I use it like:

 ```
    Container(  width: 80.w(), );        

 ```

but the result does not satisfy me. maybe “proportional method” is wrong.

The main question is how do I adapt the dimensions(sizes) of the figma to the sizes of different devices?

any advice - I would be very grateful.