【flutter】flutter如何让app内字体大小不随着系统改变而改变

如果我们不特意设置,flutter开发的app他的字体大小是会跟着系统设置的字体大小而改变,这样就会导致页面出现布局错乱问题,那么如何解决这个问题呢?我也搜索了相关资料,有两个常用也是网络上搜集到比较多的方法,还有一个是我自己使用的比较简单粗暴但是我认为方便快捷的方法。

先来看常用方法

方案一、自定义组件继承Text组件,在使用的时候直接使用FixedText来定义

javascript 复制代码
import 'package:flutter/material.dart';
import 'package:flutter_app2/View/FixedSizeText.dart';

class FixedText extends Text {
  const FixedText(String data, {
    Key key,
    TextStyle style,
    StrutStyle strutStyle,
    TextAlign textAlign,
    TextDirection textDirection,
    Locale locale,
    bool softWrap,
    TextOverflow overflow,
    double textScaleFactor = 1.0,
    int maxLines,
    String semanticsLabel,
  }) : super(data,
      key:key,
      style:style,
      strutStyle:strutStyle,
      textAlign:textAlign,
      textDirection:textDirection,
      locale:locale,
      softWrap:softWrap,
      overflow:overflow,
      textScaleFactor:textScaleFactor,
      maxLines:maxLines,
      semanticsLabel:semanticsLabel);
}

方案二、修改全局配置

在main函数中设置MediaQuery.of(context).copyWith(textScaleFactor: 1.0),就可以使得文本不随着系统改变

javascript 复制代码
//在main函数中,设置builder
MaterialApp(
    home:Home(),
    builder: (context, widget) {
	    return MediaQuery(
		   ///设置文字大小不随系统设置改变
		   data: MediaQuery.of(context).copyWith(textScaleFactor: 1.0),
		   child: widget,
		);
    },
),

方案三:直接修改Text组件

因为在发现这个问题的时候,代码已经比较庞大并且多处使用Text,挨个替换肯定是不合理的,因此我直接修改了Text的源代码,设置textScaleFactor默认值为1.0

因为我肯定是整体都不能让他随着系统改变而改变,所以直接干脆修改源代码,默认不能改变,简单、粗暴且有效。

相关推荐
传奇开心果编程5 小时前
【现代声明式UI学与练】第9课 性能优化——渲染优化、列表优化、内存优化、启动优化
学习·flutter·react native·ui·性能优化·swiftui·android jetpack
m0_738185827 小时前
Flutter 鸿蒙化实战:foundation_fluttify 适配 OpenHarmony,Fluttify 桥接层
flutter·华为·harmonyos·鸿蒙
m0_738185827 小时前
Flutter 鸿蒙化实战:http_proxy 适配 OpenHarmony,HTTP 代理
flutter·http·华为·harmonyos·鸿蒙
m0_738185827 小时前
Flutter 鸿蒙化实战:headset_connection_event 适配 OpenHarmony,耳机插拔监听
flutter·华为·harmonyos·鸿蒙
恋猫de小郭1 天前
Android CLI 支持 AI Agent 通过 Device Streaming 调试云真机
android·前端·flutter
m0_738185822 天前
Flutter 鸿蒙化实战:flutter_scankit 适配 OpenHarmony,华为 ScanKit 扫码
flutter·华为·harmonyos·鸿蒙
事圆则缓2 天前
Flutter 开发鸿蒙实战:从 OpenHarmony 适配版到 HAP 构建与插件接入
flutter·华为·harmonyos
天空之城--2 天前
Android一周动态:Android 18首次官宣、Compose Material3 1.4转正(5趋势+5资讯)
android·人工智能·flutter·架构·android jetpack
恋猫de小郭2 天前
Meta 分享怎么用 AI 迁移 Compose 项目不烧心
android·前端·flutter
EatFan2 天前
Flutter 鸿蒙适配实践 2026:从环境搭建、混合渲染到 OpenTelemetry 性能基建
flutter·华为·harmonyos·openharmony·opentelemetry·鸿蒙适配·impeller