[Flutter] Flutter_ScreenUtil is not working when I go from web to mobile

I am trying to use the package Flutter_ScreenUtil 5.9.3. I develop on a Windows 11 machine and I have been debugging on Chrome. When I go to mobile, the size of everything seems to be very wrong.

In the main.dart I have this code:

@override
Widget build(BuildContext context) {
return ScreenUtilInit(
designSize: const Size(360, 690),
child: MaterialApp(
debugShowCheckedModeBanner: false,
home: const LoginScreen(),
navigatorKey: rootNavigatorKey,

),
);
}


At first, I only made changes in the different screens where I had different font sizes like this:

style: TextStyle(
fontSize: 12.sp,
fontWeight: FontWeight.bold,
),


However, I was looking up some information on the internet and thought it said to wrap all of the screen build widgets in ScreenUtilInit. I have done this but there is no change like here:

@override
Widget build(BuildContext context) {

return ScreenUtilInit(
child: Scaffold(


What am I doing wrong? I need to get the screens to look the same on mobile and web. Thanks

Continue reading...