第三百七十三回

文章目录

  • 1. 概念介绍
  • 2. 实现方法
    • 2.1 基本用法
    • 2.2 特殊用法
  • 3. 示例代码
  • 4. 内容总结

我们在上一章回中介绍了"分享三个使用TextField的细节"相关的内容,本章回中将介绍如何让Text组件中的文字自动换行.闲话休提,让我们一起Talk Flutter吧。

在这里插入图片描述

1. 概念介绍

我们在本章回中介绍的Text组件就是用来显示文本的组件,关于该组件的用法可以点击这里查看前面章回中的内容,本章回中主要介绍如何让Text组件中的文本内容自动
换行。这里说的文本主要指长文本,这类文本的长度超过了屏幕宽度或者组件宽度,无法在一行内显示。在实际项目中会遇到这样的场景,因此我们专门来介绍这方面的内容。

2. 实现方法

2.1 基本用法

让长文本自动换行需要使用Text组件的属性,涉及到的属性有三个,详细如下:

  • maxLines属性:主要用来控制文本占用的行数;
  • softWrap属性:主要用来控制是否自动换行,默认值为true;
  • overflow属性:主要用来控制超过长度的文本显示方式,比如显示省略号;
    使用这三个属性后就可以让长文本自动换行显示,不过softWrap属性可以不设置,因为该属性的默认值是true.

2.2 特殊用法

当Text组件处于其它布局组件中时上一小节中介绍的基本用法就不起作用了,这就是Text组件的特殊用法,详细如下:

  • 当Text组件位于Column组件中时,不使用基本用法中的三个属性也会让长文本自动换行;
  • 当Text组件位于Row组件中时,不仅要使用基本用法中的三个属性还需要在它外层加一个Extend组件,这样才会让文本自动换行;
    这两个用法只用文本描述比较抽象,我们将在后面的小节中通过示例代码来演示它们的用法。

3. 示例代码

Column(
  children: [
    ///列中的长文本可以自动换行
    const Text( " Text Widget WidgetWidgetWidgetWidgetWidgetWidgetWidget",
        style: TextStyle(
          color: Colors.white,
          fontSize: 16,
          backgroundColor: Colors.cyan,
        ),
    ),
    const SizedBox(height: 16,),
    ///行中的长文本不可以自动换行,需要嵌套一个Expander组件
    const Row(
      children: [
        Expanded(
          child: Text( " Text Widget WidgetWidgetWidgetWidgetWidgetWidgetWidget",
          maxLines: 2,
          softWrap: true,
          overflow: TextOverflow.ellipsis,
          style: TextStyle(
            color: Colors.white,
            fontSize: 16,
            backgroundColor: Colors.cyan,
          ),
          ),
        ),
      ],
    ),
  ],
),

我们在上面的示代码中演示了基本用法和特殊用法中介绍的内容,基本用法没有单独列出来,而是包含在特殊用法中了,也就是代码中Expander组件中的内容。编译并且
运行上面的程序可以得到下面的运行效果图。035

4. 内容总结

最后我们对本章回的内容做一个全面的总结:

  • 当项目中遇到超过屏幕或者容器宽度的长文本时需要换行显示;
  • 在Text组件中提供了:maxLines,softWrap和overflow三个属性来控制文本自动换行显示;
  • 当Text组件位于Column和Row等布局组件中时需要特殊的用法才能让长文本自动换行显示;
    看官们,与"如何让Text组件中的文字自动换行"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/418426.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Redis性能攻略:Redis-benchmark工具与实用性能优化技巧

Redis作为一种高性能的内存数据库,广泛应用于各种业务场景。然而,随着业务规模的扩大和数据量的增长,Redis的性能问题逐渐凸显出来。为了提高Redis的性能,本文将深入探讨Redis性能优化方案,包括参数配置、数据结构、多…

华为HarmnyOS TypeScript基础语法快速入门

华为HarmnyOS TypeScript基础语法快速入门 一、JavaScript、TypeScript、ArkTS二、TypeScript基础语法1. 基础类型2. 条件语句3. 函数4. 类5. 模块6. 迭代器 一、JavaScript、TypeScript、ArkTS ArkTS是HarmonyOS优选的主力应用开发语言。它在TypeScript(简称TS&am…

js方法 提前结束循环

http://t.csdnimg.cn/j0gkOhttp://t.csdnimg.cn/j0gkO 一、各种循环方法如何跳出整个循环? 对于forEach()方法,目前似乎没有比较优雅的跳出整个循环的方法,如果你实在要用forEach()方法并且需要在某种条件下跳出整个循环提高遍历效率&#x…

react路由基础

1.目录 A. 能够说出React路由的作用 B. 能够掌握react-router-dom的基本使用 C. 能够使用编程式导航跳转路由 D. 能够知道React路由的匹配模式 2.目录 A. React路由介绍 B. 路由的基本使用 C. 路由的执行过程 D. 编程式导航 E. 默认路由 F. 匹配模式 3.react路由介绍 现代…

[Vulnhub]靶场 Web Machine(N7)

kali:192.168.56.104 主机探测: arp-scan -l 靶机ip:192.168.56.104 端口扫描 nmap -p- 192.168.56.106 看一下web 目录扫描 gobuster dir -u http://192.168.56.106 -x html,txt,php,bak,zip --wordlist/usr/share/wordlists/dirbuster/directory-list-2.3-medium.txt exp…

R语言数据可视化之美专业图表绘制指南(增强版):第1章 R语言编程与绘图基础

第1章 R语言编程与绘图基础 目录 第1章 R语言编程与绘图基础前言1.1 学术图表的基本概念1.1.1 学术图表的基本作用1.1.2基本类别1.1.3 学术图表的绘制原则 1.2 你为什么要选择R1.3 安装 前言 这是我第一次在博客里展示学习中国作者的教材的笔记。我选择这本书的依据是作者同时…

认识通讯协议——TCP/IP、UDP协议的区别,HTTP通讯协议的理解

目录 引出认识通讯协议1、TCP/IP协议,UDP协议的区别2、HTTP通讯协议的讲解 Redis冲冲冲——缓存三兄弟:缓存击穿、穿透、雪崩缓存击穿缓存穿透缓存雪崩 总结 引出 认识通讯协议——TCP/IP、UDP协议的区别,HTTP通讯协议的理解 认识通讯协议 …

【脑切片图像分割】MATLAB 图像处理 源码

1. 简单图像处理 加载图像 Brain.jpg,使用直方图和颜色分割成区域这些区域有不同的颜色。 这是一个更高级的问题,有多个解决它的方法。 例如,您可以计算具有特定数字的图像的直方图(例如 16 - 32),找到直方…

黑马JavaWeb开发跟学(二)Web前端开发JavaScript、Vue基础

黑马JavaWeb开发跟学二.Web前端开发JavaScript、Vue基础 前言1 JavaScript1.1 介绍1.2 引入方式1.3 基础语法1.3.1 书写语法1.3.2 变量1.3.3 数据类型和运算符 1.4 函数1.4.1 第一种定义格式1.4.2 第二种定义格式 1.5 JavaScript对象1.5.1 基本对象1.5.1.1 Array对象语法格式特…

论文笔记:基于互信息估计和最大化的深度表示学习

整理了ICLR2019 LEARNING DEEP REPRESENTATIONS BY MUTUAL INFORMATION ESTIMATION AND MAXIMIZATION)论文的阅读笔记 背景模型 论文地址:DIM code:代码地址 背景 发现有用的表示是深度学习的一个核心目标,由于之前的工作已经可以…

RocketMQ—RocketMQ集成SpringBoot

RocketMQ—RocketMQ集成SpringBoot 新建生产者的boot项目和消费者的boot项目&#xff0c;pom文件重点如下&#xff1a; <dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-web</arti…

[RoarCTF 2019]Easy Calc

这题考查的是: 字符串解析特性目录读取文件内容读取 字符串解析特性详解&#xff1a;PHP字符串解析特性 &#xff08;$GET/$POST参数绕过&#xff09;&#xff08;含例题 buuctf easycalc&#xff09;_参数解析 绕过-CSDN博客 ascii码查询表&#xff1a;ASCII 表 | 菜鸟工具 …

ubuntu 20.04下查找pycharm-vscode-qtcreator安装路径-查快捷方式路径-pycharm要以root权限运行脚本

环境&#xff1a;ubuntu20.04 两个用户&#xff1a;root ips3000 qtcreator和pycharm是用户ips3000从软件商店中安装的。1.快捷键和启动方式注意关键词&#xff0c;名字不一样。 桌面快捷方式 启动方式 Pycharm Pycharm-community.desktop Pycharm.sh Qtcreator **qtcrea…

程序媛的mac修炼手册-- Node.js入门篇

最近因为参与一个微信小程序的开发&#xff0c;开始摸索JavaScript。期间&#xff0c;需要基于Node.js安装微信开发工具的依赖项&#xff0c;所以又顺带学习了Node.js的包管理工具npm&#xff08;Node Package Manager&#xff09;。不过&#xff0c;之前看到国外的全栈大佬​​…

GEE入门篇|图像处理(二):在Earth Engine中进行波段计算

目录 波段计算 1.NDVI的计算 2.NDVI 归一化差值的单次运算计算 3.使用 NDWI 的归一化差值 波段计算 许多指数可以使用 Earth Engine 中的波段运算来计算。 波段运算是对图像中两个或多个波段进行加、减、乘或除的过程。 在这里&#xff0c;我们将首先手动执行此操作&#x…

政安晨:【掌握AI的深度学习工具Keras API】(二)—— 【使用内置的训练循环和评估循环】

渐进式呈现复杂性&#xff0c;是指采用一系列从简单到灵活的工作流程&#xff0c;并逐步提高复杂性。这个原则也适用于模型训练。Keras提供了训练模型的多种工作流程。这些工作流程可以很简单&#xff0c;比如在数据上调用fit()&#xff0c;也可以很高级&#xff0c;比如从头开…

ShardingSphere inline表达式线程安全问题定位

ShardingSphere inline表达式线程安全问题定位 问题背景 春节期间发现 ShardingSphere 事务 E2E 偶发执行失败问题&#xff0c;并且每次执行失败需要执行很久&#xff0c;直到超时。最终定位发现 inline 表达式存在线程安全问题。本文记录定位并解决 inline 表达式线程安全问…

实验笔记之——Ubuntu20.04配置nvidia以及cuda并测试3DGS与SIBR_viewers

之前博文测试3DGS的时候一直用服务器进行开发&#xff0c;没有用过笔记本&#xff0c;本博文记录下用笔记本ubuntu20.04配置过程&#xff5e; 学习笔记之——3D Gaussian Splatting源码解读_3dgs运行代码-CSDN博客文章浏览阅读3.2k次&#xff0c;点赞34次&#xff0c;收藏62次…

编写科技项目验收测试报告需要注意什么?第三方验收测试多少钱?

科技项目验收测试是一个非常重要的环节&#xff0c;它对于确保科技项目的质量和可用性起着至关重要的作用。在项目完成后&#xff0c;进行科技项目验收测试可以评估项目的功能、性能和可靠性等方面&#xff0c;并生成科技项目验收测试报告&#xff0c;以提供给项目的相关方参考…

keil uv5 map文件解析

map参考博客&#xff1a;https://www.csdn.net/tags/MtjaYgwsMTY2NzUtYmxvZwO0O0OO0O0O.html 配置外部flash存储代码&#xff1a;https://strongerhuang.blog.csdn.net/article/details/51485903?spm1001.2101.3001.6650.4&utm_mediumdistribute.pc_relevant.none-task-bl…