dephi panel控件怎么设置居中_8-Flutter控件Text剖析

这次分享Flutter常用控件。Flutter界面的交互控件继承Widget(中文翻译为控件，小部件),它是真正屏幕展示元素控件的数据配置，通过widget 的build函数能够设定控件宽高，颜色，内外边距等。实际业务项目中常用控件有Text，Button控件，Image控件，单选框(switch)，复选框(checkbox)，文本输入框(TextField),Form。

1 Text常用于字符展示，下面是各个属性经过实验得出结论。

1.1 style属性赋值通常用其子类TextStyle,用于指定文本显示的样式如颜色、字体、粗细、背景等。

Text控件style属性

效果图

TextStyle属性说明color  指定文本颜色,fontSize 指定文本大小,height 指定行高,fontFamily 字符集不同平台支持有所不同,decoration 为文本添加上划线，下划线，删除线 ,decorationStyle 控制文本上线的形状，有实线，虚线，波浪线等wordSpacing 指定字符间距离letterSpacing 指定单个字符的距离英文单词则是每个字母的距离，汉字则是每个字之间距离。fontWeight 字体加粗

1.2 textAlign 文本的对齐方式；可以选择左对齐、右对齐还是居中，字符串内容超过一行，Text宽度等于屏幕宽度，第二行文本便会居中显示。有六种对齐方式分别为

  left, 将文本与容器的左边缘对齐。  right 将文本与容器的右边缘对齐,  cnter  将文本与容器的中心缘对齐,  justify 文本两端对齐,  start 文字的书写方向起始位置,当textDirection属性值为ltr,则start为左边，end为右那么文字向左对齐。   当textDirection属性值为rtl,则右边为start，end为左，那么文字向右对齐。textDirection没有赋值对齐跟left类似  end 文字的书写方向末尾位置,与start原理一样。textDirection没有赋值对齐跟right类似

左对齐，字符串超出一行

1.3 overflow 指定截断方式，默认是直接截断。有4种截断方式分别为

设置文本字符串超出不换行的属性softWrap=false。

clip：当文本字符串为一行时，溢出的文本被截断。

fade ：当文本字符串为一行时 ，溢出的文本被设为透明。

ellipsis ：字符串超过屏幕宽度，超出部分用省略号表示。

visible:当文本字符串为一行时,溢出的文本继续接着末尾显示。

overflow 指定为ellipsis

1.4 maxLines 指定文本显示的最大行数，默认情况下，文本是自动折行的，如果指定此参数，则文本最多不会超过指定的行

2 怎样把Text控件变成按钮？或者说Text需要加事件监听。实现如下

   var p=Paint()..color=Colors.blue;  InkWell(              onTap: (){                //点击处理                print("onTap");              },              child:Text(                '测试测试',                  style:TextStyle(                   background:p                  )              ),  );

文本点击效果图

觉得Text与原生有什么区别，欢迎关注点赞留言转发

上一讲 7-Flutter应用开发语言Dart语法类剖析

下一讲(待续) 9Flutter控件Button剖析