Flutter: need to add more widget in list view after the loop ends

136 Views Asked by At

I have an json data which I showed in list view builder the loop works fine but I need to add more widgets when the loop ends like i have an data with data.length 5 when I get those data in list view and show them in container it shows me 5 containers but i want to add more 3 static containers which is not in my json data. please help me with this.

I'll try but my code add only 1 more widget after data.length count

Here is my code:-

json data:

value = [{id: 1, name: English}, {id: 2, name: Mandarin}, {id: 3, name: Hindi}, {id: 4, name: Spanish}, {id: 5, name: French}]

here is my json data with 5 entries which i shows on listview builder

here is my code:-

var data = value;

ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: data.length + 1,
        itemBuilder: (context, index) =>
        index == data.length ?

        Container(
          height: size.height,
          width: size.width,
          padding: sidePadding,
          margin: EdgeInsets.only(right: 10),
          child: Text('Arabic'),
        ):
        Container(
          height: size.height,
          width: size.width,
          padding: sidePadding,
          margin: EdgeInsets.only(right: 10),
          child: Text('${data[index]['name']}')
        ),
      )

Here in my code you can see I add the new container after the loop end Arabic but I add only one entry I want to add two more containers with different text

2

There are 2 best solutions below

0
On

Just add to data.length number of static container and provide logic in itemBuilder. E.g.:

if (item==data.length+1){
    return Container();
}
0
On

You can follow this logic

 itemCount: data.length + extraItems.length,
class F332 extends StatelessWidget {
  const F332({super.key});

  @override
  Widget build(BuildContext context) {
    var data = ["A"];

    var extraItems = ["e1", "e2"];

    return Scaffold(
      body: ListView.builder(
        scrollDirection: Axis.horizontal,
        itemCount: data.length + extraItems.length,
        itemBuilder: (context, index) => index < data.length
            ? Container(
                child: Text('data : ${data[index]}'),
              )
            : Container(
                child: Text("Extra: ${extraItems[index - data.length]}"),
              ),
      ),
    );
  }
}