美文网首页
第一节 Flutter Text Widget 文本组件的使用

第一节 Flutter Text Widget 文本组件的使用

作者: HT_Jonson | 来源:发表于2019-06-27 11:04 被阅读0次

    text

    import 'package:flutter/material.dart';
    import 'package:dio/dio.dart';
    
    
    
    class HomePage extends StatefulWidget {
      HomePage({Key key}) : super(key: key);
    
      _HomePageState createState() => _HomePageState();
    }
    
    class _HomePageState extends State<HomePage> {
      TextEditingController _textEditingController = new TextEditingController();
      final showText = '1测试数据asdfasdfasdfasdfasdfasdfasdfasdfasdfasdfasdasdfasdfasdfads11112asdfasdfasdwqe222222222222222222';
       @override
      Widget build(BuildContext context) {
        gethttp();
        return Scaffold(
          appBar: AppBar(
            title: Text('测试'),
          ),
          body: Center(
           
            child: Text(
              showText,
              textAlign: TextAlign.center,
              maxLines: 2,
              style: new TextStyle(
    
              ),
            ),
          ),
        );
      }
    
    }
    
    ①inherit
    默认为true,设置为false时候表示不显示
    ②color
    字体颜色
    ③fontSize
    fontSize默认是14.0的
    ④fontWeight
    字体的粗体
    ⑤fontStyle
    normal正常 italic 斜体
    ⑥letterSpacing
    字符间距
    ⑦wordSpacing
    单词间距
    ⑧textBaseline
    alphabetic:用于对齐字母字符底部的水平线
    ideographic:用于对齐表意字符的水平线
    ⑨height
    用在Text控件上的时候,会乘以fontSize做为行高,
    ⑩locale
    国际化
    ⑪foreground
    用paint来渲染text,也可以用他来改变字体颜色等
    ⑫background
    ⑬decoration
    有四种下划线、删除线、上划线,默认是无
    ⑭decorationStyle
    线的样式,源码中有这些样式
    ⑮fontFamily和package(自定义字体的时候用的到)
    
    TextAlign属性
    TextAlign属性就是文本的对齐方式,它的属性值有如下几个:
    
    center: 文本以居中形式对齐,这个也算比较常用的了。
    left:左对齐,经常使用,让文本居左进行对齐,效果和start一样。
    right :右对齐,使用频率也不算高。
    start:以开始位置进行对齐,类似于左对齐。
    end: 以为本结尾处进行对齐,不常用。有点类似右对齐.
    ### overflow属性
    
    overflow属性是用来设置文本溢出时,如何处理,它有下面几个常用的值供我们选择。
    
    *   clip:直接切断,剩下的文字就没有了,感觉不太友好,体验性不好。
    *   ellipsis:在后边显示省略号,体验性较好,这个在工作中经常使用。
    *   fade: 溢出的部分会进行一个渐变消失的效果,当然是上线的渐变,不是左右的哦。
    
    
    style属性的内容比较多,具体的你可以查一下API,我这里带作一个效果,方便大家快速学会Style的用法。
    
    我们下面要作的效果为,字体大小为25.0,颜色为粉红色,并且有一个下划线。
    
    
    image.png

    相关文章

      网友评论

          本文标题:第一节 Flutter Text Widget 文本组件的使用

          本文链接:https://www.haomeiwen.com/subject/dvrlcctx.html