Hello I have 2 list and I want to use these in ListViewBuilder.

List's:

List times = ['08:30', '09:00', '09:30', '10:00', '13:00'];
List obj = [true,false,true];

I tried this:

ListView.builder(
                controller: scrollController,
                shrinkWrap: true,
                itemCount: times.length,
                itemBuilder: (BuildContext context, int index) {
                  return Padding(
                    padding: const EdgeInsets.all(8.0),
                    child: InkWell(
                      onTap: () {
                        setState(() {
                          selected = index;
                          debugPrint(tarih[index]);
                        });
                      },
                      child: Container(
                        color: obj[index] ? Colors.yellow : Colors.red,
                        height: 30,
                        width: 12,
                        child: Text(times[index]),
                      ),
                    ),
                  );
                },
              ),

Here is the error:

I know what cause's this error. Because of obj.length does not match with times.length

But I still want to create the other Containers. How do I solve this?

CodePudding user response：

Many ways you can avoid this here min(int,int) method used lowest integer find

obj[min(index,obj.length-1)] ? Colors.yellow : Colors.red,

widget may like this

      ListView.builder(
        // controller: scrollController,
        shrinkWrap: true,
        itemCount: times.length,
        itemBuilder: (BuildContext context, int index) {
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: InkWell(
              onTap: () {
                setState(() {
                  selected = index;
                  // debugPrint(tarih[index]);
                });
              },
              child: Container(
                color: obj[min(index,obj.length-1)] ? Colors.yellow : Colors.red,
                height: 30,
                width: 12,
                child: Text(times[index]),
              ),
            ),
          );
        },
      )

You try to achieve

class _MyAppState extends State<MyApp> {
  int selected = 0;

  @override
  void initState() {
    super.initState();
  }

  List times = ['08:30', '09:00', '09:30', '10:00', '13:00'];
  List obj = [];

  @override
  Widget build(BuildContext context) {
    var column = Column(
      children: [
        Container(
          height: 200,
          child: Row(
            children: [
              Expanded(
                child: Image.network(
                  "https://upload.wikimedia.org/wikipedia/commons/thumb/3/3c/Salto_del_Angel-Canaima-Venezuela08.JPG/1200px-Salto_del_Angel-Canaima-Venezuela08.JPG",
                  // fit: BoxFit.cover,
                  fit: BoxFit.fitWidth,
                ),
              ),
            ],
          ),
        )
      ],
    );
    obj = List.generate(times.length, (index) => false);
    var children2 = [
      ListView.builder(
        // controller: scrollController,
        shrinkWrap: true,
        itemCount: times.length,
        itemBuilder: (BuildContext context, int index) {
          if (selected == index)
            obj[index] = true;
          else
            obj[index] = false;
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: InkWell(
              onTap: selected != index
                  ? () {
                      setState(() {
                        selected = index;
                        print(selected);
                        // debugPrint(tarih[index]);
                      });
                    }
                  : null,
              child: Container(
                color: obj[index]
                    ? Colors.yellow
                    : Colors.red,
                height: 30,
                width: 12,
                child: Text(times[index]),
              ),
            ),
          );
        },
      ),
      DropdownButton(
          items: [
            DropdownMenuItem(
              child: Text("1"),
              value: "1",
              onTap: () {},
            )
          ],
          onChanged: (values) {
            // _dropdown1=values;
          })
    ];
    return MaterialApp(
      // theme: theme(),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
          appBar: AppBar(),
          body: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: children2,
          )),
    );
  }
}

CodePudding user response：

Well there might be other ways to do so, what I did was, just to copy the obj list items as many as there are items in times list in order. And if the number is not equal just add remaining number at last.

 List times = [
'08:30',
'09:00',
'09:30',
'10:00',
'13:00',
'13:00',
'13:00',
'13:00',
'13:00',
];

List obj = [true, false, true];

@override
Widget build(BuildContext context) {
// Remaining length of times list after we copy
int remaining = times.length % obj.length;
//Exact Number of times to copy obj
int exactNumber = (times.length - remaining) ~/ obj.length;
List shallowList = [];
// Using for loop copy the list as many as exactNumber
for (int i = 0; i < exactNumber; i  ) {
  shallowList  = obj;
}
// Add add remaining subList 
// Then we have obj list with same length as times
List finalShallowList = [...shallowList, ...obj.sublist(0, remaining)];
// Create Separate Index for obj that we can reset
return Scaffold(
  body: Container(
    child: ListView.builder(
      shrinkWrap: true,
      itemCount: times.length,
      itemBuilder: (BuildContext context, int index) {
        return Padding(
          padding: const EdgeInsets.all(8.0),
          child: InkWell(
            onTap: () {},
            child: Container(
               // Loop over finalShallowList instead of obj
              color: finalShallowList[index] ? Colors.yellow : Colors.red,
              height: 30,
              width: 12,
              child: Text(times[index]),
            ),
          ),
        );
      },
    ),
  ),
);