如何将 Onpressed 函数添加到列表的每个值

Question

我在将列表中的项目导航到新的 .dart 文件时遇到了困难，这是我导入的第二个文件的主页

class Home extends StatefulWidget {
  @override
  _HomeState createState() => new _HomeState();
}
class _HomeState extends State<Home> {
  final List<String>listof=["Decimal Numbers","Binary Numbers","Decimal-to-Binary Conversion","Binary Arithmetic","Complements of Binary Numbers","Signed Numbers","Arithmetic Operations with Signed Numbers","Hexadecimal Numbers","Octal Numbers","Binary Coded Decimal (BCD)"];

    @override
      Widget build(BuildContext context) {
        return new Scaffold(
           appBar: new AppBar(
             title: new Text(
               "Computer System Theory",
               style:  new TextStyle(fontSize: 19.0),
             ), 
             backgroundColor: Colors.deepPurple,
          actions: <Widget>[
            new IconButton(
              icon: new Icon(Icons.search),
              onPressed: ()=>debugPrint("Search"),
             ),
          ],
       ),
       body: new Container(
        child: new ListView.builder(
         itemBuilder: (_, int index)=>listDataItem(this.listof[index],),
         itemCount: this.listof.length,

       ),
       ),       
    );
  }
}
    class listDataItem extends StatelessWidget{
      String itemName;
      listDataItem(this.itemName);
      @override
      Widget build(BuildContext context){
        return new Card(
          elevation: 7.0,
          child: new Container(
            margin: EdgeInsets.all(5.0),
            padding: EdgeInsets.all(6.0),
            child: new Row(
              children: <Widget> [
                new CircleAvatar(
                  child: new Text(itemName[0]),
                  backgroundColor: Colors.deepPurple,
                  foregroundColor: Colors.white,
                ),
                new Padding(padding: EdgeInsets.all(8.0)),
                new Text(itemName,style: TextStyle(fontSize: 18.0)),
              ],
            ),
        ),); 
      }
    }

我尝试了这种方法，但我不知道如何将 Onpress 函数添加到列表中的 ITEN，如果我单击列表中的任何值应该将我带到尊重页面，例如 binary.dart

这是我的二进制代码

import 'package:flutter/material.dart';
class Binary extends StatefulWidget {
  @override
  _BinaryState createState() => _BinaryState();
}
class _BinaryState extends State<Binary> {
  @override
  Widget build(BuildContext context) {
    double cWidth = MediaQuery.of(context).size.width*0.8;
    return new Container (
      padding: const EdgeInsets.all(16.0),
      width: cWidth,
      child: new Column (
        children: <Widget>[
          new Text ("Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 Long text 1 ", textAlign: TextAlign.left),
          new Text ("Long Text 2, Long Text 2, Long Text 2, Long Text 2, Long Text 2, Long Text 2, Long Text 2, Long Text 2, Long Text 2, Long Text 2, Long Text 2", textAlign: TextAlign.left),
        ],
      ),
    );
  }
}

Answer 1

您可以使用

InkWell 或 GestureDetector 包装列表项。

示例：在 listDataItem 类的 build 方法中，返回一个Card

用墨水井包裹它。

InkWell(
  onTap: () {
    print('inkwell');
  },
  child: Card(...

Answer 2

我确实在这里说明了代码，希望这有所帮助

class listDataItem extends StatelessWidget{
      final String itemName;
      listDataItem(this.itemName);
      @override
      Widget build(BuildContext context){
        return InkWell(
        onTap: () {
        },
        child : Card(
          elevation: 7.0,
          child: new Container(
            margin: EdgeInsets.all(5.0),
            padding: EdgeInsets.all(6.0),
            child: new Row(
              children: <Widget> [
                new CircleAvatar(
                  child: new Text(itemName[0]),
                  backgroundColor: Colors.deepPurple,
                  foregroundColor: Colors.white,
                ),
                new Padding(padding: EdgeInsets.all(8.0)),
                new Text(itemName,style: TextStyle(fontSize: 18.0)),
              ],
            ),
        ),),
        ); 
    }
}