flutter 3.10.1不管使用哪种方式都会反复重绘

[youtao531]

flutter 3.10.1不管使用哪种方式都会反复重绘 screenutil 5.8.2。 例如在页面上添加输入框，打开页面后就会跳转到启动页一直重绘。

[Guo8a]

是这样的，在 3.10 版本的 Flutter 中： 当设置 useInheritedMediaQuery: false，不会 rebuild 但 viewInsets.bottom 拿不到； 当设置 useInheritedMediaQuery: true，会一直 rebuild。

而且在 3.7 版本的 Flutter 中，设置 useInheritedMediaQuery: true也不会一直 rebuild。

求解决求解决求解决！！！

In Flutter version 3.10 it works like this: When useInheritedMediaQuery: false is set, the page will not rebuild, but viewInsets.bottom cannot be accessed; When useInheritedMediaQuery: true is set, the page will rebuild.

Moreover in Flutter version 3.7, setting useInheritedMediaQuery to true will also not rebuild the page.

Please help to resolve this issue!!!

[Guo8a]

因为这是一个很严重的问题。 我的产品用到了 Textfield 并且需要考虑性能，而且重复 rebuild 页面会造成奇奇怪怪的问题。所以现在我只能把 Flutter 降级到 3.7 版本，待问题解决后或者有新的解决方案我才能再继续使用。 同样我希望使用 3.10 版本的 Flutter，我会调研一下其他屏幕适配库是否也有类似问题。最坏的打算，我会将 flutter_screenutil 替代成其他的。 希望作者们能尽快解决这个问题。此致！

As this is a serious issue. My product uses TextField and performance needs to be considered. Additionally, repetitive page rebuilds can cause various issues. Therefore, I am forced to downgrade to version 3.7 of Flutter until this issue is resolved or an alternative solution is available.

In addition, I am hoping to use version 3.10 of Flutter and will investigate whether other screen adaptation libraries have similar issues. As a last resort, I may consider replacing flutter_screenutil with another library.

I hope that the developers can resolve this issue as soon as possible. Best regards!

[edwinmrb]

With flutter 3.10.1 I have the same problem, is there a solution? Please help to resolve this issue!!!

[wownsdl13]

exactly same issue as me now

[otopba]

I have the same problem. The phone heats up a lot because of the frequent redraws

[adham-ashraf77]

Same problem here, is there a solution?

[naivetoby]

Same problem here, is there a solution?

[SpeedReach]

Same problem here

[shreejeetp]

Same issue here

[feriyalsusanto]

If you update flutter & screenutil to the latest version, you need to check all the stateless widget that have TextEditingController & GlobalKey<FormState> to make it static or change stateless to stateful widget and change your variable to late final and initiate the varibale in initState function. You can refer to this discussion : discussion 1 discussion 2

In my issue, the keyboard immediately close after tap the text field and the pages are rebuild everytime the user typing using keyboard. Hope this help.

[naivetoby]

因为这是一个很严重的问题。 我的产品用到了 Textfield 并且需要考虑性能，而且重复 rebuild 页面会造成奇奇怪怪的问题。所以现在我只能把 Flutter 降级到 3.7 版本，待问题解决后或者有新的解决方案我才能再继续使用。 同样我希望使用 3.10 版本的 Flutter，我会调研一下其他屏幕适配库是否也有类似问题。最坏的打算，我会将 flutter_screenutil 替代成其他的。 希望作者们能尽快解决这个问题。此致！

As this is a serious issue. My product uses TextField and performance needs to be considered. Additionally, repetitive page rebuilds can cause various issues. Therefore, I am forced to downgrade to version 3.7 of Flutter until this issue is resolved or an alternative solution is available.

In addition, I am hoping to use version 3.10 of Flutter and will investigate whether other screen adaptation libraries have similar issues. As a last resort, I may consider replacing flutter_screenutil with another library.

I hope that the developers can resolve this issue as soon as possible. Best regards!

最新的版本 5.8.3 在我的项目中已经解决了这个问题。

记得几个要点：

1. 没有必要不要使用 MediaQuery.of
2. 没有必要不要设置 Scaffold's resizeToAvoidBottomInset 为 true
3. CupertinoPageRoute 中的所有页面在键盘动画时默认就会 rebuild 的，但是 const 关键字可以避免 rebuild。
4. useInheritedMediaQuery 设置为 false，以后这个参数可以跟 Flutter 官方一样直接被去掉。

[shreejeetp]

The whole app is still rebuilding on 5.8.3. Opening keyboard by tapping on a text field first closes the keyboard and lands me to home page.

[Guo8a]

因为这是一个很严重的问题。 我的产品用到了 Textfield 并且需要考虑性能，而且重复 rebuild 页面会造成奇奇怪怪的问题。所以现在我只能把 Flutter 降级到 3.7 版本，待问题解决后或者有新的解决方案我才能再继续使用。 同样我希望使用 3.10 版本的 Flutter，我会调研一下其他屏幕适配库是否也有类似问题。最坏的打算，我会将 flutter_screenutil 替代成其他的。 希望作者们能尽快解决这个问题。此致！ As this is a serious issue. My product uses TextField and performance needs to be considered. Additionally, repetitive page rebuilds can cause various issues. Therefore, I am forced to downgrade to version 3.7 of Flutter until this issue is resolved or an alternative solution is available. In addition, I am hoping to use version 3.10 of Flutter and will investigate whether other screen adaptation libraries have similar issues. As a last resort, I may consider replacing flutter_screenutil with another library. I hope that the developers can resolve this issue as soon as possible. Best regards!

最新的版本 5.8.3 在我的项目中已经解决了这个问题。

记得几个要点：

1. 没有必要不要使用 MediaQuery.of
2. 没有必要不要设置 Scaffold's resizeToAvoidBottomInset 为 true
3. CupertinoPageRoute 中的所有页面在键盘动画时默认就会 rebuild 的，但是 const 关键字可以避免 rebuild。
4. useInheritedMediaQuery 设置为 false，以后这个参数可以跟 Flutter 官方一样直接被去掉。

我写了一个 demo，加了一个断点。在每次 iOS 端从前台把 App 退到后台的时候，断点都会走两遍。 这应该是又 rebuild 了。请问该怎么解决？谢谢 @naivetoby

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return ScreenUtilInit(
      designSize: const Size(375, 667),
      minTextAdapt: true,
      builder: (context, child) {
        // add a breakpoint here
        return const MaterialApp(
          debugShowCheckedModeBanner: false,
          home: HomePage(),
        );
      },
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(),
    );
  }
}

[youtao531]

5.8.2 5.8.3 使用ScreenUtilInit方式不会有问题，使用另一种方式回跳到启动页一直重绘。只能改成ScreenUtilInit方式使用了。

[naivetoby]

因为这是一个很严重的问题。 我的产品用到了 Textfield 并且需要考虑性能，而且重复 rebuild 页面会造成奇奇怪怪的问题。所以现在我只能把 Flutter 降级到 3.7 版本，待问题解决后或者有新的解决方案我才能再继续使用。 同样我希望使用 3.10 版本的 Flutter，我会调研一下其他屏幕适配库是否也有类似问题。最坏的打算，我会将 flutter_screenutil 替代成其他的。 希望作者们能尽快解决这个问题。此致！ As this is a serious issue. My product uses TextField and performance needs to be considered. Additionally, repetitive page rebuilds can cause various issues. Therefore, I am forced to downgrade to version 3.7 of Flutter until this issue is resolved or an alternative solution is available. In addition, I am hoping to use version 3.10 of Flutter and will investigate whether other screen adaptation libraries have similar issues. As a last resort, I may consider replacing flutter_screenutil with another library. I hope that the developers can resolve this issue as soon as possible. Best regards!

最新的版本 5.8.3 在我的项目中已经解决了这个问题。 记得几个要点：

1. 没有必要不要使用 MediaQuery.of
2. 没有必要不要设置 Scaffold's resizeToAvoidBottomInset 为 true
3. CupertinoPageRoute 中的所有页面在键盘动画时默认就会 rebuild 的，但是 const 关键字可以避免 rebuild。
4. useInheritedMediaQuery 设置为 false，以后这个参数可以跟 Flutter 官方一样直接被去掉。

我写了一个 demo，加了一个断点。在每次 iOS 端从前台把 App 退到后台的时候，断点都会走两遍。 这应该是又 rebuild 了。请问该怎么解决？谢谢 @naivetoby

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return ScreenUtilInit(
      designSize: const Size(375, 667),
      minTextAdapt: true,
      builder: (context, child) {
        // add a breakpoint here
        return const MaterialApp(
          debugShowCheckedModeBanner: false,
          home: HomePage(),
        );
      },
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(),
    );
  }
}

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return ScreenUtilInit(
      useInheritedMediaQuery: false,
      designSize: const Size(375, 667),
      minTextAdapt: true,
      builder: (context, child) {
        // add a breakpoint here
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          home: const HomePage(),
        );
      },
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    print('build HomePage');
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Container(),
    );
  }
}

[Guo8a]

因为这是一个很严重的问题。 我的产品用到了 Textfield 并且需要考虑性能，而且重复 rebuild 页面会造成奇奇怪怪的问题。所以现在我只能把 Flutter 降级到 3.7 版本，待问题解决后或者有新的解决方案我才能再继续使用。 同样我希望使用 3.10 版本的 Flutter，我会调研一下其他屏幕适配库是否也有类似问题。最坏的打算，我会将 flutter_screenutil 替代成其他的。 希望作者们能尽快解决这个问题。此致！ As this is a serious issue. My product uses TextField and performance needs to be considered. Additionally, repetitive page rebuilds can cause various issues. Therefore, I am forced to downgrade to version 3.7 of Flutter until this issue is resolved or an alternative solution is available. In addition, I am hoping to use version 3.10 of Flutter and will investigate whether other screen adaptation libraries have similar issues. As a last resort, I may consider replacing flutter_screenutil with another library. I hope that the developers can resolve this issue as soon as possible. Best regards!

最新的版本 5.8.3 在我的项目中已经解决了这个问题。 记得几个要点：

1. 没有必要不要使用 MediaQuery.of
2. 没有必要不要设置 Scaffold's resizeToAvoidBottomInset 为 true
3. CupertinoPageRoute 中的所有页面在键盘动画时默认就会 rebuild 的，但是 const 关键字可以避免 rebuild。
4. useInheritedMediaQuery 设置为 false，以后这个参数可以跟 Flutter 官方一样直接被去掉。

我写了一个 demo，加了一个断点。在每次 iOS 端从前台把 App 退到后台的时候，断点都会走两遍。 这应该是又 rebuild 了。请问该怎么解决？谢谢 @naivetoby

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return ScreenUtilInit(
      designSize: const Size(375, 667),
      minTextAdapt: true,
      builder: (context, child) {
        // add a breakpoint here
        return const MaterialApp(
          debugShowCheckedModeBanner: false,
          home: HomePage(),
        );
      },
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(),
    );
  }
}

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

void main() {
  runApp(const MyApp());
}

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

  @override
  Widget build(BuildContext context) {
    return ScreenUtilInit(
      useInheritedMediaQuery: false,
      designSize: const Size(375, 667),
      minTextAdapt: true,
      builder: (context, child) {
        // add a breakpoint here
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          home: const HomePage(),
        );
      },
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    print('build HomePage');
    return Scaffold(
      resizeToAvoidBottomInset: false,
      body: Container(),
    );
  }
}

好吧，谢谢。其实我的 demo 也是没问题的，因为 5.8.3 版本的 useInheritedMediaQuery 默认值为 false。确实 HomePage 不会重新 build 了。感谢您的贡献。

[ChinaeduO]

I don't know why everybody is partying here. But the issue still exists. I am using Flutter 3.10.3 and flutter_screenutil version 5.8.4. When tapping on a TextFormField, the keyboard opens and instantly closes, cause of rebuilding.

What is the issue about it? Please fix that. When using Flutter 3.7.7 there is no problem with that.

PS: It has to do smth with this plugin, cause removing it or just not using the ScreenUtilInit Widget makes no issue. I made up a dummy route with a simple TextField. And without the use of the plugin, the behavior is just normal.

[lizhuoyuan]

I don't know why everybody is partying here. But the issue still exists. I am using Flutter 3.10.3 and flutter_screenutil version 5.8.4. When tapping on a TextFormField, the keyboard opens and instantly closes, cause of rebuilding.

What is the issue about it? Please fix that. When using Flutter 3.7.7 there is no problem with that.

PS: It has to do smth with this plugin, cause removing it or just not using the ScreenUtilInit Widget makes no issue. I made up a dummy route with a simple TextField. And without the use of the plugin, the behavior is just normal.

Do you mean that when you click the textfield, the keyboard will pop up and close? Can you provide a small demo?

[ChinaeduO]

I don't know why everybody is partying here. But the issue still exists. I am using Flutter 3.10.3 and flutter_screenutil version 5.8.4. When tapping on a TextFormField, the keyboard opens and instantly closes, cause of rebuilding. What is the issue about it? Please fix that. When using Flutter 3.7.7 there is no problem with that. PS: It has to do smth with this plugin, cause removing it or just not using the ScreenUtilInit Widget makes no issue. I made up a dummy route with a simple TextField. And without the use of the plugin, the behavior is just normal.

Do you mean that when you click the textfield, the keyboard will pop up and close? Can you provide a small demo?

Exactly, clicking on a text field anywhere in the app will cause the keyboard to instantly close and I am back on the initial route of the app. This is my build methodfrom my app.dart:

@override
  Widget build(BuildContext context) {
    return MultiBlocProvider(
        providers: [
          BlocProvider<LocaleBloc>(create: (_) => LocaleBloc()),
        ],
        child: BlocBuilder<LocaleBloc, LocaleState>(
          builder: (BuildContext context, LocaleState state) {
            return ScreenUtilInit(
              minTextAdapt: false,
              useInheritedMediaQuery: false,
              builder: (BuildContext context, Widget? child) {
                return MaterialApp.router(
                    title: '...',
                    routerConfig: KiGoRouter(context: context).router,
                    debugShowCheckedModeBanner: false,
                    theme: state.locale.languageCode == 'de'
                        ? KIGoTheme.lightThemeDE
                        : KIGoTheme.lightTheme,
                    locale: state.locale,
                    localizationsDelegates: const [
                      AppLocalizations.delegate,
                      GlobalMaterialLocalizations.delegate,
                      GlobalWidgetsLocalizations.delegate,
                      GlobalCupertinoLocalizations.delegate,
                    ],
                    supportedLocales: L10n.all);
              },
            );
          },
        ));
  }

[ChinaeduO]

I made up an example repository showing up the bug. On investigation, it seems to me like it is occurring when using the go_router package.

https://github.com/ChinaeduO/screenutil_bug

Please check it out it tell me what you think.

[Mounir-Bouaiche]

@ChinaeduO , I've seen your code. Avoid using functions inside any builder method. That will cause them to be executed anytime a dependency changed, in this case ScreenUtilInit builder deps: padding, viewInsets. This is how you should use it:

    return ScreenUtilInit(
      builder: (_, child) => child!,
      child: MaterialApp.router(
        title: 'Flutter Demo',
        routerConfig: GoRouter(
          initialLocation: '/',
          routes: [
            GoRoute(
              path: '/',
              builder: (context, state) => const MyHomePage(
                title: 'Flutter Demo Home Page',
              ),
            ),
          ],
        ),
      ),
    );

Or also, if you want to use ScreenUtil in MaterialApp.router properties:

    final router = GoRouter(
      initialLocation: '/',
      routes: [
        GoRoute(
          path: '/',
          builder: (context, state) => const MyHomePage(
            title: 'Flutter Demo Home Page',
          ),
        ),
      ],
    );

    return ScreenUtilInit(
      builder: (_, __) => MaterialApp.router(
        title: 'Flutter Demo',
        routerConfig: router,
        // property that will use ScreenUtil
        theme: ...
      ),
    );

[Tankerx]

@ChinaeduO I have the same problem as you, which is caused by changing the position of the key definition in the form