[Bug] My table keep scrolling to top

[uzuki-P]

Describe the bug My table keep scrolling to top.

Platform Android and iOS

Screen Captures or Debug Log

Log

[+5729 ms] I/flutter (13631): ** GOING TO ROUTE /affiliate/detail. isError: [false] [ +82 ms] I/flutter (13631): ** Instance "AffiliateDetailController" has been created. isError: [false] [ ] I/flutter (13631): ** Instance "AffiliateDetailController" has been initialized. isError: [false] [ +9 ms] D/skia (13631): --- Failed to create image decoder with message 'unimplemented' [ +20 ms] D/skia (13631): --- Failed to create image decoder with message 'unimplemented' [ +685 ms] D/skia (13631): --- Failed to create image decoder with message 'unimplemented' [+3431 ms] D/skia (13631): --- Failed to create image decoder with message 'unimplemented' [ +96 ms] D/skia (13631): --- Failed to create image decoder with message 'unimplemented' [+7808 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +25 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +9 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +17 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [+2211 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +21 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [+1990 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +21 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +16 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +17 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [+1545 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +26 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +12 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +16 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [+1481 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +14 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +26 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [+1993 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +16 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +13 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +20 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +585 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +7 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +30 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +922 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +16 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +23 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [ +23 ms] E/AccessibilityBridge(13631): Scroll index is out of bounds. [+6504 ms] E/Parcel (13631): Reading a NULL string not supported here.

https://user-images.githubusercontent.com/16524713/187653965-e8ac9abf-53a0-42ea-82d0-8e238c8702cf.mp4

Note: I'm using GetX

final tableHorizontalScrollCtrl = Rxn<ScrollController>();
final tableVerticalScrollCtrl = Rxn<ScrollController>();
final hdtRefreshCtrl = HDTRefreshController();

HorizontalDataTable(
  htdRefreshController: controller.hdtRefreshCtrl,
  enablePullToRefresh: true,
  refreshIndicator: const ClassicHeader(),
  onRefresh: () => controller.refreshDetailTable(),
  enablePullToLoadNewData: true,
  loadIndicator: const ClassicFooter(),
  onLoad: () => controller.loadNewDataDetailTable(),
  // horizontalScrollController: controller.tableHorizontalScrollCtrl,
  onScrollControllerReady: (
    verticalController,
    horizontalController,
  ) {
    controller.tableHorizontalScrollCtrl.value = horizontalController;
    controller.tableVerticalScrollCtrl.value = verticalController;
  },
  rightHandSideColumnWidth: sumTableWidth,
  leftHandSideColumnWidth: 0,
  leftSideItemBuilder: (_, __) => const SizedBox(),
  leftHandSideColBackgroundColor: Colors.transparent,
  elevation: 0,
  verticalScrollbarStyle: const ScrollbarStyle(thickness: 0),
  horizontalScrollbarStyle: const ScrollbarStyle(thickness: 0),
  itemCount: controller.isFirstLoading.value
      ? 25
      : controller.detailAffiliateList.length,
  isFixedHeader: true,
  headerWidgets: [
    const SizedBox(), // skip paling kiri
    _tableTextHeader('No'.tr, tableWidth[0], isFirst: true),
    _tableTextHeader('Email'.tr, tableWidth[1]),
    _tableTextHeader('Total Bonus ()'.tr, tableWidth[2]),
    _tableTextHeader('Trader Affiliate ()'.tr, tableWidth[3]),
    _tableTextHeader('Market Maker Affiliate ()'.tr, tableWidth[4]),
    _tableTextHeader('Market Maker Fee ()'.tr, tableWidth[5],
        isLast: true),
  ],
  rightSideItemBuilder: (_, index) {
    if (controller.isFirstLoading.value) {
      return const DefaultShimmer(height: 38).padding(vertical: 2);
    }

    if (controller.detailAffiliateList.isEmpty) {
      return Text('Empty'.tr);
    }

    final currItem = controller.detailAffiliateList[index];
    return Row(
      children: [
        _tableTextBody(
          '${index + 1}',
          tableWidth[0],
        ),
        _tableTextBody(
          // currItem.email,
          'email@user.com',
          tableWidth[1] - 8,
          textStyle: GicTextStyle.body5.copyWith(
            color: GicColors.blue1,
            decoration: TextDecoration.underline,
          ),
          alignment: Alignment.centerLeft,
        ).padding(vertical: 8, left: 8).ripple().gestures(
              onTap: () => controller.goToDownlineHistory(
                currItem.email,
              ),
            ),
        _tableTextBody(
          currItem.total.toPriceFormat(),
          tableWidth[2],
        ),
        _tableTextBody(
          currItem.traderAffiliate.toPriceFormat(),
          tableWidth[3],
        ),
        _tableTextBody(
          currItem.marketMakerAffiliate.toPriceFormat(),
          tableWidth[4],
        ),
        _tableTextBody(
          currItem.marketMakerFee.toPriceFormat(),
          tableWidth[5],
        ),
      ],
    ).padding(horizontal: 16).backgroundColor(
        index % 2 == 0 ? GicColors.black5 : Colors.white);
  },
);

Flutter Doctor:

Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel stable, 3.3.0, on macOS 12.5.1 21G83 darwin-arm, locale en-ID) [✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0) [✓] Xcode - develop for iOS and macOS (Xcode 13.4.1) [✓] Android Studio (version 2021.2) [✓] IntelliJ IDEA Community Edition (version 2022.2.1) [✓] VS Code (version 1.70.2) [!] Connected device ! No devices available [✓] HTTP Host Availability ! Doctor found issues in 1 category.

horizontal_data_table: ^4.1.2-debug

[MayLau-CbL]

Hi @uzuki-P , do you mind run the example project once? just to ensure the error because of widget or setting. And just in case it is typo, the latest version should be v4.1.2

[uzuki-P]

ah just got it it's because of the leftSideItemBuilder. I can't use const SizedBox() or Container() for some reason. In my use case, I don't need the left side to be fixed. I need to make sure the left side have a same height as right side item.