首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在表中使用TextFormField (DataTable)

在表中使用TextFormField (DataTable)是一种在Flutter中创建交互式表单的方法。TextFormField是一个可编辑的文本字段,它允许用户输入文本并将其提交给应用程序。

在DataTable中使用TextFormField可以实现在表格中编辑和保存数据的功能。DataTable是Flutter中用于显示表格数据的小部件,它可以显示多行和多列的数据,并支持排序和筛选。

使用TextFormField (DataTable)的步骤如下:

  1. 导入所需的包:
代码语言:txt
复制
import 'package:flutter/material.dart';
  1. 创建一个包含表格数据的数据源:
代码语言:txt
复制
List<Map<String, dynamic>> tableData = [
  {'name': 'John', 'age': 25},
  {'name': 'Jane', 'age': 30},
  {'name': 'Bob', 'age': 35},
];
  1. 创建一个状态管理器来跟踪表格数据的更改:
代码语言:txt
复制
class TableDataModel {
  String name;
  int age;

  TableDataModel({this.name, this.age});
}
  1. 创建一个包含TextFormField的小部件,并将其放置在DataTable中的单元格中:
代码语言:txt
复制
class EditableCell extends StatefulWidget {
  final TableDataModel data;
  final String fieldName;

  EditableCell({this.data, this.fieldName});

  @override
  _EditableCellState createState() => _EditableCellState();
}

class _EditableCellState extends State<EditableCell> {
  TextEditingController _controller;

  @override
  void initState() {
    super.initState();
    _controller = TextEditingController(text: widget.data.name);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return TextFormField(
      controller: _controller,
      onChanged: (value) {
        setState(() {
          widget.data.name = value;
        });
      },
      decoration: InputDecoration(
        border: InputBorder.none,
      ),
    );
  }
}
  1. 创建一个包含DataTable的小部件,并在其中使用EditableCell来显示可编辑的单元格:
代码语言:txt
复制
class MyTable extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return DataTable(
      columns: [
        DataColumn(label: Text('Name')),
        DataColumn(label: Text('Age')),
      ],
      rows: tableData.map((data) {
        TableDataModel model = TableDataModel(name: data['name'], age: data['age']);
        return DataRow(
          cells: [
            DataCell(EditableCell(data: model, fieldName: 'name')),
            DataCell(Text(data['age'].toString())),
          ],
        );
      }).toList(),
    );
  }
}
  1. 在主应用程序中使用MyTable小部件来显示表格:
代码语言:txt
复制
void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: MyTable(),
      ),
    );
  }
}

这样,就可以在表格中使用TextFormField来实现编辑功能。用户可以在TextFormField中输入文本,并通过onChanged回调来更新表格数据。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • pivottablejs|Jupyter尽情使用数据透视

    大家好,之前的很多介绍pandas与Excel的文章,我们说过「数据透视」是Excel完胜pandas的一项功能。...Excel下只需要选中数据—>点击插入—>数据透视即可生成,并且支持字段的拖取实现不同的透视,非常方便,比如某招聘数据制作地址、学历、薪资的透视 而在Pandas制作数据透视可以使用pivot_table...pivottablejs 现在,我们可以使用pivottablejs,可以让你在Jupyter Notebook,像操作Excel一样尽情的使用数据透视!...接下来,只需两行代码,即可轻松将数据透视和强大的pandas结合起来 from pivottablejs import pivot_ui pivot_ui(df) 就像上面GIF展示的一样,你可以...Notebook任意的拖动、筛选来生成不同的透视,就像在Excel中一样,并且支持多种图表的即时展示 还等什么,用它!

    3.7K30

    cuda中使用哈希

    关于cuda中使用哈希的一些经验总结 cuda哈希方法 目前已知的cuda中使用哈希的方法: 数组 适用于较小的数据规模,如键的范围是int,或者能转化为整型,值类型最长为long等 cudpp...::unordered_map获取数据 将keys和values从host拷贝到device 创建CUDPPHandle 插入数据 使用哈希查询数据 验证数据 将查询的结果由GPU内存拷贝回CPU内存...详见cudpp_issues_187 扩展cudpp哈希 修改CUDPP库哈希功能支持更长的键类型....原库支持32bit键值对,将其编码64bit的long long类型;我实际工作需要对碱基序列进行哈希查找,每一个碱基可能有ACGTN五种类型,最开始只处理单barcode是10bp,所以有5^10...(9765625)种可能序列,不到10M数据,cuda中使用数组就可以了;后来需要处理双barcode,20bp,有5^20(95367431640625)种可能序列,需要约95T数据,数组显然不够,

    1K20

    PowerBI创建时间(非日期

    powerquery创建日期使用powerbi过程中一个必不可少的内容(当然,你也可以使用DAX来创建): Power BI创建日期的几种方式概览 但是很多时候我们进行数据分析时,只有日期是不够的...,某些行业,我们不仅要对年、季度月、周、日等维度进行分析,我们可能还需要对分钟、小时、15分钟、5分钟等进行划分维度并分析。...有朋友会说,日期上添加一个时间列就完了,不过,如果你真的直接把时间添加在日期上,你就会发现组合结果的庞大。假设日期包括每天一条记录,其中包含 10 年的数据,也即是有3650行数据。...3亿行对于一个维度来说,太过于huge。哪怕只保留到分钟,仍然会超过 500 万行,很显然是不合适的。 因此呢,不要合并日期和时间。这两个应该是两个不同的,并且它们都可以与事实建立关系。...本文中使用的时间维度包含以下的列信息: ? 添加办法也很简单,powerquery添加空白查询,然后打开高级查询编辑器,输入以下代码: ? 点击完成即可。

    4.3K10

    C#代码示例:WinForm创建并绑定一个DataTable

    我的一篇文章,我解释了如何在没有数据库的情况下以web形式绑定gridview。这里,我将解释如何在没有数据库的windows窗体绑定datagrid。...1、创建一个数据。 2、通过需要数据类型来创建列名column或标题。 3、将此列column添加到datatable 4、创建一个包含输入控件所有值的行。...这样,我们就可以windows窗体应用程序绑定一个没有数据库的datagrid。 对于维护这个datagrid的状态,现在用户面临的问题是什么。...将行绑定到datagrid时,输入一个条件。首先,检查该数据是否有数据。如果没有数据,则绑定datagrid的列标头,否则只绑定没有datacolumn标头的行。...因此,通过这种方式,我们就可以windows应用程序维护datatable状态。

    3.4K40

    Global inClickhouse非分布式查询使用

    ClickhouseOLAP查询场景下有显著的性能优势,但Clickhousejoin查询的场景下,性能表现并不是很好,因此实际业务场景需要多表计算时,往往是通过in+子查询的方式代替join...笔者最近的业务开发,尝试用这种方式,性能却没有想象那么好。分析Clickhouse的查询计划,发现子查询的语句会多次执行,且性能开销主要来自于子查询的执行,因此总体上查询耗时很长。...实际业务场景会比这个查询复杂一些,可能会有更多的“user_id in xxx”条件(因为实际业务属性和行为都可能分布多个),但查询语句的模式不会变。...有了上面的知识背景,再来分析如下的查询语句: select distinct(sa_value) from user where user_id in A 假设user_iduser的主键,“user_id...例如,当user很大,而A子查询执行的开销很小时,全扫描user的数据开销远比多执行一次A子查询开销大,这时使用prewhere优化可以提升执行效率。

    5K52

    问与答60: 怎样使用矩阵数据工作绘制线条?

    学习Excel技术,关注微信公众号: excelperfect 本文来源于wellsr.com的Q&A栏目,个人觉得很有意思,对于想要在工作使用形状来绘制图形的需求比较具有借鉴意义,特辑录于此,代码稍有修改...连接的过程,遇到0不连接,如果两个要连接的数值之间有其他数,则从这些数值上直接跨过。如图1所示,连接的顺序是1-2-3-4-5-6-7-8-9-10-11-12-13。...A:VBA代码如下: 'Excel中使用VBA连接单元格的整数 '输入: 根据实际修改rangeIN和rangeOUT变量 ' rangeIN - 包括数字矩阵的单元格区域 '...Dim arrRange() As Variant Set rangeIN= Range("B3:E6") Set rangeOUT = Range("H3") '删除工作已绘制的形状...DeleteArrows ReDim arrRange(0) '一维数组存储单元格区域中所有大于0的整数 For Each cell In rangeIN

    2.5K30

    Excel公式嵌入查找

    标签:Excel公式 通常,我们会在工作中放置查找,然后使用公式查找相对应的值。然而,这也存在风险,就是用户可能会在删除行时无意识地将查找的内容也删除,从而导致查找错误。...如下图1所示,将查找放置列AA和列BB。 图1 如下图2所示,查找查找列A的值并返回相应的结果。...图2 此时,如果我们删除行,而这些删除的行刚好在查找数据所在的行,那么就破坏了查找。那么,该怎么避免这种情况呢? 一种解决方法是另一个工作中放置查找,然后隐藏该工作。...然而,如果查找的数据不多,正如上文示例那样,那么可以将查找嵌入到公式。 如下图3所示,选择公式中代表查找所在单元格区域的字符。...如果不好理解,你可以直接将其复制到工作。 按Ctrl+C键复制花括号内容后,工作中选择5行2列区域,输入=号,按Ctrl+V键,再按Ctrl+Shift+Enter组合键,结果如下图6所示。

    24530

    pandas中使用数据透视

    什么是透视? 经常做报表的小伙伴对数据透视应该不陌生,excel利用透视可以快速地进行分类汇总,自由组合字段聚合计算,而这些只需要拖拉拽就能实现。...pandas作为编程领域最强大的数据分析工具之一,自然也有透视的功能。 pandas,透视操作由pivot_table()函数实现,不要小看只是一个函数,但却可以玩转数据,解决大麻烦。...pivot_table使用方法: ?...注意,在所有参数,values、index、columns最为关键,它们分别对应excel透视的值、行、列: ?...参数aggfunc对应excel透视的值汇总方式,但比excel的聚合方式更丰富: ? 如何使用pivot_table? 下面拿数据练一练,示例数据如下: ?

    2.8K40

    pandas中使用数据透视

    经常做报表的小伙伴对数据透视应该不陌生,excel利用透视可以快速地进行分类汇总,自由组合字段聚合计算,而这些只需要拖拉拽就能实现。...pandas作为编程领域最强大的数据分析工具之一,自然也有透视的功能。 pandas,透视操作由pivot_table()函数实现,不要小看只是一个函数,但却可以玩转数据,解决大麻烦。...pivot_table使用方法: pandas.pivot_table(*data*, *values=None*, *index=None*, *columns=None*, *aggfunc='mean...values、index、columns最为关键,它们分别对应excel透视的值、行、列: 参数aggfunc对应excel透视的值汇总方式,但比excel的聚合方式更丰富: 如何使用pivot_table...首先导入数据: data = pd.read_excel("E:\\订单数据.xlsx") data.head() 接下来使用透视做分析: 计算每个州销售总额和利润总额 result1 = pd.pivot_table

    3K20

    我们为什么MySQL几乎不使用分区

    Oracle使用分区是一种很自然的事情,数据库容量基本都是500G起,大小5T以上都是很常见的。...但是MySQL的使用,我们几乎不使用分区,今天有同学群里一起沟通,我就按照我的理解做了梳理。...我觉得主要是使用模式的差异,我们不使用的主要原因是避免单库存储过大,而且分区变更相对会比较麻烦,MySQL侧,我们的目标是让数据库更小巧轻量一些,可能更偏TP一些,我们目前是排除了分区的设计,而且也明确写进了开发规范...,如果按照数据类型来说,状态,流水表和配置,这三种类型也就只有流水日志的数据都是建议使用周期的形式进行存储,方便随时扩展,结构变更也方便T+1的变更模式 在这个基础上,可以把这个问题转化为,...是使用分区还是单来存储数据?

    1.6K50

    Excel,如何根据值求出其的坐标

    使用excel的过程,我们知道,根据一个坐标我们很容易直接找到当前坐标的值,但是如果知道一个坐标里的值,反过来求该点的坐标的话,据我所知,excel没有提供现成的函数供使用,所以需要自己用VBA编写函数使用...(代码来自互联网) Excel,ALT+F11打开VBA编辑环境,左边的“工程”处添加一个模块 把下列代码复制进去,然后关闭编辑器 Public Function iSeek(iRng As Range...False): Exit For Next If iAdd = "" Then iSeek = "#无" Else iSeek = iAdd End Function 然后即可在excel的表格编辑器中使用函数...iSeek了,从以上的代码可以看出,iSeek函数带三个参数,其中第一个和第二个参数制定搜索的范围,第三个参数指定搜索的内容,例如 iSeek(A1:P200,20),即可在A1与P200围成的二维数据搜索值

    8.8K20

    哈希iOS的应用

    记录的存储位置=f(关键字) 这里的对应关系f称为哈希函数(散列函数),采用散列技术将记录存储一块连续的存储空间中,这块连续存储空间称为散列表或哈希(Hash table)。...,也需要很快的计算出对应的位置 哈希函数常用设计 1.直接定址法:哈希函数为线性函数,eg: f(k)=ak+b,a和b为常数 2.平方取中法:将关键字平方以后取中间几位 3.折叠法:先按照一定规则拆分再组合...解决冲突的常用方法: 1.开放定址法:使用某种探查(亦称探测)技术散列表寻找下一个空的散列地址,只要散列表足够大,空的散列地址总能找到。...,向后查找即可 image.png 哈希OC的应用 NSDictionary 1.使用 hash来实现key和value之间的映射和存储 2.字典的key需要遵循NSCopying协议,重写hash...2、将包含在记录的所有附有 weak修饰符变量的地址,赋值为nil 3、将weak该记录删除 4、从引用计数表删除废弃对象的地址为键值的记录 APP签名,MD5加密 作者:Olivia_S

    2.1K21

    Log引擎ClickHouse的实现

    数据存储方式Log引擎将数据按照追加顺序写入日志文件,而不是直接写入磁盘的数据文件。每个日志文件有固定大小限制,一旦写满,则生成一个新的日志文件。...写入过程当数据写入Log时,ClickHouse首先将数据追加写入当前活跃的日志文件。如果当前活跃的日志文件已满,则生成一个新的日志文件,并将新的数据写入其中。...与MergeTree引擎的差异虽然Log引擎和MergeTree引擎都可以处理追加写入的场景,但两者在数据存储和查询方面存在一些差异。...MergeTree引擎写入数据时,会根据指定的主键进行排序和聚合,并将数据写入多个数据文件,以实现更高效的查询。查询性能:Log引擎的查询性能相对较低。...总结来说,Log引擎适用于需要高性能追加写入的场景,而MergeTree引擎适用于较为复杂的分析查询场景。

    35781

    快速Python实现数据透视

    这条推文很有趣,我能理解,因为一开始,它们可能会令人困惑,尤其是excel。但是不用害怕,数据透视非常棒,Python,它们非常快速和简单。数据透视是数据科学中一种方便的工具。...让我们快速地看一下这个过程,结束的时候,我们会消除对数据透视的恐惧。 PART 02 什么是数据透视? 数据透视是一种对数据进行重新排列或“透视”以总结某些信息的技术。...PART 06 使用Pandas做一个透视 Pandas库是Python任何类型的数据操作和分析的主要工具。...成熟游戏在这些类别很少有暴力元素,青少年游戏也有一些这种类型的暴力元素,但比“E+10”级别的游戏要少。 PART 07 用条形图可视化数据透视 数据透视几秒钟内就给了我们一些快速的信息。...排列作为一个快捷方式,y轴上做10个滴答声,从0开始,以0.1增量递增。我们创建的数据透视实际上是一个DataFrame,它允许我们调用plot。条形法。如果我们不指定x轴上的值,则使用索引。

    3K20
    领券