CODEWITHSUNDEEP
flutterdartscrollviewscrollbarsinglechildscrollview
Chris
Chris

Reputation: 2314

Flutter The Scrollbar's ScrollController has no ScrollPosition attached

I get this error when using the AppBar:

The Scrollbar's ScrollController has no ScrollPosition attached.

This is my CustomScrollBar:

class CustomScrollBar extends StatelessWidget {
  final Widget child;
  final ScrollController scrollController;

  const CustomScrollBar({
    required this.scrollController,
    required this.child,
  });

  @override
  Widget build(BuildContext context) {
    return RawScrollbar(
      thumbColor: AppColors.gray,
      radius: Radius.circular(8),
      thickness: 4,
      isAlwaysShown: true,
      controller: scrollController,
      child: child,
    );
  }
}

I should be always visible. And this is how I use it:

child: CustomScrollBar(
              scrollController: _scrollControllerForScrollBar,
              child: SingleChildScrollView(
                controller: _scrollControllerForScrollBar,
                child: Padding(
                  padding: EdgeInsets.all(7.0.scaled),
                  child: Container(
                    width: double.infinity,
                    child: Text(
                      'any text bla bla bla \n\n\n this is a lot of \n text \n .'
                    ),
                  ),
                ),
              ),
            ),

As you can see both the ScrollBar and the SingleChildScrollView use the same ScrollController. I have no idea why this error occurs. Any idea what I am missing here?

Upvotes: 57

Views: 34932

Answers (9)

the_raging_deaner
the_raging_deaner

Reputation: 126

The other option is to set primary to true in your nested scrollview.

From the docs:

          // This vertical scroll view has primary set to true, so it is
          // using the PrimaryScrollController. On mobile platforms, the
          // PrimaryScrollController automatically attaches to vertical
          // ScrollViews, unlike on Desktop platforms, where the primary
          // parameter is required.
          child: Scrollbar(
            thumbVisibility: true,
            child: ListView.builder(
                primary: true,

Upvotes: 0

Max Anders
Max Anders

Reputation: 21

Removing the thumbVisibility: true in the scrollbar wrapper of the ListView nested in another ListView is a fix for me but that also means it's not always shown.

Upvotes: 0

Muhammad Ali Laqa
Muhammad Ali Laqa

Reputation: 91

Simply use same scroll controller for the whole screen, It occurs on Flutter channel stable with nested scroll widgets as flutter is unable to find the main scroll view, in flutter channel master this error does not occur, so it's an error on flutter stable but do consider before switching to flutter channel master as your project might not run on flutter channel master. Try using

thumbVisibility: false,

instead of

isAlwaysShown: false,

Upvotes: 0

Mr. Poopybutthole
Mr. Poopybutthole

Reputation: 374

Let's assume you're using both Scrollbar widget and ListView widget as a child of the scrollbar - Both of them should have the same controller as :

ScrollController _controller = ScrollController();

     Scrollbar(
              controller: _controller,
              child: ListView(
                controller: _controller,
           ....), // ListView
    ) // Scrollbar

Upvotes: 16

Nghien Nghien
Nghien Nghien

Reputation: 297

For this error, you have to define same 1 scrollController for both ScrollBar and SingleSchildScrollView/ListView:

For example from my prj:

  final ScrollController _scrollController = ScrollController(); //define just 1 controller
  final _currencyFormatter = NumberFormat('#,##0.00', 'vi_VN');
  final double _safeSpaceToShowToolTip = 1.4;
  final double _fixedChartHeight = 350.0;
  int _touchedIndex = -1;

  @override
  Widget build(BuildContext context) {
    return Scrollbar(
      controller: _scrollController, // and use it both here
      isAlwaysShown: true,
      trackVisibility: true,
      radius: Radius.circular(6.0),
      child: SingleChildScrollView(
        controller: _scrollController, // AND HERE
        scrollDirection: Axis.horizontal,
        physics: BouncingScrollPhysics(),
        child: Container(
          margin: EdgeInsets.only(bottom: R.dimens.mediumSpacing),
          height:
              R.dimens.getSpecificSize(_fixedChartHeight, isForHeight: true),
          width: R.dimens
              .getSpecificSize(_fixedChartHeight * 1.9, isForHeight: false),
          child: BarChart(
            _barChartData(),
          ),
        ),
      ),
    );
  }

Upvotes: 1

berkb
berkb

Reputation: 612

If you use nested scroller like this:

 Expanded(
                          flex: 2,
                          child: Center(
                            child: Scrollbar(
                              child: SingleChildScrollView(
                                primary: true,
                                child: Scrollbar(
                                  child: SingleChildScrollView(
                                    scrollDirection: Axis.horizontal,
                                   .....)

You can fix the issue adding this line to first Scrollable view:

 primary: true

The UI plotter wants know start position for the scroller both on mobile and low resolutions on desktop with size:

MediaQuery.of(context).size.shortestSide < 600

Upvotes: 6

jaredbaszler
jaredbaszler

Reputation: 4829

I was using a ScrollBar with a ListView widget and was getting this error in the debug console. To get rid of it, I had to set the ScrollController on both widgets.

final yourScrollController = ScrollController();

Scrollbar(
  isAlwaysShown: true,
  thickness: 10,
  controller: yourScrollController, // Here 
  child: ListView.builder(
    padding: EdgeInsets.zero,
    scrollDirection: Axis.vertical,
    controller: yourScrollController, // AND Here
    itemCount: yourRecordList?.length
    ....
  )
)

Upvotes: 114

Jonah Zheng
Jonah Zheng

Reputation: 1

The following assertion was thrown during a scheduler callback: The Scrollbar's ScrollController has no ScrollPosition attached

A Scrollbar cannot be painted without a ScrollPosition.

The Scrollbar attempted to use the provided ScrollController. This ScrollController should be associated with the ScrollView that the Scrollbar is being applied to. When providing your own ScrollController, ensure both the Scrollbar and the Scrollable widget use the same one.

This is flutter's bug, https://github.com/flutter/flutter/issues/82573.

It is fixed on the flutter master branch:

flutter channel master
flutter upgrade

Upvotes: 0

wilhit
wilhit

Reputation: 36

Remove the scrollController entirely and that should fix the problem. that is how I fixed my code so your code should look something like this

class CustomScrollBar extends StatelessWidget {


 final Widget child;

  const CustomScrollBar({
    required this.child,
  });

  @override
  Widget build(BuildContext context) {
    return RawScrollbar(
      thumbColor: AppColors.gray,
      radius: Radius.circular(8),
      thickness: 4,
      isAlwaysShown: true,
      child: child,
    );
  }
}

and the second part should be like this

child: CustomScrollBar(
              child: SingleChildScrollView(
                child: Padding(
                  padding: EdgeInsets.all(7.0.scaled),
                  child: Container(
                    width: double.infinity,
                    child: Text(
                      'any text bla bla bla \n\n\n this is a lot of \n text \n .'
                    ),
                  ),
                ),
              ),
            ),

Upvotes: 2

Related Questions