我在字母列表上写了一个迭代,并使用"map"类将卡片放在屏幕上.

在代码中你可以看到我做了一行,并使用" map "将所有的用户板打印到了屏幕上.我想在里面添加一些逻辑,所以我需要获取元素的id(用于录制事件).

实际上,我希望获得userBoard上的元素的特定索引.

代码:

Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
            Row(
              children: userBoard
                  .map((element) => Stack(children: <Widget>[
                        Align(
                          alignment: Alignment(0, -0.6),
                          child: GestureDetector(
                            onTap: (() {
                              setState(() {
                                // print("element=${element.toString()}");
                                // print("element=${userBoard[element]}");
                              });
                            }),
                            child: SizedBox(
                              width: 40,
                              height: 60,
                              child: Card(
                                  shape: RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(5.0),
                                  ),
                                  child: Center(
                                    child: Text(element,
                                        style: TextStyle(fontSize: 30)),
                                  )),
                            ),
                          ),
                        )
                      ]))
                  .toList(),
            )
          ],
        ),
}

Picture - each card is "element" of the map. I want to get the indexes for the function onTap.

推荐答案

要访问索引,需要使用asMap运算符将列表转换为 map .

Example

final fruitList = ['apple', 'orange', 'mango'];
final fruitMap = fruitList.asMap(); // {0: 'apple', 1: 'orange', 2: 'mango'}

// To access 'orange' use the index 1.
final myFruit = fruitMap[1] // 'orange'

// To convert back to list
final fruitListAgain = fruitMap.values.toList();

Your Code

userBoard.asMap().map((i, element) => MapEntry(i, Stack(
  GestureDetector(onTap: () {
    setState(() {
      // print("element=${element.toString()}");
      // print("element=${userBoard[i].toString()}");
    });
  }),
))).values.toList();

Flutter相关问答推荐

类型flatter doctor get zsh:未找到命令:macO中flatter

在Flutter中创建具有固定行的压缩水平列表

错误:找不到字体功能类型.Ffltter Google_Fonts包错误

如何在应用程序启动时解析和加载JSON文件?

Fighter:基于ChangeNotifier状态动态更新AppBar中的图标

使用现有Map方法对子类克隆方法的逻辑进行Dart标准化

如何手动将 FirebaseAuth 用户邮箱验证状态设置为 true

为什么我的图标的一半在定位小部件中消失了?

构建上下文不能跨异步间隙使用

Flutter:我应该使用哪种应用内购买服务?

Flutter:使用 GlobalKey 访问 BlocProvider

Flutter 中的 Provider 不会在第一次构建 App 时返回

Flutter / 为什么当我点击我的图片时我的模型没有更新?

我怎样才能消除我的 Column 子元素之间的差距?

Listview 如何转到下一行/新行?

在 CircleAvatar 中放置芯片

如何在椭圆形图像周围添加边框?Flutter

Flutter Firestore 数据库排序最近 24 小时内最喜欢的文档

更新未知文档 ID firebase\flutter 中的字段

设计响应式卡片的最佳方法,以避免像素溢出错误或 _AssertionError