CODEWITHSUNDEEP
flutterdartlistview
Ankit Kumar
Ankit Kumar

Reputation: 409

Flutter ListView getting automatically updated at wrong index or element

I am trying to make a list view that shows an addition to a certain number. Here in the image, I am trying to generate an addition table for 16 steps in a ListView. It appears fine when it gets loaded but after scrolling the top and the bottom element gets updated automatically. This problem is only evident when the value of the variable tableSize that basically controls the number of items in the ListView exceeds 15. How can this problem be solved??

top and bottom element of the ListView gets updated automatically

// tableSize = 16 && tCount = 10

Here is the code

return ListView.builder(
  key: UniqueKey(),
  padding: EdgeInsets.symmetric(horizontal: 5),
  itemCount: DataFile.tableSize,
  scrollDirection: Axis.vertical,
  itemBuilder: (context, index) {
    tCount = tCount + 1;

    String title;

    print(" Tcount = ${tCount}");

    if (sign == DataFile.divisionSign) {
      double ans = tableNo / tCount;
      title = tableNo.toString() +
          space +
          sign +
          space +
          tCount.toString() +
          space +
          equal +
          space +
          f.format(ans);
    } else {
      int ans;
      if (sign == DataFile.additionSign) {
        ans = tableNo + tCount;
      } else if (sign == DataFile.subtractionSign) {
        ans = tableNo - tCount;
      } else {
        ans = tableNo * tCount;
      }

      title = tableNo.toString() +
          space +
          space +
          sign +
          space +
          space +
          tCount.toString() +
          space +
          space +
          equal +
          space +
          space +
          int.parse(ans.toString()).toString();
      print(title);
    }

    return InkWell(
      child: Container(
        height: cellHeight,
        margin: EdgeInsets.symmetric(
            vertical: ConstantData.getScreenPercentSize(context, 2.3)),
        child: Center(
          child: ConstantWidget.getTextWidget(
              title,
              ConstantData.textColors!,
              ConstantData.getPercentSize(cellHeight, 98),
              FontWeight.w500,
              TextAlign.center),
        ),
      ),
      onTap: () {},
    );
  },
);

Upvotes: 1

Views: 661

Answers (1)

harsh bangari
harsh bangari

Reputation: 495

Change required in the tCount which is mutable data in the state variable.

Use this code:

return ListView.builder(
  key: UniqueKey(),
  padding: EdgeInsets.symmetric(horizontal: 5),
  itemCount: DataFile.tableSize,
  scrollDirection: Axis.vertical,
  itemBuilder: (context, index) {

tCount = index + 1; //change here 

String title;

print(" Tcount = ${tCount}");

if (sign == DataFile.divisionSign) {
  double ans = tableNo / tCount;
  title = tableNo.toString() +
      space +
      sign +
      space +
      tCount.toString() +
      space +
      equal +
      space +
      f.format(ans);
} else {
  int ans;
  if (sign == DataFile.additionSign) {
    ans = tableNo + tCount;
  } else if (sign == DataFile.subtractionSign) {
    ans = tableNo - tCount;
  } else {
    ans = tableNo * tCount;
  }

  title = tableNo.toString() +
      space +
      space +
      sign +
      space +
      space +
      tCount.toString() +
      space +
      space +
      equal +
      space +
      space +
      int.parse(ans.toString()).toString();
  print(title);
}

return InkWell(
  child: Container(
    height: cellHeight,
    margin: EdgeInsets.symmetric(
        vertical: ConstantData.getScreenPercentSize(context, 2.3)),
    child: Center(
      child: ConstantWidget.getTextWidget(
          title,
          ConstantData.textColors!,
          ConstantData.getPercentSize(cellHeight, 98),
          FontWeight.w500,
          TextAlign.center),
    ),
  ),
  onTap: () {},
);
},
);

Upvotes: 1

Related Questions