Flutter使用flutter_screenutil时文字持续缩放问题的解决方法

问题现象 #

使用flutter_screenutil包的页面中，文本内容每秒都会出现缩放波动，尝试用LayoutBuilder包裹页面内容后仍未解决。

相关代码 #

Scaffold(
      key: globalKey,
      appBar: InfoAppbar(
        onTap: () => showLanguageModal(context),
        languageCode: _languageCode,
      ),
      body: LayoutBuilder(builder: (BuildContext context,BoxConstraints constraints) {
        return ValueListenableBuilder<int>(
          valueListenable: _pageIndex,
          builder: (BuildContext context, int value, Widget? child) {
            return Padding(
              padding: REdgeInsets.symmetric( horizontal:Dimens.pagePadding),
              child: Stack(
                children: [
                  Text(
                    'GoogleFonts.poppins',
                    style: GoogleFonts.poppins(
                      textStyle: TextStyle(
                        fontSize: 32.sp,
                        fontWeight: FontWeight.w600,
                        color: AppColors.textColor,
                      ),
                    ),
                  )
                ],
              ),
            );
          },
        )
          ;
      }),
    )

解决方案 #

排查后发现问题根源在于GoogleFonts的默认缩放行为，移除该行为即可解决文本持续缩放的问题。

具体调整方式：在GoogleFonts.poppins()方法中添加textScaler: TextScaler.noScaling参数，禁用字体缩放：

Text(
  'GoogleFonts.poppins',
  style: GoogleFonts.poppins(
    textScaler: TextScaler.noScaling, // 禁用GoogleFonts的缩放行为
    textStyle: TextStyle(
      fontSize: 32.sp,
      fontWeight: FontWeight.w600,
      color: AppColors.textColor,
    ),
  ),
)

也可以直接替换为静态字体配置，避免触发GoogleFonts内部的动态缩放逻辑。

内容的提问来源于stack exchange，提问作者Lala Naibova