The application works badly when you compile it

[Cristian Arias Mejuto]

I was talking to the flutter developers in this thread since the problem happened in the compilation phase and not in the development phase, I took their problem for granted, but thanks to the comments of another user we managed to find the fault in the resposive_sizer package and in the other called sizer, there You can see details of the user who commented on it and how he fixes the problem, maybe this can help you to deduce where the problem is in your package.
Anyway, it is clear that the problem is here, this is not critical, I like your package and if you remind me, I already tried to help you previously here, I will only mention it so that you can try to fix it.

Anyway tell you that I simply generate this class based on your package that worked well for me and in this way I only use the mediaquery but in an easier way.

sizer.dart

import 'package:flutter/widgets.dart';

/// Gets the screen type between mobile and tablet.
enum ScreenType { mobile, tablet }


class Sizer {
  static double h(BuildContext context) {
    return MediaQuery.of(context).size.height;
  }

  static double w(BuildContext context) {
    return MediaQuery.of(context).size.width;
  }

  static Orientation orientation(BuildContext context) {
    return (h(context) > w(context))
        ? Orientation.portrait
        : Orientation.landscape;
  }

  static bool isPortrait(BuildContext context) {
    return (orientation(context) == Orientation.portrait) ? true : false;
  }

  static bool isLandscape(BuildContext context) {
    return (orientation(context) == Orientation.portrait) ? false : true;
  }

  static ScreenType screenType(BuildContext context) {
    return ((orientation(context) == Orientation.portrait &&
                w(context) < 600) ||
            (orientation(context) == Orientation.landscape && h(context) < 600))
        ? ScreenType.mobile
        : ScreenType.tablet;
  }

  static bool isMobile(BuildContext context) {
    return (screenType(context) == ScreenType.mobile) ? true : false;
  }

  static bool isTablet(BuildContext context) {
    return (screenType(context) == ScreenType.mobile) ? false : true;
  }
}

extension SizerExt on num {
  /// Calculates the height depending on the device's screen size
  /// Eg: 20.h -> will take 20% of the screen's height
  double h(BuildContext context) {
    return MediaQuery.of(context).size.height * (this / 100);
  }

  /// Calculates the width depending on the device's screen size
  /// Eg: 20.h -> will take 20% of the screen's width
  double w(BuildContext context) {
    return MediaQuery.of(context).size.width * (this / 100);
  }

  /// Calculates the sp (Scalable Pixel) depending on the device's screen size
  double sp(BuildContext context) {
    return this *
        ((((MediaQuery.of(context).size.height +
                        MediaQuery.of(context).size.width) +
                    (MediaQuery.of(context).devicePixelRatio *
                        MediaQuery.of(context).size.aspectRatio)) /
                3) /
            3) /
        100;
  }
}

I divided by 3 the .sp method because I get all the data from the device using mediaquery.

[Cristian Arias Mejuto]

Hello @CoderUni regarding the aforementioned problem, I was testing locally by copying the entire package in my project to be able to make the changes and here where you have this property of the Device class set:

static double get aspectRatio {
    return WidgetsBinding.instance?.window.physicalSize.aspectRatio ?? 1;
  }

Here is the problem, it also fails with pixelRatio, I don't know what it could be, but it fails because I put it like this just to do the test:

static double get aspectRatio {
    return 1;
  }

And this worked perfectly.

So, looking for alternatives, I found for the aspectRatio this:
aspectRatio = boxConstraints.constrainDimensions(width, height).aspectRatio;

But for the pixel ratio I couldn't find anything, but my code was like this inside the Device class:

class Device {
  /// Device's BoxConstraints
  static late BoxConstraints boxConstraints;

  /// Device's Orientation
  static late Orientation orientation;

  /// Type of Device
  static late DeviceType deviceType;

  /// Type of Screen
  static late ScreenType screenType;

  /// Device's Height
  static late double height;

  /// Device's Width
  static late double width;

  /// Device's Aspect Ratio
  static late double aspectRatio;

  /// Devices' Pixel Ratio
  static late double pixelRatio;

  /// Sets the Screen's size and Device's `Orientation`,
  /// `BoxConstraints`, `Height`, and `Width`
  static void setScreenSize(
      BoxConstraints constraints, Orientation currentOrientation) {
    // Sets boxconstraints and orientation
    boxConstraints = constraints;
    orientation = currentOrientation;

    // Sets screen width and height
    width = boxConstraints.maxWidth;
    height = boxConstraints.maxHeight;

    aspectRatio = boxConstraints.constrainDimensions(width, height).aspectRatio;
    pixelRatio = 1;

    // Sets DeviceType
    if (kIsWeb) {
      deviceType = DeviceType.web;
    } else {
      switch (defaultTargetPlatform) {
        case TargetPlatform.android:
          deviceType = DeviceType.android;
          break;
        case TargetPlatform.iOS:
          deviceType = DeviceType.ios;
          break;
        case TargetPlatform.windows:
          deviceType = DeviceType.windows;
          break;
        case TargetPlatform.macOS:
          deviceType = DeviceType.mac;
          break;
        case TargetPlatform.linux:
          deviceType = DeviceType.linux;
          break;
        case TargetPlatform.fuchsia:
          deviceType = DeviceType.fuschia;
          break;
      }
    }

    // Sets ScreenType
    if ((orientation == Orientation.portrait && width < 600) ||
        (orientation == Orientation.landscape && height < 600)) {
      screenType = ScreenType.mobile;
    } else {
      screenType = ScreenType.tablet;
    }
  }
}

Although it seems that it does not work well in this way either since sometimes it loads it well and others not I hope this can help you more to understand how you can fix the problem, anyway I told the flutter developers in the thread mentioned in the first comment for them to check as well since that problem comes with WidgetsBinding and that is something that have flutter and not your package.

[CoderUni]

Thanks for filing the issue. I'll take a look at it and will ping you once the issue is fixed.

[samerjallad]

Guys I had the same experience with sizer 2.0.15 package, the main screen was not working till i refresh the apps, close all apps in the background & sometimes optimize my phone...but I did a silly experiment based on my observation (Note: I am still a beginner in coding world) that when we add a const modifier to a container or a font size while using this package it will give a direct error... so I removed the const modifier from my return MaterialApp in main.dart & then I made another release bundle & test it... I found my App is working with No issues ... my code now looks like
return Sizer( builder: (context, orientation, deviceType) { return MaterialApp( home: MainScreenPage(), ); }, );

[Cristian Arias Mejuto]

Hi @samerjallad,
this you have said sounds very interesting, it is strange but, due to the behavior received, we can think that the class that uses the sizer package if it receives all the values it needs but, when it tries to load them, it cannot because as it is constant it cannot change in time of execution.
It is the only explanation I can think of (Note: I am also quite a beginner).

I will use it like this, it would still be nice to be able to fix it in some way and not have to worry about whether it is constant or not, but without a doubt this is a solution.

Thanks friend.

[CoderUni]

Hi @hekhy, I added some changes and it seems to be fixed on my end. Did it fix the issue in your end? (The new changes are in another branch) Thanks.

[Cristian Arias Mejuto]

Hello @CoderUni , sorry for the delay because lately I have not been able to dedicate time to this because of my other job but today I started to review and I simply speak to you today so that you do not close the thread yet so I can do the test and tell you if it is solved. Anyway thanks for being so quick to make the changes.
I enter today and tomorrow I will confirm if it works correctly for me.

[Cristian Arias Mejuto]

Hello again @CoderUni
I have been testing the package today, first I tried it with my application, the first one for which I created the thread, but it has continued to malfunction. Then I thought that maybe it was because of how I have my project set up, maybe my way of working is not good, but I decided to try the flutter counter test project and the same thing happened.
I must also say that I have tested the version that is on the pub.dev page, version 3.0.4 + 4 and I also tried directly downloading the code from the issue11fix branch and putting it locally but none worked in any of the projects . I don't know what the problem could be, but at the moment I'm still working with the mediaquery with an extension that it creates for me.

Here I leave you a link to my test project that I always use for these things, in which you will see that there is the application that told you about the flutter counter that is generated when creating a project, as the test with the latest version that you have put said in pub.dev and putting the files in the issue11fix branch but none of them worked. If you generate an apk as it is now, when you open the already installed application you will see a gray screen, and if you create an apk but using the package in the pub.dev version you will see that all elements where I have put a size with the .sp method They are not seen, you can try you simply have to uncomment the import line and comment the other one that uses the issue11fix branch locally.
I hope all this can help you find the problem or at least have a proof of the error.
Maybe it's something with my computer, I don't know if it only happens to me, but anyway, thanks for being so quick in trying to fix the errors.
As I always said, it is a very good package, what a pity that now it does not work well for me.
A hug friend!

[Lorenzobettega]

@CoderUni will you publish the fixes to the pub package?

[Anonymous Dev]

@CoderUni we are also waiting for the fix. Do you have a ETA?

[CoderUni]

Sorry for the late reply @hekhy @Lorenzobettega and @michael-ottink . I tested the commits in the other branch again and it seems to work. The only caveat is that the child of MaterialApp should be wrapped by ResponsiveSizerinstead of wrapping MaterialApp with ResponsiveSizer in the previous versions. It should look something like this now:

return MaterialApp(
   home: ResponsiveSizer(
     builder: (context, orientation, screenType) {
       return const HomePage();
     },
  ),
 );

I've updated the packaged to version ^3.0.5 which included the recent changes :)

[Cristian Arias Mejuto]

Perdón por la respuesta tardía @hekhy @Lorenzobettega y @ michael-ottink . Probé las confirmaciones en la otra rama nuevamente y parece funcionar. La única salvedad es que el elemento secundario de MaterialAppdebe estar envuelto por en ResponsiveSizerlugar de envuelto MaterialAppcon ResponsiveSizeren las versiones anteriores. Debería verse algo como esto ahora:

return MaterialApp(
   home: ResponsiveSizer(
     builder: (context, orientation, screenType) {
       return const HomePage();
     },
  ),
 );

Actualicé el paquete a la versión ^ 3.0.5 que incluía los cambios recientes :)

Thanks @CoderUni that is a key fact since before it was the opposite. I'll try it as soon as I can.