flutter学习--Text组件

本文介绍了Flutter中的Text组件,讲解了textAlign、maxLines、overflow和softWrap属性的用法。textAlign用于控制文字内部对齐,maxLines限制文本的最大行数,overflow处理文本溢出,常见的处理方式有clip、ellipsis和fade。softWrap属性则决定了是否自动换行,style属性允许自定义文本样式。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Text组件属性

为了展示效果,首先编写如下代码:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Text组件学习',
      home: new Scaffold(
        appBar: AppBar(
          title: Text('Text组件学习'),
        ),
        body: Center(
          child: Text(
            "sassssssssssssssssssssssssssssssssssssssssssssssssaaaaaaaaaaaaaaaaaaaaaaa",
          ),
        ),
      ),
    );
  }
}

效果如图
在这里插入图片描述
1.textAligin属性,控制文字内部对齐方式

//textAlign: TextAlign.center  文字居中
//textAlign: TextAlign.end  文字居于尾部
//textAlign: TextAlign.start  文字居于首部
//textAlign: TextAlign.right  文字居右
//textAlign: TextAlign.left  文字居左
//textAlign: TextAlign.justify 文字两端贴边对齐

2.maxlines属性,控制文本最大行数,多余部分直接截取
3.overflow属性,
overflow属性是用来设置文本溢出时,如何处理,它有下面几个常用的值供我们选择。

  • clip:直接切断,剩下的文字就没有了,感觉不太友好,体验性不好。
  • ellipsis:在后边显示省略号,体验性较好,这个在工作中经常使用。
  • fade: 溢出的部分会进行一个渐变消失的效果,当然是上线的渐变,不是左右的哦

4.softWrap属性,控制是否自动换行,若为false,文字将不考虑容器大小,单行显示,超出屏幕部分将默认截断处理
5.style属性,style属性的内容比较多,具体的你可以查一下API
https://docs.flutter.io/flutter/painting/TextStyle-class.html

//字体大小为25,颜色为紫色,有实线下划线
 style: TextStyle(
                fontSize: 25.0,
                color: Color.fromARGB(255, 255, 150, 255),
                decoration: TextDecoration.underline,
                decorationStyle: TextDecorationStyle.solid,
              ),
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值