OpenFlutter / flutter_screenutil

Flutter screen adaptation, font adaptation, get screen information
https://pub.dartlang.org/packages/flutter_screenutil
Apache License 2.0
3.87k stars 493 forks source link

Calling `ScreenUtil.init` inside build method will not await the returned future #470

Closed Haidar0096 closed 1 year ago

Haidar0096 commented 1 year ago

If I understand correctly, if I have a figma design with, say, 2 different screen dimensions, screen1 and screen2, then to map it to flutter, I need to call

ScreenUtil.init(context,designSize: const Size(...figma's screen1 size),); // called in `build` method in screen1 in flutter code

and

ScreenUtil.init(context,designSize: const Size(...figma's screen2 size),); // called in `build` method in screen2 in flutter code

Now there are two questions: 1- build method cannot await for Futures, and this method ScreenUtil.init returns a Future, so is this intended or a bug? If a function returns a future then I expect to await it if my code that follows it depends on its result, which is the case here.

2- Is this the correct way to support different design sizes in figma?

To give you an example about point 2, this is a sample of what I want to achieve (suppose Widget1 represents a figma screen1 and Widget2 represents figma screen2):

class LoginScreen extends StatelessWidget {
  static const String routeName = 'login_screen';

  const LoginScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
        Widget1(),
        Widget2(),
        ],
      ),
    );
  }
}

class Widget1 extends StatelessWidget {
  const Widget1({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(
      context,
      designSize: const Size(400, 300),
    );
    return Align(
      alignment: Alignment.center,
      child: Text(
        'text1',
        textAlign: TextAlign.center,
        style: TextStyle(
          fontSize: 38.79.sp,
          fontFamily: fonts.dINAlternateBold,
        ),
      ),
    );
  }
}

class Widget2 extends StatefulWidget {
  const Widget2({Key? key}) : super(key: key);

  @override
  State<Widget2> createState() => _Widget2State();
}

class _Widget2State extends State<Widget2> {
  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(
      context,
      designSize: const Size(900, 600),
    );
    return Align(
      alignment: Alignment.center.add(const Alignment(0, 0.2)),
      child: Text(
        'text2',
        textAlign: TextAlign.center,
        style: TextStyle(
          fontSize: 41.51.sp,
          fontFamily: fonts.santanaBlack,
        ),
      ),
    );
  }
}
lizhuoyuan commented 1 year ago

I checked again, there is no await in this method. try future.then plz.

When designing, we did not consider that the same application will have different design ratios, so every time init is called, the ratio of this application will be changed to the latest, so every time you enter the page and call init, it will change the screen size Suitable size

haidarmehsen commented 1 year ago

@lizhuoyuan maybe there is a misunderstanding.

First, thanks for this package it is a life saver.

What I mean is that ScreenUtil.init method, that we should call inside build method to update the library's parameters, returns a Future, and inside build we can't await this Future. This is not a good pattern in flutter, as Futures should be awaited, and if you don't need an async method, then why declare it to return a Future?

Here is the ScreenUtil function from your package:

  /// Initializing the library.
  static Future<void> init(
    BuildContext context, {
    Size designSize = defaultSize,
    bool splitScreenMode = false,
    bool minTextAdapt = false,
    bool scaleByHeight = false
  }) 
{
...
}

You can see it returns a future.

The package works perectly fine for now, but if you can remove the Future if it is not needed and replace it with void, this would be better

Mounir-Bouaiche commented 1 year ago

@Haidar0096 @haidarmehsen , it can be used as future for FutureBuilder. Next release will clarify the usage.

github-actions[bot] commented 1 year ago

This issue is stale because it has been open for 30 days with no activity.