实现ListTile时颤振死代码Listview

Question

I would like to implement onTap in my ListView so I also need to implement return ListTile but I have a dead code on my ListTile snippet.

I would like to know why and how to resolve it.

There is my code :

  @override
  Widget build(BuildContext context) {
    return ListView.separated(
        itemBuilder: (context, index) {
          var len = tasks.length;
          debugPrint("lenght: $len and index: $index");
          if(tasks.length - 1 == index) {
            _loadData(index);
            return Container(
                alignment: Alignment.center,
                padding: EdgeInsets.all(16.0),
                child: SizedBox(
                  width: 24.0,
                  height: 24.0,
                  child: CircularProgressIndicator(strokeWidth: 2.0),
                )
            );
          }
          else {
            var item = tasks[index];
            return Padding(
              padding: EdgeInsets.all(8.0),
              child: Column(
                children: <Widget>[
                  Row(
                    children: <Widget>[
                      getDotWidgetByType(item.taskStatus),
                      new Container(
                        padding: EdgeInsets.symmetric(horizontal: 8.0),
                        child: new Text(
                          item.taskTitle,
                          style: new TextStyle(
                            color: Colors.black,
                            fontSize: 18,
                          ),
                        ),
                      ),
                      getStatusTextByType(item.taskStatus)
                    ],
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 4.0),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        Text(item.taskLeader),
                        Text(item.taskDeadLine),
                        IconButton(
                          onPressed: (){
                            //Todo change priorities/and status
                          },
                        icon: Icon(Icons.gps_fixed))
                      ],
                    ),
                  )
                ],
              ),
            );
          }            
          // DEAD CODE FROM HERE
          return ListTile(
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => SingleTaskPage(taskItem: tasks[index]),
                ),
              );
            },
          );
          //TO HERE
        },
        separatorBuilder: (context, index) => Divider(height: 0.0),
        itemCount: tasks.length
    );
  }

Maybe there is another way to implement onTap but I have not find it.

My snippet of ListTile come from : https://flutter.dev/docs/cookbook/navigation/passing-data

EDIT : I have this current UI : I can totally change my code while I keep this UI. My current problem is: I want to implement onTap() but I cannot with my current code logic.

Answer 1

If your dead code simply is there for the onTap behaviour you could instead wrap the above within a GestureDetector .

@override
Widget build(BuildContext context) {
  return ListView.separated(
      itemBuilder: (context, index) {
        var len = tasks.length;
        debugPrint("lenght: $len and index: $index");
        if(tasks.length - 1 == index) {
          _loadData(index);
          return Container(
              alignment: Alignment.center,
              padding: EdgeInsets.all(16.0),
              child: SizedBox(
                width: 24.0,
                height: 24.0,
                child: CircularProgressIndicator(strokeWidth: 2.0),
              )
          );
        }
        else {
          var item = tasks[index];
          return GestureDetector(
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => SingleTaskPage(taskItem: tasks[index]),
                ),
              );
            },
            child: Padding(
              padding: EdgeInsets.all(8.0),
              child: Column(
                children: <Widget>[
                  Row(
                    children: <Widget>[
                      getDotWidgetByType(item.taskStatus),
                      new Container(
                        padding: EdgeInsets.symmetric(horizontal: 8.0),
                        child: new Text(
                          item.taskTitle,
                          style: new TextStyle(
                            color: Colors.black,
                            fontSize: 18,
                          ),
                        ),
                      ),
                      getStatusTextByType(item.taskStatus)
                    ],
                  ),
                  Container(
                    margin: EdgeInsets.only(top: 4.0),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        Text(item.taskLeader),
                        Text(item.taskDeadLine),
                        IconButton(
                            onPressed: (){
                              //Todo change priorities/and status
                            },
                            icon: Icon(Icons.gps_fixed))
                      ],
                    ),
                  )
                ],
              ),
            ),
          );
        }
      },
      separatorBuilder: (context, index) => Divider(height: 0.0),
      itemCount: tasks.length
  );
}