【问题标题】:How to access specific cell in generated List from grid view count in Flutter?如何从 Flutter 中的网格视图计数访问生成列表中的特定单元格?
【发布时间】:2022-01-11 10:46:00
【问题描述】:

这里,我有一个清单。我想在我的 GridView.count 中访问该列表中的特定位置。

就像我有一个列表,a = [133, 118, 117, 116, 115, 114];

我想弄清楚,在我生成 225 个单元格的 List.generate 中,我如何访问存储在此列表中的单元格,a = [133, 118, 117, 116, 115, 114] ;就像我想从 225 个单元格中访问该列表的第 4 项 (116)。

                     a = [133, 118, 117, 116, 115, 114];

                          child: GridView.count(
                            crossAxisCount: 15,
                            childAspectRatio: 1,
                            children: List<Widget>.generate(
                              225,
                              (index) {
                                return Stack(
                                  children: [
                                    GridTile(
                                      child: Container(
                                        decoration: BoxDecoration(
                                          borderRadius:
                                              BorderRadius.circular(5),
                                          border:
                                              Border.all(color: Colors.black),
                                        ),
                                      ),
                                    ),
                                  ],
                                );
                              },
                            ),
                          ),

【问题讨论】:

    标签: android flutter flutter-layout flutter-gridview flutter-layoutbuilder


    【解决方案1】:

    这是一个解决方案,通过传入您要查找的内容的索引并将其与单元格的索引匹配(如下面的代码所示):

    import 'package:flutter/material.dart';
    
    class GridExample extends StatefulWidget {
      const GridExample({Key? key}) : super(key: key);
    
      @override
      _GridExampleState createState() => _GridExampleState();
    }
    
    class _GridExampleState extends State<GridExample> {
      final a = [133, 118, 117, 116, 115, 114];
    
      @override
      Widget build(BuildContext context) {
        return Container(
          child: GridView.count(
            crossAxisCount: 15,
            childAspectRatio: 1,
            children: List<Widget>.generate(
              225,
              (index) {
                return Stack(
                  children: [
                    GridTile(
                      child: Tile(
                        index: index,
                        accessedCell: a[3],
                      ),
                    ),
                  ],
                );
              },
            ),
          ),
        );
      }
    }
    
    class Tile extends StatefulWidget {
      Tile({
        required this.index,
        required this.accessedCell,
        Key? key,
      }) : super(key: key);
    
      final int index;
      final int accessedCell;
    
      @override
      State<Tile> createState() => _TileState();
    }
    
    class _TileState extends State<Tile> {
      bool _isAccessed = false;
    
      @override
      Widget build(BuildContext context) {
        print(widget.accessedCell);
        print(widget.index);
    
        if (widget.accessedCell == widget.index) {
          _isAccessed = true;
        }
    
        return Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(5),
            border: Border.all(color: _isAccessed ? Colors.blue : Colors.red),
          ),
          child:
              FittedBox(fit: BoxFit.contain, child: Text(widget.index.toString())),
        );
      }
    }
    
    

    【讨论】:

    • 感谢您这么快回答。这是我的错误,我必须更具体地问这个问题。我想弄清楚,在我的 List.generate 中,我生成了 225 个单元格,如何访问存储在此列表中的单元格,a = [133, 118, 117, 116, 115, 114] ;就像我想从 225 个单元格中访问该列表的第 4 项(116)。
    • 好的,谢谢,是的,我想我现在明白了。我已经更新了我的答案:例如,要查找列表中“113”索引的值(例如 a[3]),您可以传递该索引并按照示例进行匹配。请注意,如果匹配,我将边框更改为蓝色以突出显示。您还可以传入一个值列表以一次匹配多个单元格。希望对您有所帮助,谢谢。
    猜你喜欢
    • 2011-11-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-04-09
    • 1970-01-01
    • 1970-01-01
    • 2021-02-27
    相关资源
    最近更新 更多