CODEWITHSUNDEEP
flutterdartflutter-layout
Deepak Lohmod
Deepak Lohmod

Reputation: 2272

make a custom grid view using rows and columns

So, i am having a list of 12 elements and want to show them in column and rows like a grid. my code:-

Widget grid({int crossAxisCount, int mainAxisCount,double width}){
    int count=-1;
    return Column(
      children: List.generate(mainAxisCount, (index){
        count++;
        return Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: List.generate(crossAxisCount, (index){
            count++;
            return serviceTile(
              serviceName: serviceNames[count],
              content: contents[count],
              fileName: serviceNames[count].toLowerCase(),
              width: width,
            );
          }),
        );
      }),
    );
  }

but my code goes from index 0 to 13 but it should go till 11 so that that the following error is solved:-

RangeError (index): Index out of range: index should be less than 12: 13

Upvotes: 0

Views: 689

Answers (1)

MobIT
MobIT

Reputation: 980

  • Solution 1

    Widget grid({int crossAxisCount, int mainAxisCount,double width}){
  int count=-1;
  return Column(
    children: List.generate(mainAxisCount, (index){
     // count++;
      return Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: List.generate(crossAxisCount, (index){
          count++;
          return serviceTile(
            serviceName: serviceNames[count],
            content: contents[count],
            fileName: serviceNames[count].toLowerCase(),
            width: width,
          );
        }),
      );
    }),
  );
}

  • Solution 2

    Widget grid({int crossAxisCount, int mainAxisCount,double width}){

  return Column(
    children: List.generate(mainAxisCount, (index1){

      return Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: List.generate(crossAxisCount, (index2){
          int count = (mainAxisCount * index1) + index2;
          return serviceTile(
            serviceName: serviceNames[count],
            content: contents[count],
            fileName: serviceNames[count].toLowerCase(),
            width: width,
          );
        }),
      );
    }),
  );
}

Upvotes: 1

Related Questions