草庐IT

flutter - 在 Flutter 中动态地在行和行中列出 <Widgets>

coder 2023-07-22 原文

我有 json:

{
    "name": "Test",
    "groupsCount": 5,
    "groups": [
        {
            "name": "William Cooper",
            "number": 1,
            "linesCount": 2,
            "lines": [
                {
                    "name": "Brittany Ramirez",
                    "number": 1,
                    "placesCount": 15,
                    "places": [
                        {
                            "name": "Elizabeth Welch",
                            "number": 1
                        },
                        {
                            "name": "Bradley Pugh",
                            "number": 2
                        },
                        {
                            "name": "Noah Johnson",
                            "number": 3
                        },
                        {
                            "name": "Laura Cox",
                            "number": 4
                        },
                        {
                            "name": "Tiffany Hatfield",
                            "number": 5
                        },
                        {
                            "name": "Patricia Hayes",
                            "number": 6
                        },
                        {
                            "name": "Kevin Jenkins MD",
                            "number": 7
                        },
                        {
                            "name": "Brent Wilkins",
                            "number": 8
                        },
                        {
                            "name": "Mr. Bruce Hart",
                            "number": 9
                        },
                        {
                            "name": "Courtney Newman",
                            "number": 10
                        },
                        {
                            "name": "Dawn Campbell",
                            "number": 11
                        },
                        {
                            "name": "Ashley Scott",
                            "number": 12
                        },
                        {
                            "name": "Robert Becker",
                            "number": 13
                        },
                        {
                            "name": "Kevin Williams",
                            "number": 14
                        },
                        {
                            "name": "Elizabeth Davidson",
                            "number": 15
                        }
                    ]
                },
                {
                    "name": "Carol Watson",
                    "number": 2,
                    "placesCount": 12,
                    "places": [
                        {
                            "name": "Kathleen Jones",
                            "number": 16
                        },
                        {
                            "name": "Robin Smith",
                            "number": 17
                        },
                        {
                            "name": "David Johnson",
                            "number": 18
                        },
                        {
                            "name": "Richard Boyd",
                            "number": 19
                        },
                        {
                            "name": "Mason Randolph",
                            "number": 20
                        },
                        {
                            "name": "James Bernard",
                            "number": 21
                        },
                        {
                            "name": "Timothy Miller",
                            "number": 22
                        },
                        {
                            "name": "Thomas Stone",
                            "number": 23
                        },
                        {
                            "name": "Steven Jones",
                            "number": 24
                        },
                        {
                            "name": "William Hernandez",
                            "number": 25
                        },
                        {
                            "name": "Joy Duarte",
                            "number": 26
                        },
                        {
                            "name": "Justin Anderson",
                            "number": 27
                        }
                    ]
                }
            ]
        },
        {
            "name": "Sarah Jordan",
            "number": 2,
            "linesCount": 1,
            "lines": [
                {
                    "name": "Lacey Estrada",
                    "number": 3,
                    "placesCount": 15,
                    "places": [
                        {
                            "name": "Madison Smith",
                            "number": 28
                        },
                        {
                            "name": "Kathleen Wells",
                            "number": 29
                        },
                        {
                            "name": "Dale Gross",
                            "number": 30
                        },
                        {
                            "name": "Brandy Cabrera",
                            "number": 31
                        },
                        {
                            "name": "Ashley Torres",
                            "number": 32
                        },
                        {
                            "name": "Ralph Long",
                            "number": 33
                        },
                        {
                            "name": "Christopher Walker",
                            "number": 34
                        },
                        {
                            "name": "Kimberly Moore",
                            "number": 35
                        },
                        {
                            "name": "Andrea Ortiz",
                            "number": 36
                        },
                        {
                            "name": "Heidi Todd",
                            "number": 37
                        },
                        {
                            "name": "Austin Wang",
                            "number": 38
                        },
                        {
                            "name": "Bryan Adams",
                            "number": 39
                        },
                        {
                            "name": "Jeffrey Alvarado",
                            "number": 40
                        },
                        {
                            "name": "Richard Morrison",
                            "number": 41
                        },
                        {
                            "name": "Jennifer Hodge",
                            "number": 42
                        }
                    ]
                }
            ]
        },
        {
            "name": "Tiffany Lynch",
            "number": 3,
            "linesCount": 1,
            "lines": [
                {
                    "name": "Kimberly Howe DVM",
                    "number": 4,
                    "placesCount": 15,
                    "places": [
                        {
                            "name": "Nancy King",
                            "number": 43
                        },
                        {
                            "name": "Angela Cabrera",
                            "number": 44
                        },
                        {
                            "name": "Elizabeth Mack",
                            "number": 45
                        },
                        {
                            "name": "Shelly Riggs",
                            "number": 46
                        },
                        {
                            "name": "Jeremy French",
                            "number": 47
                        },
                        {
                            "name": "Deborah Myers",
                            "number": 48
                        },
                        {
                            "name": "Robert Kramer",
                            "number": 49
                        },
                        {
                            "name": "Brian Cunningham MD",
                            "number": 50
                        },
                        {
                            "name": "Christopher Brown",
                            "number": 51
                        },
                        {
                            "name": "Kathryn James",
                            "number": 52
                        },
                        {
                            "name": "Cassandra Martinez",
                            "number": 53
                        },
                        {
                            "name": "Nathan Long",
                            "number": 54
                        },
                        {
                            "name": "Molly Wilson",
                            "number": 55
                        },
                        {
                            "name": "Matthew Reilly",
                            "number": 56
                        },
                        {
                            "name": "Erin Maddox",
                            "number": 57
                        }
                    ]
                }
            ]
        },
        {
            "name": "Christopher Martin",
            "number": 4,
            "linesCount": 1,
            "lines": [
                {
                    "name": "Gina Brewer",
                    "number": 5,
                    "placesCount": 13,
                    "places": [
                        {
                            "name": "Dennis Owens",
                            "number": 58
                        },
                        {
                            "name": "Rebecca Caldwell",
                            "number": 59
                        },
                        {
                            "name": "James Mckinney",
                            "number": 60
                        },
                        {
                            "name": "Donna Lee",
                            "number": 61
                        },
                        {
                            "name": "Michelle Martinez",
                            "number": 62
                        },
                        {
                            "name": "Jennifer Davis",
                            "number": 63
                        },
                        {
                            "name": "Shawn Moore",
                            "number": 64
                        },
                        {
                            "name": "Jeremiah Reilly",
                            "number": 65
                        },
                        {
                            "name": "Bruce Mendoza",
                            "number": 66
                        },
                        {
                            "name": "Juan Weaver",
                            "number": 67
                        },
                        {
                            "name": "Brian Bates",
                            "number": 68
                        },
                        {
                            "name": "Caitlin Jenkins",
                            "number": 69
                        },
                        {
                            "name": "Rachel Thomas",
                            "number": 70
                        }
                    ]
                }
            ]
        },
        {
            "name": "Michelle Thompson",
            "number": 5,
            "linesCount": 2,
            "lines": [
                {
                    "name": "Kathleen Hall",
                    "number": 6,
                    "placesCount": 12,
                    "places": [
                        {
                            "name": "Jennifer Vaughan",
                            "number": 71
                        },
                        {
                            "name": "Glenn Mayer",
                            "number": 72
                        },
                        {
                            "name": "Allison Coleman",
                            "number": 73
                        },
                        {
                            "name": "Brittany Harris",
                            "number": 74
                        },
                        {
                            "name": "John Mccullough",
                            "number": 75
                        },
                        {
                            "name": "James Curtis",
                            "number": 76
                        },
                        {
                            "name": "John Smith",
                            "number": 77
                        },
                        {
                            "name": "Alison Morales",
                            "number": 78
                        },
                        {
                            "name": "Matthew Jones",
                            "number": 79
                        },
                        {
                            "name": "Jessica Watson",
                            "number": 80
                        },
                        {
                            "name": "Yvonne Anderson",
                            "number": 81
                        },
                        {
                            "name": "David Price",
                            "number": 82
                        }
                    ]
                },
                {
                    "name": "Sarah White",
                    "number": 7,
                    "placesCount": 10,
                    "places": [
                        {
                            "name": "Kathleen Owen",
                            "number": 83
                        },
                        {
                            "name": "Amy Strickland",
                            "number": 84
                        },
                        {
                            "name": "James Collier",
                            "number": 85
                        },
                        {
                            "name": "Keith Smith Jr.",
                            "number": 86
                        },
                        {
                            "name": "Christopher York",
                            "number": 87
                        },
                        {
                            "name": "Patricia Todd",
                            "number": 88
                        },
                        {
                            "name": "Matthew Harris",
                            "number": 89
                        },
                        {
                            "name": "Betty Mckee",
                            "number": 90
                        },
                        {
                            "name": "Kayla Hahn",
                            "number": 91
                        },
                        {
                            "name": "Craig Duncan",
                            "number": 92
                        }
                    ]
                }
            ]
        }
    ]
}

我想使用线条和位置来构建 View 。因此,如果组有 2 行并且每行有 15 个位置,我想构建类似的东西:

...............
...............

这是我的代码:

    import 'package:flutter/material.dart';
import 'package:parking/models/groups.dart';
import 'package:parking/models/parking_group.dart';
import 'package:parking/services/parking_service.dart';

class ParkingDetailsScreen extends StatefulWidget {

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

class ParkingDetailsState extends State<ParkingDetailsScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("Parking Details"),
        ),
        body: FutureBuilder<ParkingGroup>(
          future: ParkingService.getParking(),
          builder: (context, snapshot) {
            if (snapshot.hasError) print(snapshot.error);

            return snapshot.hasData
                ? _buildParking(snapshot.data)
                : Center(child: CircularProgressIndicator());
          },
        )
    );
  }

}

final _parkings = <Groups>[];

Widget _buildParking(ParkingGroup parkingGroup) {
  _parkings.clear();
  _parkings.addAll(parkingGroup.groups);

  return ListView.builder(
    itemCount: _parkings.length,
    itemBuilder: (context, index) {
      return _buildRow(_parkings[index], context);
    },
  );
}

Widget _buildRow(Groups parkingGroup, BuildContext context) {
  return Container(
    padding: const EdgeInsets.all(16.0),
    child: Row(
      children: _buildRowList(parkingGroup),
    ),
  );
}

List<Widget> _buildRowList(Groups parkingGroup) {
  List<Widget> places = [];
  for (var place in parkingGroup.lines) {
    for (var placeLine in place.places) {
      places.add(_buildPlace(placeLine));
    }
  }
  return places;
}

Widget _buildPlace(place) {
  return Container(
    padding: const EdgeInsets.only(bottom: 8.0),
    child:
    SizedBox(
      height: 5,
      width: 5,
      child: DecoratedBox(
          decoration: BoxDecoration(
            border: Border.all(color: Colors.blueAccent),
          )),
    ),
  );
}
//
//Widget _buildRow(Groups parkingGroup, BuildContext context) {
//  return Container(
//      padding: const EdgeInsets.all(16.0),
//      child: Row(
//        children: [
//          Container(
//            padding: const EdgeInsets.only(bottom: 8.0),
//            child:
//            SizedBox(
//              height: 30,
//              width: 30,
//              child: DecoratedBox(
//                  decoration: BoxDecoration(
//                border: Border.all(color: Colors.blueAccent),
//              )),
//            ),
//          ),
//        ],
//      ),
//    );
//}

但是对于这段代码,我在一行中看到了所有地方:

..............................

代替

   ...............
   ...............

我需要在我的代码中更改什么才能获得好的结果?

最佳答案

您需要更改 _buildRow() 和 _buildRowList() 方法:

Widget _buildRow(Groups parkingGroup, BuildContext context) {
  return Container(
    padding: const EdgeInsets.all(16.0),
    child: Column( // As you expect multiple lines you need a column not a row
      children: _buildRowList(parkingGroup),
    ),
  );
}

List<Widget> _buildRowList(Groups parkingGroup) {
  List<Widget> lines = []; // this will hold Rows according to available lines
  for (var line in parkingGroup.lines) {    
    List<Widget> placesForLine = [] // this will hold the places for each line
    for (var placeLine in line.places) {
      placesForLine.add(_buildPlace(placeLine));
    }
    lines.add(Row(children: placesForLine));
  }
  return lines;
}

关于flutter - 在 Flutter 中动态地在行和行中列出 <Widgets>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55023772/

有关flutter - 在 Flutter 中动态地在行和行中列出 <Widgets>的更多相关文章

  1. ruby-on-rails - 如何从 format.xml 中删除 <hash></hash> - 2

    我有一个对象has_many应呈现为xml的子对象。这不是问题。我的问题是我创建了一个Hash包含此数据,就像解析器需要它一样。但是rails自动将整个文件包含在.........我需要摆脱type="array"和我该如何处理?我没有在文档中找到任何内容。 最佳答案 我遇到了同样的问题;这是我的XML:我在用这个:entries.to_xml将散列数据转换为XML,但这会将条目的数据包装到中所以我修改了:entries.to_xml(root:"Contacts")但这仍然将转换后的XML包装在“联系人”中,将我的XML代码修改为

  2. ruby-on-rails - rspec should have_select ('cars' , :options => ['volvo' , 'saab' ] 不工作 - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗?通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion在首页我有:汽车:VolvoSaabMercedesAudistatic_pages_spec.rb中的测试代码:it"shouldhavetherightselect"dovisithome_pathit{shouldhave_select('cars',:options=>['volvo','saab','mercedes','audi'])}end响应是rspec./spec/request

  3. ruby-on-rails - Nokogiri:使用 XPath 搜索 <div> - 2

    我使用Nokogiri(Rubygem)css搜索寻找某些在我的html里面。看起来Nokogiri的css搜索不喜欢正则表达式。我想切换到Nokogiri的xpath搜索,因为这似乎支持搜索字符串中的正则表达式。如何在xpath搜索中实现下面提到的(伪)css搜索?require'rubygems'require'nokogiri'value=Nokogiri::HTML.parse(ABBlaCD3"HTML_END#my_blockisgivenmy_bl="1"#my_eqcorrespondstothisregexmy_eq="\/[0-9]+\/"#FIXMEThefoll

  4. ruby-on-rails - 没有参数的 `<<`(小于两倍)是什么意思? - 2

    我在一个我想在formtasticGem中覆盖的方法中找到了这个。该方法如下所示:defto_htmlinput_wrappingdohidden_field_html是什么意思?在第三行做什么?我知道它对数组有什么作用,但在这里我不知道。 最佳答案 你可以这样读:hidden_field_htmllabel_with_nested_checkbox是连接到hidden_​​field_html末尾的参数-为了“清晰”,他们将其分成两行 关于ruby-on-rails-没有参数的`

  5. ruby-on-rails - 找不到 gem railties (>= 0.a) (Gem::GemNotFoundException) - 2

    我已经看到了一些其他的问题,尝试了他们的建议,但没有一个对我有用。我已经使用Rails大约一年了,刚刚开始一个新的Rails项目,突然遇到了问题。我卸载并尝试重新安装所有Ruby和Rails。Ruby很好,但Rails不行。当我输入railss时,我得到了can'tfindgemrailties。我当前的Ruby版本是ruby2.2.2p95(2015-04-13修订版50295)[x86_64-darwin15],尽管我一直在尝试通过rbenv设置ruby​​2.3.0。如果我尝试rails-v查看我正在运行的版本,我会得到同样的错误。我使用的是MacOSXElCapitan版本10

  6. ruby - 在 Ruby 中动态创建数组 - 2

    有没有办法在Ruby中动态创建数组?例如,假设我想遍历用户输入的书籍数组:books=gets.chomp用户输入:"TheGreatGatsby,CrimeandPunishment,Dracula,Fahrenheit451,PrideandPrejudice,SenseandSensibility,Slaughterhouse-Five,TheAdventuresofHuckleberryFinn"我把它变成一个数组:books_array=books.split(",")现在,对于用户输入的每一本书,我想用Ruby创建一个数组。伪代码来做到这一点:x=0books_array.

  7. ruby - 是否可以将 IRB 提示配置为动态更改? - 2

    我想在IRB中浏览文件系统并让提示更改以反射(reflect)当前工作目录,但我不知道如何在每个命令后进行提示更新。最终,我想在日常工作中更多地使用IRB,让bash溜走。我在我的.irbrc中试过这个:require'fileutils'includeFileUtilsIRB.conf[:PROMPT][:CUSTOM]={:PROMPT_N=>"\e[1m:\e[m",:PROMPT_I=>"\e[1m#{pwd}>\e[m",:PROMPT_S=>"FOO",:PROMPT_C=>"\e[1m#{pwd}>\e[m",:RETURN=>""}IRB.conf[:PROMPT_MO

  8. ruby-on-rails - 连接字符串时如何在 <%=%> block 内输出 html_safe? - 2

    考虑一下:现在这些情况:#output:http://domain.com/?foo=1&bar=2#output:http://domain.com/?foo=1&bar=2#output:http://domain.com/?foo=1&bar=2#output:http://domain.com/?foo=1&bar=2我需要用其他字符串输出URL。我如何保证&符号不会被转义?由于我无法控制的原因,我无法发送&。求助!把我的头发拉到这里:\编辑:为了澄清,我实际上有一个像这样的数组:@images=[{:id=>"fooid",:url=>"http://

  9. Ruby -> 写入二维数组 - 2

    我正在处理http://prepwork.appacademy.io/mini-curriculum/array/中概述的数组问题我正在尝试创建函数my_transpose,它接受一个矩阵并返回其转置。我对写入二维数组感到很困惑!这是一个代码片段,突出了我的困惑。rows=[[0,1,2],[3,4,5],[6,7,8]]columns=Array.new(3,Array.new(3))putscolumns.to_s#Outputisa3x3arrayfilledwithnilcolumns[0][0]=0putscolumns.to_s#Outputis[[0,nil,nil],[

  10. ruby-on-rails - carrierwave:在序列化动态属性上安装 uploader - 2

    首先,我使用的是rails3.1.3和来自master的carrierwavegithub仓库的分支。我使用after_init钩子(Hook)来确定基于属性的字段页面模型实例并为这些字段定义属性访问器将值存储在序列化哈希中(希望它清楚我是什么谈论)。这是我正在做的事情的精简版:classPage省略mount_uploader命令让我可以访问我想要的属性。但是当我安装uploader时出现错误消息说“nil类的未定义新方法”我在源代码中读到有方法read_uploader和扩展模块中的write_uploader。我如何必须覆盖这些来制作mount_uploader命令使用我的“虚拟

随机推荐