Flutter Text / Text.rich
data
final String data / The text to display(要显示的文本)
Text('final String data / The text to display')
TextSpan
final InlineSpan textSpan / The text to display as a [InlineSpan]
Text.rich(TextSpan(text: 'final InlineSpan textSpan / The text to display as a [InlineSpan]'))
style
final bool inherit
Text('final String data / The text to display',style: TextStyle(inherit: true), )
/// If this is false, properties that don't have explicit values will revert /// to the defaults: white in color, a font size of 10 pixels, in a sans-serif /// font face. 如果为false,则没有显式值的属性将还原默认值:白色,字体大小为10像素,无衬线字体。
Text('TextStyle(inherit: true)',style: TextStyle(inherit: true),),
Container(color: Colors.blue,child: Text('TextStyle(inherit: true)',style: TextStyle(inherit: false),),),
final Color? color (颜色)
Text('TextStyle(inherit: true)',style: TextStyle(inherit: true,color: Colors.blue),),
final Color? backgroundColor (背景颜色)
Text('TextStyle(inherit: true)',style: TextStyle(inherit: true, color: Colors.white, backgroundColor: Colors.red),),
final double? fontSize (字体大小)
Text('TextStyle(inherit: true)',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 22.0),)
final FontWeight? fontWeight (字体粗细)
Text('TextStyle(inherit: true)',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 22.0,fontWeight: FontWeight.bold),)
Text('TextStyle(inherit: true)',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 22.0,fontWeight: FontWeight.w200),)
final double? letterSpacing(字体间水平距离、可以是正数也可以是负数)
Text('TextStyle(inherit: true)',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 22.0,fontWeight: FontWeight.w200,letterSpacing: 10.0),)
final double? wordSpacing (用于增大空白的距离)
Text('TextStyle(inherit true)',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 22.0,fontWeight: FontWeight.bold,wordSpacing: 0.0)
final TextBaseline? textBaseline
Text('大GgYy1991',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 66.0,fontWeight: FontWeight.bold,textBaseline: TextBaseline.ideographic,wordSpacing: 0.0),)
final double? height (行高,字体大小的倍数)
Container(color: Colors.blue,child: Text('大GgYy1991',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 24.0,fontWeight: FontWeight.bold,textBaseline: TextBaseline.alphabetic,height: 2.0,wordSpacing: 0.0),),)
final Locale? locale(用于选择用户语言和格式首选项的标识符)
Text('此刻为中文',style: TextStyle(inherit: true,color: Colors.white,backgroundColor: Colors.red,fontSize: 24.0,fontWeight: FontWeight.bold,textBaseline: TextBaseline.alphabetic,height: 6.0,wordSpacing: 0.0),)
final Paint? foreground (绘制文本的前景色)
Paint paint=new Paint(); paint..color=Colors.green;Text('此刻为中文',style: TextStyle(inherit: true,//color: Colors.white,backgroundColor: Colors.red,fontSize: 24.0,foreground: paint,wordSpacing: 0.0),)
Paint paint=new Paint();paint..color=Colors.blue;
final Paint? background(绘制文本的背景色)
Paint paintBg=new Paint();paintBg..color=Colors.cyan;Text('此刻为中文',style: TextStyle(inherit: true,//color: Colors.white,//backgroundColor: Colors.red,fontSize: 24.0,foreground: paint,background: paintBg,wordSpacing: 0.0),)
final List<ui.Shadow>? shadows offset 阴影开始坐标(相对于手机屏幕原点偏移量) ,blurRadius 阴影模糊半径 ,spreadRadius 阴影扩散半径.
TextStyle(inherit: true,//color: Colors.white,//backgroundColor: Colors.red,fontSize: 24.0,foreground: paint,background: paintBg,shadows: [BoxShadow(color: Colors.purple,offset: Offset(2.0, 2.0),blurRadius: 1.0,spreadRadius: 1.0)],wordSpacing: 0.0),
final TextDecoration? decoration (文本装饰,例如:下划线)
Text('此刻为中文',style: TextStyle(inherit: true,//color: Colors.white,//backgroundColor: Colors.red,fontSize: 24.0,foreground: paint,background: paintBg,decoration: TextDecoration.lineThrough,wordSpacing: 0.0),)
final Color? decorationColor (文本装饰颜色)
Text('此刻为中文',style: TextStyle(inherit: true,//color: Colors.white,//backgroundColor: Colors.red,fontSize: 24.0,foreground: paint,background: paintBg,decoration: TextDecoration.lineThrough,decorationColor: Colors.red,wordSpacing: 0.0),)
final TextDecorationStyle? decorationStyle(文本装饰的样式)
Text('此刻为中文',style: TextStyle(inherit: true,//color: Colors.white,//backgroundColor: Colors.red,fontSize: 24.0,foreground: paint,background: paintBg,decoration: TextDecoration.lineThrough,decorationColor: Colors.red,decorationStyle: TextDecorationStyle.double,wordSpacing: 0.0),)
final double? decorationThickness (文本装饰画笔的宽度)
Text('此刻为中文',style: TextStyle(inherit: true,//color: Colors.white,//backgroundColor: Colors.red,fontSize: 44.0,foreground: paint,background: paintBg,decoration: TextDecoration.lineThrough,decorationColor: Colors.black,decorationStyle: TextDecorationStyle.solid,decorationThickness: 6.0,wordSpacing: 0.0),)
final String? debugLabel (文本样式的描述)
StrutStyle
final double? fontSize (字体占用高度)
Container(color: Colors.blue,child: Text('此刻为中文',strutStyle: StrutStyle(fontSize: 14.0),),)
final double? height (和fontSize配合使用)
Container(color: Colors.blue,child: Text('此刻为中文',strutStyle: StrutStyle(fontSize: 44.0,height: 2.0),),)
textAlign
TextAlign.left
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文',textAlign: TextAlign.left,),),
TextAlign.right
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文',textAlign: TextAlign.right,),)
TextAlign.center
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文',textAlign: TextAlign.center,),)
TextAlign.start
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文',textAlign: TextAlign.start,),)
TextAlign.end
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文',textAlign: TextAlign.end,),)
textDirection
文本方向(从左到右、从右到左)
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文',textDirection: TextDirection.ltr,),)
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文',textDirection: TextDirection.rtl,),)
softWrap
文本超过边界后是否换行
softWrap: false 不换行
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文dddddfdsafdsfdsfdsfdafdsfds',textDirection: TextDirection.rtl,softWrap: false,),)
softWrap : true 换行
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('此刻为中文dddddfdsafdsfdsfdsfdafdsfds',textDirection: TextDirection.rtl,softWrap: true,),)
overflow
文本超过边界后进行处理,例如:显示成省略号
TextOverflow.ellipsis
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.ellipsis,),)
TextOverflow.fade
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.fade,),),
TextOverflow.clip
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.clip,),)
TextOverflow.visible
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.visible,),)
textScaleFactor
字体大小缩放比例
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.visible,textScaleFactor: 0.6,),)
maxLines
文本显示成一行
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.visible,textScaleFactor: 1.0,maxLines: 1,),)
textWidthBasis
TextWidthBasis.parent / 多行文字将占据父文本给定的全宽,单行文本仅包含文本所需的最小宽度将被使用。常见用例是:段落Container(//width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、\n是否显示成省略号、是否显示成省略号、是否显示成省略号、\n是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.visible,textScaleFactor: 1.0,textWidthBasis: TextWidthBasis.parent,),)
Container(width: 200.0,height: 100.0,color: Colors.blue,child: Text('是否显示成省略号、是否显示成省略号、\n是否显示成省略号、是否显示成省略号、是否显示成省略号、\n是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、是否显示成省略号、',textDirection: TextDirection.ltr,overflow: TextOverflow.visible,textScaleFactor: 1.0,textWidthBasis: TextWidthBasis.parent,),)
TextWidthBasis.longestLine / 宽度刚好能容纳最长的一行,一个常见的用例是聊天气泡。如果屏幕宽度拉伸能显示全部文本
Flutter Text / Text.rich相关推荐
- 【Flutter】Text的使用
想了解更多关于Flutter的知识,可以关注: https://github.com/jiangkang/flutter-system https://jiangkang.tech 文本作为UI最基本 ...
- matplotlib.text.Text
http://matplotlib.org/api/text_api.html#matplotlib.text.Text 类 xticks/yticks等都继承与text类 class matplot ...
- Flutter | 让 Text.rich 水平方向居中
需求 这是 UI 设计图: 文本布局在水平方向上是居中的. 我首先想到的是用 Text.rich + TextSpan 来实现,为了方便说明问题,我用 AB CD EF 替代前中后三部分. 这是代码: ...
- Plain text and Rich text
简单概述 Plain text就是纯文本,比如text格式, Rich text就是富文本,比如doc Word processing documents can be categorized int ...
- Flutter的Text控件显示纯英文时高度和汉字不一致的问题
调整前: 调整后: 解决方案: strutStyle: StrutStyle( forceStrutHeight: true, leading: 0.5, ), 解决原理: 中文和英文字体默认的lea ...
- Hadoop中Context类的作用和Mapper<LongWritable, Text, Text, LongWritable>.Context context是怎么回事【笔记自用】
问题导读: 1.Context能干什么? 2.你对Context类了解多少? 3.Context在mapreduce中的作用是什么? 下面我们通过来源码,来得到Context的作用: 下面主要对Set ...
- Flutter文本组件Text
Flutter 文本组件Text 在android中,一个页面,一般是用 Activity 或者是一个Fragement 来加载显示出来的,而其中的 一个View 或者 一个布局文件(layout.x ...
- Flutter 系列文章:Flutter Text 控件介绍
flutter Text 控件介绍 一.使用方法 构造方法 设置普通的text Text("") Text(this.data, {Key key,this.style,this. ...
- Flutter 基础组件之 Text
终于安装好了 Flutter 的环境,既然入了坑,就一点一点学吧,Flutter 可以说一切皆组件吧,所以要熟练掌握各个基础组件的 API,然后才能在面对复杂需求的时候才能得心应手的将各个组件组合起来 ...
最新文章
- 根据经纬度获取用户当前位置信息
- ABP理论学习之通知系统
- MySQL优化篇:执行计划explain中key_len计算方式
- 从无到有,支付路由系统升级打怪之路|原创
- php 只能输入中英文,JavaScript基于正则实现控制输入框中只能输入中文、数字和英文的方法...
- 移动端微信页面的一些自己爬的坑
- ITIL的一些简单感受
- Ubuntu系统---NVIDIA 驱动安装
- [Python学习] 专题六.局部变量、全局变量global、导入模块变量
- 20个让Web Developer开发生涯更加轻松的工具
- 从华为做手机,到腾讯做游戏,他是怎样无缝切换、且年薪百万的?
- 闪回flashback table配合flashback versions query的注意事项
- ASM磁盘的添加与删除
- options请求_跨域共享资源(CORS)和OPTIONS 请求
- python生成手写汉字字体_「zi2zi」:用AI生成自己的手写字体
- renderTo和applyTo的区别
- Latex下载安装配置
- Power Switching ----- Controlling power for power shutoff
- 2022苏州微软前端社招面经
- arcgis影像怎么去黑边_arcgis遥感图像去黑边林林种种(至少7种方法)
热门文章
- 一张图了解数字经济产业链图谱
- Java中的除法结果与除数被除数的类型有关
- 文件查找命令 locate 和 find 详解
- nginx使用ngx.req.get_body_data()获取不到请求体内容
- python中right是什么意思_Python turtle.right方法代码示例
- MATLAB人脸识别疫情防护门禁系统GUI设计与实现
- vbs实现的支持拖动的txt文本切割器
- 解决苹果(mac)浏览器safari导出excel中文名称乱码问题
- 2020.07.24日自编译L大源码openwrt固件x86软路由精简版
- 华佗教你睡觉 一定要看