Flutter - 用动态数据填充表格

coder 2023-07-22 原文

在我的类(class)中，我有一个名为report 的变量，它看起来像这样:

{
    "id": 1,
    "type": "my type",
    "name": "Report 1",
    "client_name": "John",
    "website": "john.com",
    "creation_time": "2019-03-12T22:00:00.000Z",
    "items": [{
            "id": 1,
            "report_id": 1,
            "place": "Kitchen",
            "type": "sometype",
            "producer": "somepro",
            "serial_number": "123123",
            "next_check_date": "2019-03-19",
            "test_result": "Verified",
            "comments": "some comments"
        }]
    }

我想用 flutter 在表格中显示 items 的列表。

到目前为止，我只是创建了一个静态表，如下所示:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(report['name'])),
      body: Container(
        child: Table(children: [
                  TableRow(children: [
                    Text("TITLE 1"),
                    Text("TITLE 2"),
                    Text("TITLE 3"),
                  ]),
                  TableRow(children: [
                    Text("C1"),
                    Text("C2"),
                    Text("C3"),
                  ])
        ])
      )
    );
  }
}

找不到任何有关如何使用我的 JSON items 列表填充表格行(标题可以保持静态)的示例。每行应该是 items JSON 数组中的一个项目。

有什么想法吗？

最佳答案

您可以将 items 映射到 TableRow。不要忘记以 toList() 结尾。

例如:

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(title: Text(report['name'])),
        body: Container(
            child: Table(
                children: (report['items'] as List)
                    .map((item) => TableRow(children: [
                          Text(item['id'].toString()),
                          Text(item['report_id'].toString()),
                          Text(item['place']),
                          // you can have more properties of course
                        ]))
                    .toList())));
  }

如果你想要你提到的静态标题，你可以在你上面创建的列表上使用 insert，然后你有:

  @override
  Widget build(BuildContext context) {
    var list = (report['items'] as List)
        .map((item) => TableRow(children: [
              Text(item['id'].toString()),
              Text(item['report_id'].toString()),
              Text(item['place']),
              //...
            ]))
        .toList();
    list.insert(
        0,
        TableRow(children: [
          Text("TITLE 1"),
          Text("TITLE 2"),
          Text("TITLE 3"),
          //...
        ]));
    return Scaffold(
        appBar: AppBar(title: Text(report['name'])),
        body: Container(child: Table(children: list)));
  }

关于Flutter - 用动态数据填充表格，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55046232/

Flutter 用 34 code Text

有关Flutter - 用动态数据填充表格的更多相关文章

ruby - 什么是填充的 Base64 编码字符串以及如何在 ruby 中生成它们？ - 2
我正在使用的第三方API的文档状态:"[O]urAPIonlyacceptspaddedBase64encodedstrings."什么是“填充的Base64编码字符串”以及如何在Ruby中生成它们。下面的代码是我第一次尝试创建转换为Base64的JSON格式数据。xa=Base64.encode64(a.to_json) 最佳答案他们说的padding其实就是Base64本身的一部分。它是末尾的“=”和“==”。Base64将3个字节的数据包编码为4个编码字符。所以如果你的输入数据有长度n和n%3=1=>"=="末尾用于填充n%
ruby - 解析 RDFa、微数据等的最佳方式是什么，使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2
我主要使用Ruby来执行此操作，但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式，例如使用这个yaml文件，它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i
ruby - 匹配大写字母并用后续字母填充，直到一定的字符串长度 - 2
我有一个驼峰式字符串，例如:JustAString。我想按照以下规则形成长度为4的字符串:抓取所有大写字母；如果超过4个大写字母，只保留前4个；如果少于4个大写字母，则将最后大写字母后的字母大写并添加字母，直到长度变为4。以下是可能发生的3种情况:ThisIsMyString将产生TIMS(大写字母)；ThisIsOneVeryLongString将产生TIOV(前4个大写字母)；MyString将生成MSTR(大写字母+tr大写)。我设法用这个片段解决了前两种情况:str.scan(/[A-Z]/).first(4).join但是，我不太确定如何最好地修改上面的代码片段以处理最后一种
ruby - Ruby 有 `Pair` 数据类型吗？ - 2
有时我需要处理键/值数据。我不喜欢使用数组，因为它们在大小上没有限制(很容易不小心添加超过2个项目，而且您最终需要稍后验证大小)。此外，0和1的索引变成了魔数(MagicNumber)，并且在传达含义方面做得很差(“当我说0时，我的意思是head...”)。散列也不合适，因为可能会不小心添加额外的条目。我写了下面的类来解决这个问题:classPairattr_accessor:head,:taildefinitialize(h,t)@head,@tail=h,tendend它工作得很好并且解决了问题，但我很想知道:Ruby标准库是否已经带有这样一个类？最佳
ruby-on-rails - Prawn - 表格单元格内的链接 - 2
我正在尝试用Prawn生成PDF。在我的PDF模板中，我有带单元格的表格。在其中一个单元格中，我有一个电子邮件地址:cell_email=pdf.make_cell(:content=>booking.user_email,:border_width=>0)我想让电子邮件链接到“mailto”链接。我知道我可以这样链接:pdf.formatted_text([{:text=>booking.user_email,:link=>"mailto:#{booking.user_email}"}])但是将这两行组合起来(将格式化文本作为内容)不起作用:cell_email=pdf.make_c
ruby - 我如何添加二进制数据来遏制 POST - 2
我正在尝试使用Curbgem执行以下POST以解析云curl-XPOST\-H"X-Parse-Application-Id:PARSE_APP_ID"\-H"X-Parse-REST-API-Key:PARSE_API_KEY"\-H"Content-Type:image/jpeg"\--data-binary'@myPicture.jpg'\https://api.parse.com/1/files/pic.jpg用这个:curl=Curl::Easy.new("https://api.parse.com/1/files/lion.jpg")curl.multipart_form_
世界前沿3D开发引擎HOOPS全面讲解——集3D数据读取、3D图形渲染、3D数据发布于一体的全新3D应用开发工具 - 2
无论您是想搭建桌面端、WEB端或者移动端APP应用，HOOPSPlatform组件都可以为您提供弹性的3D集成架构，同时，由工业领域3D技术专家组成的HOOPS技术团队也能为您提供技术支持服务。如果您的客户期望有一种在多个平台（桌面/WEB/APP，而且某些客户端是“瘦”客户端）快速、方便地将数据接入到3D应用系统的解决方案，并且当访问数据时，在各个平台上的性能和用户体验保持一致，HOOPSPlatform将帮助您完成。利用HOOPSPlatform，您可以开发在任何环境下的3D基础应用架构。HOOPSPlatform可以帮您打造3D创新型产品，HOOPSSDK包含的技术有：快速且准确的CAD
FOHEART H1数据手套驱动Optitrack光学动捕双手运动(Unity3D) - 2
本教程将在Unity3D中混合Optitrack与数据手套的数据流，在人体运动的基础上，添加双手手指部分的运动。双手手背的角度仍由Optitrack提供，数据手套提供双手手指的角度。 01 客户端软件分别安装MotiveBody与MotionVenus并校准人体与数据手套。MotiveBodyMotionVenus数据手套使用、校准流程参照：https://gitee.com/foheart_1/foheart-h1-data-summary.git02 数据转发打开MotiveBody软件的Streaming，开始向Unity3D广播数据；MotionVenus中设置->选项选择Unit
使用canal同步MySQL数据到ES - 2
文章目录一、概述简介原理模块二、配置Mysql使用版本环境要求1.操作系统2.mysql要求三、配置canal-server离线下载在线下载上传解压修改配置单机配置集群配置分库分表配置1.修改全局配置2.实例配置垂直分库水平分库3.修改group-instance.xml4.启动监听四、配置canal-adapter1修改启动配置2配置映射文件3启动ES数据同步查询所有订阅同步数据同步开关启动4.验证五、配置canal-admin一、概述简介canal是Alibaba旗下的一款开源项目，Java开发。基于数据库增量日志解析，提供增量数据订阅&消费。Git地址：https://github.co
ruby-on-rails - 创建 ruby 数据库时惰性符号绑定(bind)失败 - 2
我正在尝试在Rails上安装ruby，到目前为止一切都已安装，但是当我尝试使用rakedb:create创建数据库时，我收到一个奇怪的错误:dyld:lazysymbolbindingfailed:Symbolnotfound:_mysql_get_client_infoReferencedfrom:/Library/Ruby/Gems/1.8/gems/mysql2-0.3.11/lib/mysql2/mysql2.bundleExpectedin:flatnamespacedyld:Symbolnotfound:_mysql_get_client_infoReferencedf

Flutter - 用动态数据填充表格

有关Flutter - 用动态数据填充表格的更多相关文章

随机推荐