如何为列表视图中的按钮列表分配索引？

Question

Widget inEngTaskBody(BuildContext context) {

return ListView(
scrollDirection: Axis.vertical,
children: <Widget>[

  Center(
    child: Text(
      'General Condition',
      style: TextStyle(
        decoration: TextDecoration.underline,
        fontSize: 25,
      ),
    ), //Text
  ), // Center

  OutlinedButton(
    child: Text(inEngTaskList().genCond[0]),
    onPressed: () {},
  ), //GCbutton1
  SizedBox(height: 10),

  OutlinedButton(
    child: Text(inEngTaskList().genCond[1]),
    onPressed: () {},
  ), //GCbutton2
  SizedBox(height: 10),

  OutlinedButton(
    child: Text(inEngTaskList().genCond[2]),
    onPressed: () {},
  ), //GCbutton3
  SizedBox(height: 10),

如何为每个按钮分配索引？正在考虑使用scrolltoindex() 函数。我已经看到很多使用listview.builder 的示例，但是，我正在制作自定义列表视图。我不打算使用构建器，因为每个按钮在onpressed() 上都有特定的任务。许多示例都是非按钮列表视图。

感谢您的帮助。

此代码将分配给

body: inEngTask(context)

在我的main.dart.

使用 Bernard Hur 的建议：

我正在努力实现的目标。

编辑 每个按钮中的文本都存储在一个列表中。如果我可以索引每个按钮，我可以创建一个搜索栏来与列表进行比较并滚动到按钮的索引。但是，我确实需要一些文本作为某些按钮的标题，因此循环 listview.builder 是一个挑战。

Answer 1

我不确定您想要自动滚动列表视图还是仅通过索引构建的列表视图。下面是index制作的listview。

ListView.builder(
  itemCount: inEngTaskList().length,
  itemBuilder: (context, index) {
  final String text = inEngTaskList().genCond[index] as String;

  return Column(
    children: [
      const Center(
      child: Text(
        'General Condition',
        style: TextStyle(
        decoration: TextDecoration.underline,
        fontSize: 25,
        ),
       ), //Text
      ), // Center

      OutlinedButton(
        child: Text(text),
        onPressed: () {},
      ),
      const SizedBox(height: 10),

      ],
    );
   },
  );

Answer 2

尝试使用基于索引的条件 ..!!

 ListView.builder(
            itemCount: 8,
            itemBuilder: (context, index) {
              if (index == 0) {
                return Container(
                  child: Text('Text$index'),
                );
              }
              if (index == 1) {
                return Container(
                  child: Text('Text$index'),
                );
              }
              if (index == 2) {
                return Container(
                  child: Text('Text$index'),
                );
              }
              if (index == 3) {
                return Container(
                  child: Text('Text$index'),
                );
              }
              if (index == 4) {
                return Container(
                  child: Text('Text$index'),
                );
              }
              if (index == 5) {
                return Container(
                  child: Text('Text$index'),
                );
              }
              if (index == 6) {
                return Container(
                  child: Text('Text$index'),
                );
              }
              if (index == 7) {
                return Container(
                  child: Text('Text$index'),
                );
              } else {
                return Container(
                  child: Text('Text'),
                );
              }
            },
          ),

Answer 3

您可以使用ListView.builder 代替ListView(children:...) 版本如下：

ListView.builder(
  padding: const EdgeInsets.all(8),
  itemCount: NumberOfButtons, // for example 3
  itemBuilder: (BuildContext context, int index) {
    return Column(
      children:[
         Text("your header"),
         // you can add other widgets as well
         OutlinedButton(
            child: Text(inEngTaskList().genCond[index]),
            onPressed: ()=>mainFunction(index),
         ), 
      ]
    );
  }
);

更多示例请参见 [this][1]。此外，关于主要功能，您有两个选择：

1. 拥有像functionList 这样的函数列表，并根据列表视图中项目的索引onClick:functionList[index] 使用它们。
2. 或使用mainFunction，它根据给定的index 决定操作，如上面的示例。您可以基于此函数处理不同的事件：

void mainFunction(int index){
   if(index==0){//do sth}
   else if(index==1){//do sth else}
   // and so on...
}


  [1]: https://api.flutter.dev/flutter/widgets/ListView-class.html