flutter 文本不随系统设置而改变大小[最全的整理]

文本不随系统设置而改变大小[三]

  • 前言
      • 方案十三:使用Flexible
      • 方案十四:使用MediaQueryData的textScaleFactor属性
      • 方案十五:使用FractionallySizedBox
      • 方案十六:使用自定义文本样式
      • 方案十七:使用自定义绘制(CustomPainter)
      • 方案十八:使用RichText和TextSpan结合MediaQuery
  • 总结


前言

在flutter 越来越来的平台适配中,最常见的一直场景就是,修改了设备的字体大小或者样式,从而导致整个APP 的适配变形等情况的出现,对于这种问题的解决方案,当然就是限制字体了,但是如果一概而论的话,又不太适合,毕竟产品可不管你方不方便的,这里我整理了绝大部分的场景使用方案请添加图片描述


方案十三:使用Flexible

通过使用Flexible小部件,你可以将文本放置在Flexible容器中,以确保文本不随系统字体大小变化而缩放。

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: MyHomePage(),);}
}class MyHomePage extends StatelessWidget {Widget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Non-Scaling Text'),),body: Center(child: Row(mainAxisAlignment: MainAxisAlignment.center,children: [Flexible(child: Text('This text will not scale with system font size',style: TextStyle(fontSize: 16.0, // 设置一个基础的字体大小),),),],),),);}
}

在这个例子中,我们将文本包装在Flexible小部件中,这样它就可以根据屏幕大小自动调整大小。通过这种方式,文本不会随系统字体大小变化而缩放。

方案十四:使用MediaQueryData的textScaleFactor属性

通过直接使用MediaQueryDatatextScaleFactor属性,你可以动态调整文本的大小,以确保其不受系统字体大小变化的影响。

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: MyHomePage(),);}
}class MyHomePage extends StatelessWidget {Widget build(BuildContext context) {double textScaleFactor = MediaQuery.of(context).textScaleFactor;return Scaffold(appBar: AppBar(title: Text('Non-Scaling Text'),),body: Center(child: Text('This text will not scale with system font size',style: TextStyle(fontSize: 16.0 / textScaleFactor, // 根据textScaleFactor调整文本大小),),),);}
}

在这个例子中,我们直接使用MediaQuery获取了textScaleFactor,并将其应用于文本样式中。这样,文本将动态调整大小,以确保不受系统字体大小变化的影响。

这些方案提供了多样的选择,你可以根据应用的具体需求选择最合适的方式,或者根据情况结合使用不同的方案。希望这些方案对你有帮助,如果有其他问题或需要更多帮助,请随时提问。

方案十五:使用FractionallySizedBox

FractionallySizedBox可以根据父容器的百分比来设置子部件的大小。通过结合使用FractionallySizedBoxText,你可以根据需要设置文本的大小,并确保不受系统字体大小的影响。

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: MyHomePage(),);}
}class MyHomePage extends StatelessWidget {Widget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Non-Scaling Text'),),body: Center(child: FractionallySizedBox(widthFactor: 0.8, // 根据需要调整百分比child: Text('This text will not scale with system font size',style: TextStyle(fontSize: 16.0, // 设置一个基础的字体大小),),),),);}
}

在这个例子中,FractionallySizedBoxwidthFactor属性设置为0.8,你可以根据需要调整这个百分比。这样,文本的大小将相对于父容器的大小,而不受系统字体大小的影响。

方案十六:使用自定义文本样式

通过自定义文本样式,你可以直接设置字体大小,确保文本不受系统字体大小的影响。

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: MyHomePage(),);}
}class MyHomePage extends StatelessWidget {Widget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Non-Scaling Text'),),body: Center(child: Text('This text will not scale with system font size',style: TextStyle(fontSize: 16.0, // 设置一个基础的字体大小),),),);}
}

在这个例子中,直接在TextStyle中设置了字体大小,确保文本的大小不受系统字体大小变化的影响。

方案十七:使用自定义绘制(CustomPainter)

通过自定义绘制文本,你可以完全控制文本的大小,而不受系统字体大小变化的影响。这可以通过使用CustomPainter实现。

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: MyHomePage(),);}
}class MyHomePage extends StatelessWidget {Widget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text('Non-Scaling Text'),),body: Center(child: CustomPaint(painter: NonScalingTextPainter(),),),);}
}class NonScalingTextPainter extends CustomPainter {void paint(Canvas canvas, Size size) {final text = 'This text will not scale with system font size';final textStyle = TextStyle(fontSize: 16.0, // 设置一个基础的字体大小);final textSpan = TextSpan(text: text,style: textStyle,);final textPainter = TextPainter(text: textSpan,textDirection: TextDirection.ltr,);textPainter.layout(minWidth: 0, maxWidth: size.width);textPainter.paint(canvas, Offset(0, (size.height - textPainter.height) / 2));}bool shouldRepaint(CustomPainter oldDelegate) {return false;}
}

在这个例子中,我们创建了一个NonScalingTextPainter类,实现了CustomPainter接口。在paint方法中,我们手动创建了TextPainter,并使用TextSpanTextStyle定义文本样式。通过手动控制文本的大小和位置,我们确保了文本不受系统字体大小变化的影响。

方案十八:使用RichText和TextSpan结合MediaQuery

结合使用RichTextTextSpan,并使用MediaQuery来获取文本比例因子,可以根据需求手动调整文本的大小。

import 'package:flutter/material.dart';void main() {runApp(MyApp());
}class MyApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(home: MyHomePage(),);}
}class MyHomePage extends StatelessWidget {Widget build(BuildContext context) {double textScaleFactor = MediaQuery.of(context).textScaleFactor;return Scaffold(appBar: AppBar(title: Text('Non-Scaling Text'),),body: Center(child: RichText(text: TextSpan(text: 'This text will not scale with system font size',style: TextStyle(fontSize: 16.0 / textScaleFactor, // 根据textScaleFactor调整文本大小),),),),);}
}

在这个例子中,我们使用RichTextTextSpan来创建文本,并根据MediaQuery获取的文本比例因子手动调整文本的大小,以确保文本不受系统字体大小变化的影响。


总结

这些方案提供了多样的选择,可以根据应用的具体需求选择最合适的方式,或者根据情况结合使用不同的方案。希望这些方案对你有帮助,如果有其他问题或需要更多帮助,请随时提问。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/177650.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Doris_Doris导入常见问题

Doris数据导入错误 :the length of input is too larger than schema 可能原因:varchar长度设置过短 Doris表字段乱序 导入palo表中的csv本身无schema信息,csv与palo表字段顺序必须一致,否则会错乱 Doris数据文件中字段比表字段…

探秘:性能测试中最常见的陷阱与解决方案!

概述一下性能测试流程? 1.分析性能需求。挑选用户使用最频繁的场景来测试。确定性能指标,比如:事务通过率为100%,TOP99%是5秒,最大并发用户为1000人,CPU和内存的使用率在70%以下2.制定性能测试计划&#x…

如何解决中小制造业企业信息化难题?

中小企的信息化,难! 一、中小制造业企业信息化困难的原因主要有以下几点: 资金限制:中小制造业企业相对于大型企业来说资金有限,无法投入大量资金进行信息化建设。技术水平不足:中小制造业企业缺乏专业的…

C语言文件操作 | 文件分类、文件打开与关闭、文件的读写、文件状态、文件删除与重命名、文件缓冲区

欢迎关注博主 Mindtechnist 或加入【Linux C/C/Python社区】一起学习和分享Linux、C、C、Python、Matlab,机器人运动控制、多机器人协作,智能优化算法,滤波估计、多传感器信息融合,机器学习,人工智能等相关领域的知识和…

Leetcode—828.统计子串中的唯一字符【困难】

2023每日刷题(四十一) Leetcode—828.统计子串中的唯一字符 算法思想 枚举所有种类字母在s中出现的位置,分别统计只包含这个字母不包含该类字母中其他字母的子串个数 实现代码 int uniqueLetterString(char* s) {int len strlen(s);cha…

四川天蝶电子商务有限公司真实可靠吗?

随着数字经济的不断发展,抖音电商服务日益成为企业拓展销售渠道、提升品牌影响力的关键一环。在这样的大背景下,四川天蝶电子商务有限公司凭借其专业的服务能力和创新的技术手段,迅速崛起为抖音电商服务领域的领军企业。 四川天蝶电子商务有限…

【解决方案】基于边缘计算技术的安科瑞综合管廊能效管理平台

平台背景 综合管廊一般是建于城市地下用于容纳两类及以上城市工程管线的构筑物及附属设施,将电力、自来水、热力、煤气、电信、网络等市政公用管线根据规划要求集中敷设在同一个构建物内,实施统一设计、施工、管理的市政公用隧道空间,并且还…

NAS层协议学习(三)

消息结构 每个NAS消息包含一个协议鉴别符和一个消息标识。协议鉴别符是一个 4 位值,指示正在使用的协议,即对于 EPS NAS 消息是 EMM 或 ESM。消息标识指示发送的特定消息。 EMM 消息还包含一个安全标头,指示消息是否受到完整性保护和/或加密…

DS图—图的最短路径/Dijkstra算法【数据结构】

DS图—图的最短路径/Dijkstra算法【数据结构】 题目描述 给出一个图的邻接矩阵,输入顶点v,用迪杰斯特拉算法求顶点v到其它顶点的最短路径。 输入 第一行输入t,表示有t个测试实例 第二行输入顶点数n和n个顶点信息 第三行起,每行…

【链接MySQL】教你用VBA链接MySQL数据库

hi,大家好呀! 之前呢,给大家分享过一个自制链接表管理器的文章,文章中有链接SQL Server数据库的代码,大家对这一段代码比较有兴趣,既然大家有兴趣,那我们今天就来讲一下链接数据库的代码。 这…

抽象工厂模式-C语言实现

说明&#xff1a; 均由 chatgpt生成&#xff0c;实例可以看出无法运行&#xff0c;仅供参考~ 抽象工厂模式&#xff1a; 代码实现&#xff1a; #include <stdio.h>// 定义抽象产品接口 typedef struct {void (*operation)(); } AbstractProductA;typedef struct {voi…

智慧工地管理系统加快推进工程建设项目全生命周期数字化

智慧工地管系统是一种利用人工智能和物联网技术来监测和管理建筑工地的系统。它可以通过感知设备、数据处理和分析、智能控制等技术手段&#xff0c;实现对工地施工、设备状态、人员安全等方面的实时监控和管理。 智慧工地以物联网、移动互联网技术为基础&#xff0c;充分应用大…

Go 中切片(Slice)的长度与容量

切片长度与容量在 Go 中很常见。切片长度是切片中可用元素的数量&#xff0c;而切片容量是从切片中第一个元素开始计算的底层数组中的元素数量。 Go 中的开发者经常混淆切片长度和容量&#xff0c;或者对它们不够了解。理解这两个概念对于高效处理切片的核心操作&#xff0c;比…

“AI+量子模拟”突破!英伟达与美国量子技术公司SandboxAQ合作

&#xff08;图片来源&#xff1a;网络&#xff09; 11月20日&#xff0c;美国量子技术公司SandboxAQ在美国加利福尼亚州帕洛阿尔托宣布与美国人工智能计算公司英伟达&#xff08;NVIDIA&#xff09;联手&#xff0c;双方将通过人工智能和量子模拟技术助力药物发现、电池设计、…

ESP32-Web-Server编程-HTML 基础

ESP32-Web-Server编程-HTML 基础 概述 HTML(HyperText Markup Language) 是用来描述网页的一种语言。其相关内容存储在前端代码的 .html 文件中。 当浏览器向 web 服务器请求网页时&#xff0c;一个 HTML 文件被发送给浏览器&#xff0c;浏览器解释该文件的内容&#xff0c;…

ASP.NET Core Web API设置响应输出的Json数据格式的两种方式

前言 在ASP.NET Core Web API中设置响应输出Json数据格式有两种方式&#xff0c;可以通过添加System.Text.Json或Newtonsoft.JsonJSON序列化和反序列化库在应用程序中全局设置接口响应的Json数据格式&#xff0c;本文示例使用的是新的Minimal API模式。 JSON序列化和反序列化库…

【TinyALSA全解析(二)】wav和pcm音频文件格式详解

wav和pcm音频文件格式详解 一、本文的目的二、wav和pcm格式文件介绍三、pcm格式文件解析四、wav文件内容解析4.1 文件内容描述4.2 实战分析 五、如何在各种音频格式之间进行转换 /******************************************************************************************…

TikTok数据分析:如何通过数字洞察提升内容质量?

引言 TikTok作为全球最热门的短视频平台之一&#xff0c;每天吸引着亿万用户发布和观看各类内容。在这个充满创意的舞台上&#xff0c;内容质量成为吸引关注和提高曝光度的关键。 而要达到这一目标&#xff0c;数字数据分析成为不可或缺的工具。本文将深入探讨如何通过TikTok数…

AI - Steering behaviors(转向系统)

游戏AI角色的转向系统&#xff08;Steering behaviors&#xff09;实现 一些向量的接口是cocos2dx的。但从名字上应该能理解做了什么向量操作 Seek&#xff1a; 获取当前位置指向目标点的向量&#xff0c;转化为单位向量后再乘以速度值&#xff0c;即为所需速度desired velo…

【C语言】结构体

目录 1. 前言2. 结构体类型的声明2.1 结构体的概念2.2 结构的创建2.3 特殊的声明2.4 结构的自引用 3. 结构成员访问操作符4. 结构体内存对齐4.1 对齐规则4.2 为什么存在内存对齐&#xff1f;4.3 修改默认对齐数 5. 结构体传参6. 结构体实现位段6.1 什么是位段6.2 位段的内存分配…