如何在Flutter中实现半粗体文本效果?
在Flutter中实现半粗体文本效果
在Flutter里实现半粗体文本,核心是通过TextStyle的fontWeight属性控制,以下是两种常用实现方式:
方法一:用系统字体预设字重
大部分系统默认字体(比如iOS的San Francisco、Android的Roboto)都自带半粗体对应的字重——FontWeight.w500(也叫medium字重),直接设置就能匹配示例效果:
Text( "示例半粗体文本", style: TextStyle( fontSize: 16, fontWeight: FontWeight.w500, // 指定半粗体字重 ), )
如果w500效果不符合预期,可以尝试FontWeight.w600,不同字体的字重表现略有差异,按需调整即可。
方法二:搭配自定义字体实现
如果系统字体的半粗体效果达不到要求,可以引入支持半粗体变体的自定义字体:
- 将自定义字体的半粗体文件(比如
MyFont-Medium.ttf)放到项目的assets/fonts/目录下 - 在
pubspec.yaml中配置字体:
flutter: fonts: - family: MyFont fonts: - asset: assets/fonts/MyFont-Regular.ttf - asset: assets/fonts/MyFont-Medium.ttf weight: 500
- 在Text组件中调用:
Text( "自定义字体半粗体", style: TextStyle( fontSize: 16, fontFamily: "MyFont", fontWeight: FontWeight.w500, ), )
注意:必须确保自定义字体本身包含半粗体的字重变体,否则设置
fontWeight不会生效。
内容的提问来源于stack exchange,提问作者The Domain Dude
相关产品推荐
相关产品推荐

