Flutter基本组件Text使用

       Text是一个文本显示控件,用于在应用程序界面中显示单行或多行文本内容。

Text简单Demo

import 'package:flutter/material.dart';class MyTextDemo extends StatelessWidget {const MyTextDemo({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("My TEXT TEST")),extendBody: true,body: Column(children: [const Spacer(),Container(margin: const EdgeInsets.all(10),child: Center(child: Text("text one",style: TextStyle(fontSize: 28,fontStyle: FontStyle.italic,color: Colors.blue,letterSpacing: 2,wordSpacing: 10,fontFamily: 'Roboto'),textAlign: TextAlign.center,softWrap: true,overflow: TextOverflow.ellipsis,),),),const Spacer(),],),);}
}

重要属性

data

Text的默认构造函数中有一个必传的参数,且必须作为第一个传入的参数,类型是String,就是Text显示的文本。

 const Text(String this.data, {super.key,this.style,this.strutStyle,this.textAlign,this.textDirection,this.locale,this.softWrap,this.overflow,@Deprecated('Use textScaler instead. ''Use of textScaleFactor was deprecated in preparation for the upcoming nonlinear text scaling support. ''This feature was deprecated after v3.12.0-2.0.pre.',)this.textScaleFactor,this.textScaler,this.maxLines,this.semanticsLabel,this.textWidthBasis,this.textHeightBehavior,this.selectionColor,}) 

style

Text默认样式是DefaultTextStyle类型。如果需要修改样式,可以通过style参数传入一个TextStyle类型的值。

 @overrideWidget build(BuildContext context) { ...final DefaultTextStyle defaultTextStyle = DefaultTextStyle.of(context);...
}
      style: TextStyle(fontSize: 28,fontStyle: FontStyle.italic,color: Colors.blue,letterSpacing: 2,wordSpacing: 10,fontFamily: 'Roboto'),

设置文本颜色

TextStyle(color: Colors.blue)

 

设置文本背景颜色

style:TextStyle(backgroundColor: Colors.green)

设置文本字体大小

style: TextStyle(fontSize: 100)

设置文本加粗

style: TextStyle(fontWeight: FontWeight.bold)

 

设置文本为斜体

 style: TextStyle(fontStyle: FontStyle.italic)

 

设置文本之间的间隙

   style: TextStyle(letterSpacing: 10,)

设置文本内单词间距

 style: TextStyle(wordSpacing: 100)

设置文本行高

  style: TextStyle(height: 10,)

设置文本阴影

style: TextStyle(shadows: [Shadow(color: Colors.black, offset: Offset(3, 2))])

设置文本内容删除线

   style: TextStyle(decoration: TextDecoration.lineThrough, decorationColor: Colors.yellow,)

设置文本内容下划线

       style: TextStyle(decoration: TextDecoration.underline, decorationColor: Colors.yellow,)

设置文本对齐方式

 textAlign: TextAlign.center

居中

设置文本换行

softWrap:true换行;false不换行;
import 'package:flutter/material.dart';class MyTextDemo extends StatelessWidget {const MyTextDemo({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("My TEXT TEST")),extendBody: true,body: Column(children: [const Spacer(),Container(margin: const EdgeInsets.all(10),child: Center(child: Text("text one texttexttexttexttexttexttexttexttexttexttexttexttext",style: TextStyle(fontSize: 50,fontStyle: FontStyle.italic,color: Colors.blue,backgroundColor: Colors.green,letterSpacing: 0,wordSpacing: 100,fontWeight: FontWeight.bold,fontFamily: 'Roboto',decoration: TextDecoration.underline, decorationColor: Colors.yellow,shadows: [Shadow(color: Colors.black, offset: Offset(3, 2))]),textAlign: TextAlign.center,maxLines: 3,softWrap: true,overflow: TextOverflow.ellipsis,),),),const Spacer(),],),);}
}

设置文本溢出

overflow: TextOverflow.ellipsis

设置文本显示最大行数

maxLines: 3

指定文本方向

textDirection: TextDirection.rtl

富文本

import 'package:flutter/material.dart';class MyTextDemo extends StatelessWidget {const MyTextDemo({super.key});@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: const Text("My TEXT TEST")),extendBody: true,body: Column(children: [const Spacer(),Container(margin: const EdgeInsets.all(10),child: Center(// child: Text(//     "text one texttexttexttexttexttexttexttexttexttexttexttexttext",//     style: TextStyle(//         fontSize: 50,//         fontStyle: FontStyle.italic,//         color: Colors.blue,//         backgroundColor: Colors.green,//         letterSpacing: 0,//         wordSpacing: 100,//         fontWeight: FontWeight.bold,//         fontFamily: 'Roboto',//         decoration: TextDecoration.underline,//         decorationColor: Colors.yellow,//         shadows: [//           Shadow(color: Colors.black, offset: Offset(3, 2))//         ]),//     textAlign: TextAlign.center,//     maxLines: 3,//     softWrap: true,//     overflow: TextOverflow.ellipsis,//     textDirection: TextDirection.rtl),child: Text.rich(TextSpan(children: [TextSpan(text: "hhhhhhhhhhhhhhhhhhhhhhhh",style: TextStyle(color: Colors.red,fontSize: 18.0,fontWeight: FontWeight.w700)),TextSpan(text: "ooooooooooooooooooo",style: TextStyle(color: Colors.blue,fontSize: 24.0,fontWeight: FontWeight.w700)),TextSpan(text: "iiiiiiiiiiiiiiiiiiiiiiiiiii",style: TextStyle(decoration: TextDecoration.lineThrough,color: Colors.yellow,fontSize: 14.0)),TextSpan(text: "lllllllllllllllllllllllllll")]))),),const Spacer(),],),);}
}

 

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Protobuf库的使用

文章目录 Protobuf是什么Protobuf使⽤流程介绍ProtoBuf的使用创建.proto⽂件指定proto3语法package声明符定义消息(message)编译contacts.proto⽂件命令如下:序列化与反序列化的使⽤ Protobuf是什么 ProtoBuf(全称ProtocolBuffer…

【Python基础】Python函数

本文收录于 《Python编程入门》专栏,从零基础开始,分享一些Python编程基础知识,欢迎关注,谢谢! 文章目录 一、前言二、函数的定义与调用三、函数参数3.1 位置参数3.2 默认参数3.3 可变数量参数(或不定长参数…

若依框架登录鉴权详解(动态路由)

若依框架登录鉴权:1.获取token(过期在响应拦截器中实现),2.基于RBAC模型获取用户、角色和权限信息(在路由前置守卫),3.根据用户权限动态生成(从字符串->组件,根据permission添加动…

【C++进阶】hash表的封装

文章目录 hash表哈希表的关键组成部分哈希表的优缺点优点:缺点: 常见应用场景 开放定址法实现hash表负载因子 (Load Factor)负载因子的意义负载因子的影响再散列 (Rehashing)示例 整体框架insertFinderasehash桶封装框架insertfinderase~HashTable() 总结…

银行结算业务

1.1 银行本票 银行本票是由银行签发的,承诺自己在见票时无条件支付票款给收款人或持票人的业务。银行本票按票面划分为定额本票和不定额本票,按币种划分为人民币银行本票和外币银行本票。人民币银行本票仅在同一交换区域内使用,资金清算利用当地人民银行组织的资金清算形式…

多个vue项目部署到nginx服务器

文章目录 需求一、项目打包1.vue.config.js2.request.js文件3.打包 二、nginx配置 需求 同一个域名安装多个vue项目。 比如:域名为 https://domain.com 后缀。那么通过不同的后缀就能去访问不同的项目地址。 https://domain.com,不加任何后缀&#x…

【第0006页 · 数组】寻找重复数

【前言】本文以及之后的一些题解都会陆续整理到目录中,若想了解全部题解整理,请看这里: 第0006页 寻找重复数 今天想讨论的一道题在 LeetCode 上评论也是颇为“不错”。有一说一,是道好题,不过我们还是得先理解了它才…

微信小程序中如何监听元素进入目标元素

Page({onLoad: function(){// 如果目标节点(用选择器 .target-class 指定)进入显示区域以下 100px 时,就会触发回调函数。wx.createIntersectionObserver().relativeToViewport({bottom: 100}).observe(.target-class, (res) > {res.inter…

合宙4G模组Air780EX——产品规格书

Air780EX 是合宙通信推出的LTE Cat.1 bis通信模块; Air780EX采用移芯EC618平台,支持LTE 3GPP Rel.13 技术; Air780EX 是4G全网通模块,可适应不同的运营商和产品,确保产品设计的最大灵活性。 其主要特点和优势可以总…

maven配置文件常用模板

注释很详细&#xff0c;直接上代码 项目结构 内容 父项目 pom.xml <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0"xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi…

高德地图SDK Android版开发 10 InfoWindow

高德地图SDK Android版开发 10 InfoWindow 前言相关类和方法默认样式Marker类AMap类AMap.OnInfoWindowClickListener 接口 自定义样式(视图)AMap 类AMap.ImageInfoWindowAdapter 接口 自定义样式(Image)AMap.ImageInfoWindowAdapter 接口 示例界面布局MapInfoWindow类常量成员变…

【数学建模国赛思路预约】2024全国大学生数学建模竞赛助攻思路、代码、论文

2024年全国大学生数学建模大赛马上就要开始了&#xff0c;大家有没有准备好呢&#xff0c;今年将会和之前一样&#xff0c;将会在比赛赛中时期为大家提供比赛各题的相关解题思路、可运行代码参考以及成品论文。 一、分享计划表如下所示 1、 赛中分享内容包括&#xff08;2023国…

高并发内存池(二):​整体框架的介绍与ThreadCache的实现

目录 整体框架介绍 ThreadCache的主体框架 自由链表-FreeList 内存对齐-RoundUp 计算桶位置-Index 基础版 进阶版 线程局部存储 __declspec(thread) 关键字 实现线程无锁 申请内存-Allocate 释放内存-Deallocate 从中心缓存中申请内存 整体框架介绍 高并发内存池…

机器学习引领未来:赋能精准高效的图像识别技术革新

图像识别技术近年来取得了显著进展,深刻地改变了各行各业。机器学习,特别是深度学习的突破,推动了这一领域的技术革新。本文将深入探讨机器学习如何赋能图像识别技术,从基础理论到前沿进展,再到实际应用与挑战展望,为您全面呈现这一领域的最新动态和未来趋势。 1. 引言 …

kubernetes集群部署Confluence 7.2.0+mysql 5.7(自测有效)

背景介绍&#xff1a; Confluence是一个专业的企业知识管理与协同软件。使用简单&#xff0c;但它强大的编辑和站点管理特征能够帮助团队成员之间共享信息、文档协作、集体讨论&#xff0c;信息推送。 这里介绍的使用的是Confluence 7.2.0版本的。 一、在kubernetes集群部署 1…

本地零阶提示优化

本文探讨了如何优化大型语言模型&#xff08;LLM&#xff09;中的提示&#xff08;prompt&#xff09;&#xff0c;以更有效地利用这些黑盒模型的能力。传统的优化方法倾向于寻找全局最优解&#xff0c;但在某些情况下这种做法可能表现不佳。通过对提示优化进行深入的研究&…

01 Docker概念和部署

目录 1.1 Docker 概述 1.1.1 Docker 的优势 1.1.2 镜像 1.1.3 容器 1.1.4 仓库 1.2 安装 Docker 1.2.1 配置和安装依赖环境 1.3镜像操作 1.3.1 搜索镜像 1.3.2 获取镜像 1.3.3 查看镜像 1.3.4 给镜像重命名 1.3.5 存储&#xff0c;载入镜像和删除镜像 1.4 Doecker…

汽车功能安全--TC3xx之PBIST、MONBIST

目录 1.PMS 电源监控速览 2.PBIST 3.MONBIST 4.小结 1.PMS 电源监控速览 英飞凌TC3xx芯片的四种硬件机制&#xff0c;分别是&#xff1a; PMS:PBIST: Power Built-in Self Test. MCU:LBIST: Logic Built-in Self Test. PMS:MONBIST: Monitor Built-in Self Test. VMT:MBI…

史上最全的Linux常用命令汇总(超全面!超详细!)收藏这一篇就够了!

command &#xff1a;命令名&#xff0c;相应功能的英文单词或单词的缩写[-options] &#xff1a;选项&#xff0c;可用来对命令进行控制&#xff0c;也可以省略parameter &#xff1a;传给命令的参数&#xff0c;可以是 零个、一个 或者 多个 查阅命令帮助信息 -help 说明&…

【高阶数据结构】B树、B+树、B*树

B树、B树、B*树 1. 常见的搜索结构2. B树概念3. B树的插入分析4. B树的插入实现4.1 B树的节点设计4.2 B树的部分插入实现14.3 B树的查找4.4 B树的部分插入实现24.5 插入key的过程4.7 B树的插入完整代码4.8 B树的简单验证4.9 B树的删除4.10 B树的性能分析 5. B树6. B*树7. 总结8…