Flutter Dead code Listview while implementing ListTile

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.

this is because your `itemBuilder` returns either `Container` (if(tasks.length - 1 == index)) or `Padding` (otherwise) — pskink, Apr 16 '19 at 07:06
yes but how can I modify my code to implement the onTap() ? (ListTile or GestudeDetector doesn't matter) @pskink — Itoun, Apr 16 '19 at 07:13
move your `ListTile` into `else` branch - where you return `Padding` — pskink, Apr 16 '19 at 07:32
I just edited my post if you want to see more details @pskink — Itoun, Apr 16 '19 at 07:39

score 1 · Accepted Answer · answered Apr 16 '19 at 07:06

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
  );
}

It's the same, with GestureDetector. it's not about ListTile, it's the code logic which is wrong. After the return of GestureDetector I have a dead code for the rest of my code. — Itoun, Apr 16 '19 at 07:12
Thats because you can only return once per function call. You simply cannot return two Widgets at the same time. — Robin Reiter, Apr 16 '19 at 07:29
so how can I change my code to achieve that while keeping my current UI ? — Itoun, Apr 16 '19 at 07:30
I am not entirely sure what you like to achieve to be honest. Do you have a screenshot or something? You are currently returning a Container with a Text Widget that displays your `item.taskTitle` which makes sense. But what it seems is that you are then trying to return a `ListTile` which also displays the taskTitle. Why? — Robin Reiter, Apr 16 '19 at 07:34
Okay. So the UI is generated by the `Padding()` and all its child widgets. I still don't understand why you want that ListTile at the bottom. Did you even try my solution? It should achieve the exact result you like. Tapping on a row in your List will navigate to the next screen. — Robin Reiter, Apr 16 '19 at 07:41
I don't attach importance where I put ListTile. and I tried your solution but your solution make all of the Padding dead-code so I lose my UI because as you said my whole UI is provided by the Padding() and child widgets. — Itoun, Apr 16 '19 at 07:46
You do not need that list tile anymore. Thats the point. Try using the `GestureDetector` but delete the ListTile you inserted at the bottom. Take a closer look at my build method. Please copy that without modifications and try if it works. — Robin Reiter, Apr 16 '19 at 07:52
before I was just adding your GestureDetector where you put it in your solution and remove my ListTile but I havn't seen that you put child. My bad. it's working ! Thank you ! — Itoun, Apr 16 '19 at 07:58

Flutter Dead code Listview while implementing ListTile

1 Answers1