Flutter——最详细(Table)网格、表格组件使用教程

背景

用于展示表格组件,可指定线宽、列宽、文字方向等属性

属性作用
columnWidths列的宽度
defaultVerticalAlignment网格内部组件摆放方向
border网格样式修改
children表格里面的组件
textDirection文本排序方向
import 'package:flutter/material.dart';class CustomTable extends StatelessWidget {const CustomTable({Key? key}) : super(key: key);Widget build(BuildContext context) {_ItemBean title = _ItemBean("姓名", "年龄", "性别", "单位名称", "单位地点");_ItemBean m = _ItemBean("周", "20", "男", "得意", "武汉");_ItemBean kg = _ItemBean("王", "18", "男", "中科", "武汉");_ItemBean s = _ItemBean("李", "18", "男", "互动", "武汉");_ItemBean a = _ItemBean("菜", "18", "男", "阿里", "武汉");_ItemBean k = _ItemBean("热", "18", "男", "字节", "武汉");_ItemBean mol = _ItemBean("赵", "18", "女", "腾讯", "武汉");_ItemBean cd = _ItemBean("曹", "18", "男", "盛天", "武汉");List<_ItemBean> data = [title, m, kg, s, a, k, mol, cd];return SingleChildScrollView(scrollDirection: Axis.horizontal,child: Table(columnWidths: const <int, TableColumnWidth>{0: IntrinsicColumnWidth(),//可以根据内部组件大小自适应宽度1: FixedColumnWidth(80.0),2: FixedColumnWidth(80.0),3: FixedColumnWidth(80.0),4: FixedColumnWidth(80.0),},defaultVerticalAlignment: TableCellVerticalAlignment.middle,border: TableBorder.all(color: Colors.red, width: 1.0, style: BorderStyle.solid),children: data.map((item) => TableRow(children: <Widget>[Center(child: Text(item.name,style: const TextStyle(color: Colors.black, fontSize: 18),)),Padding(padding: const EdgeInsets.all(8.0),child: Center(child: Text(item.symbol,style: const TextStyle(color: Colors.red, fontSize: 18),)),),Padding(padding: const EdgeInsets.all(8.0),child: Center(child: Text(item.unitSymbol,style: const TextStyle(color: Colors.green, fontSize: 18),)),),Padding(padding: const EdgeInsets.all(8.0),child: Center(child: Text(item.unitName,style:const TextStyle(color: Colors.yellow, fontSize: 18),)),),Padding(padding: const EdgeInsets.all(8.0),child: Center(child: Text(item.unit,style:const TextStyle(color: Colors.deepPurpleAccent, fontSize: 18),)),),])).toList(),),);}
}class _ItemBean {String name;String symbol;String unit;String unitName;String unitSymbol;_ItemBean(this.name, this.symbol, this.unit, this.unitName, this.unitSymbol);
}

在这里插入图片描述

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

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

相关文章

还没听说过IOC你就out了!融合IOC的可视化大屏重塑校园管理模式

一.IOC到底是个啥东西 在数字孪生中&#xff0c;IOC&#xff08;物联网操作中心&#xff09;是指一个中心化的平台或系统&#xff0c;用于监控、管理和控制物联网设备和系统。在智慧校园建设中用于集成、管理和优化校园各类数据和资源的中心化平台。它通常采用先进的信息技术和…

防火墙之安全策略

目录 前言&#xff1a; 一、实验需求 二、需求分析 三、具体操作 1&#xff0c;在安全区域中新建拓扑图中所显示的区域 2&#xff0c;在对象模块中的时间段中添加一个9&#xff1a;00-18&#xff1a;00 3&#xff0c;写两条安全策略&#xff0c;一个是生产区&#xff0c…

解决Invalid or unsupported by client SCRAM mechanisms(dbeaver)

在用工具&#xff08;dbeaver&#xff09;链接Opengauss数据库的时候&#xff0c;报出标题的错误。原因为驱动不正确。 驱动下载地址&#xff1a;https://opengauss.org/zh/download/ 下载完的包 &#xff0c;解压后&#xff0c;里面应该有两个jar 包,使用postgresql.jar dbe…

AWS 云安全性:检测 SSH 暴力攻击

由于开源、低成本、可靠性和灵活性等优势&#xff0c;云基础设施主要由基于linux的机器主导&#xff0c;然而&#xff0c;它们也不能幸免于黑客的攻击&#xff0c;从而影响云的安全性。攻击Linux机器最流行的方法之一是通过SSH通道。 什么是 SSH 安全外壳协议&#xff08;Sec…

进程间的通信--管道

文章目录 一、进程通信的介绍1.1进程间为什么需要通信1.2进程如何通信 二、管道2.1匿名管道2.1.1文件描述符理解管道2.1.2接口使用2.1.3管道的4种情况2.1.4管道的五种特征 2.2管道的使用场景2.2.1命令行中的管道2.2.2进程池 2.命名管道2.1.1原理2.2.2接口2.2.3代码实例 一、进程…

论文 | Chain-of-Thought Prompting Elicits Reasoningin Large Language Models 思维链

这篇论文研究了如何通过生成一系列中间推理步骤&#xff08;即思维链&#xff09;来显著提高大型语言模型进行复杂推理的能力。论文展示了一种简单的方法&#xff0c;称为思维链提示&#xff0c;通过在提示中提供几个思维链示例来自然地激发这种推理能力。 主要发现&#xff1…

Apache Seata应用侧启动过程剖析——RM TM如何与TC建立连接

本文来自 Apache Seata官方文档&#xff0c;欢迎访问官网&#xff0c;查看更多深度文章。 本文来自 Apache Seata官方文档&#xff0c;欢迎访问官网&#xff0c;查看更多深度文章。 Apache Seata应用侧启动过程剖析——RM & TM如何与TC建立连接 前言 看过官网 README 的第…

阶段三:项目开发---民航功能模块实现:任务24:航空实时监控

任务描述 内 容&#xff1a;地图展示、飞机飞行轨迹、扇区控制。航空实时监控&#xff0c;是飞机每秒发送坐标&#xff0c;经过终端转换实时发送给塔台&#xff0c;为了飞机位置的精准度&#xff0c;传输位置的密度很大&#xff0c;在地图位置显示不明显。本次为了案例展示效…

【C++深度学习】多态(概念虚函数抽象类)

✨ 疏影横斜水清浅&#xff0c;暗香浮动月黄昏 &#x1f30f; &#x1f4c3;个人主页&#xff1a;island1314 &#x1f525;个人专栏&#xff1a;C学习 &#x1f680; 欢迎关注&#xff1a;&#x1f44d;点赞 &…

基于与STM32的加湿器之温湿度驱动

1.简介 温湿度计是一种用于测量和监测环境中温度和湿度的仪器&#xff0c;其工作原理基于热力学原理和物理原理。通过测量和显示环境中的温度和湿度&#xff0c;帮助用户了解当前环境的温湿度状况&#xff0c;从而采取相应的措施来调节或控制环境&#xff0c;以达到最佳的生产、…

Vue3入门之创建vue3的单页应用(vite+vue)

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…

【测开能力提升-fastapi框架】介绍简单使用

0. 前期说明 立了很多flag(开了很多专题)&#xff0c;但坚持下来的没几个。也干了很多测试工作(起初是硬件(Acoustic方向)测试 - 业务功能测试 - 接口测试 - 平台功能测试 - 数据库测试 - py自动化测试 - 性能测试 - 嵌入式测试 - 到最后的python测试开发)&#xff0c;最终还是…

自定义枚举对象序列化规则: 在Json中以枚举的code值表示枚举;枚举序列化时,新增枚举描述字段;String到IEnum的转换

文章目录 引言I 案例分析1.1 接口签名计算1.2 请求对象1.3 枚举对象序列化1.4 创建JavaTimeModule以支持Java 8的时间日期类型序列化和反序列化1.5 请求对象默认值处理II 在JSON中以枚举的code值来表示枚举的实现方式2.1 自定义toString方法返回code2.2 使用@JsonValue注解,只…

Unity入门之重要组件和API(3) : Transform

前言 Transform类主要处理游戏对象(GameObject)的位移、旋转、缩放、父子关系和坐标转换。 1.位置和位移 1.1必备知识点&#xff1a;Vector3 Vector3 主要用来表示三维坐标系中的一个点或者一个向量。 【声明】 Vector3 v1 new Vector3(); Vector3 v2 new Vector3(10, 10…

应用监控SkyWalking调研

参考&#xff1a; 链路追踪( Skyworking )_skywalking-CSDN博客 企业级监控项目Skywalking详细介绍&#xff0c;来看看呀-CSDN博客 SkyWalking 极简入门 | Apache SkyWalking 使用 SkyWalking 监控 ClickHouse Server | Apache SkyWalking https://zhuanlan.zhihu.com/p/3…

对于多个表多个字段进行查询、F12查看网页的返回数据帮助开发、数据库的各种查询方式(多对多、多表查询、子查询等)。

对于多个表多个字段进行查询、F12查看网页的返回数据帮助开发、数据库的各种查询方式&#xff08;多对多、多表查询、子查询等&#xff09;。 一、 前端界面需要展现多个表的其中几个数据的多表查询。1. 三个表查询其中字段返回&#xff1a;&#xff08;用一下sql语句&#xff…

构建与操作共享栈

归纳编程学习的感悟, 记录奋斗路上的点滴, 希望能帮到一样刻苦的你! 如有不足欢迎指正! 共同学习交流! 🌎欢迎各位→点赞 👍+ 收藏⭐ + 留言​📝既然选择了远方,当不负青春,砥砺前行! 共享栈是一种优化的栈实现方式,它允许两个或多个栈共享同一段连续的内存空间…

ch552g中使用SPI进行主从机通信时发现的问题

参考 基本硬件准备 两块独立的ch552g的板子&#xff0c;开始连接时数据传输出现数据错误&#xff0c;本来猜想是通信线连接问题&#xff0c;后来用了较短的连接线依然没有改善。 SPI通信的认知 SPI一般都是全双工实时通信&#xff0c;所以在发送数据时一般有短暂的停留使得…

MySQL黑马教学对应视屏笔记分享之聚合函数,以及排序语句的讲解笔记

聚合函数 注意&#xff1a;null值不参与聚合函数的计算。 分组查询 2.where与having的区别 执行时机不同&#xff1a;where是在分组之前进行过滤&#xff0c;不满足where条件&#xff0c;不参与分组&#xff1b;而having是分组之后对结果进行过滤。判断条件不同&#xff1a;w…

中职网络安全B模块渗透测试system0016

访问http://靶机IP/web1/,获取flag值&#xff0c;Flag格式为flag{xxx}&#xff1b; 可能会跳转8000端口删除进入80端口 进入后点击侦查一下&#xff0c;这里乱码了&#xff0c;我们点击查看是一个柯南&#xff0c;web但这是一个web题目肯定不是隐写术&#xff0c;所以说题目的…