Scrollbar (Flutter Widget of the Week)
Why Stack Overflow recommends it
Stack Overflow users link it in answers about adding a scrollbar to Flutter lists and page views as a quick official demo of the Scrollbar widget.
Recommended by 2 people across 2 different months, 2021 to 2022.
What it is
A 1m40s Flutter Widget of the Week episode from the official Flutter channel. It shows how wrapping a ListView, GridView or CustomScrollView in the Scrollbar widget adds a visible scrollbar, with a DartPad demo and links to the API docs.
What people said
Recommends iqfareez · 2021-03 · Stack Overflow · on “How to have a scrollbar view in Flutter?”
Flutter now has Scrollbar [LINK] widget. Just wrap SingleChildScrollView [LINK] or any ScrollView [LINK] widget with Scrollbar . Code sample: class HomePage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( body: Scrollbar( // Child can also be SingleChildScrollView, GridView, etc. child: ListView.builder( itemCount: 20, itemBuilder: (context, index) { return ListTile( title: Text('Index $index'), ); }, ), ), ); } } [LINK] Scrollbar (Widget of the week) : [this video]
Recommends هيثم · 2022-02 · Stack Overflow · on “How to have a scrollbar view in Flutter?”
Wrap the scrollable widget with Scrollbar widget. child: Scrollbar( isAlwaysShown: true, child: ListView( ....) ) You can make it always shown . watch this for further explanation. [this video]
Cites Abhilash Chandran · 2021-04 · Stack Overflow · on “PageView widget in vertical wrapped in Scrollbar Widget”
You have to pass the controller for the Scrollbar widget with the same controller of PageView widget. Define a PageController final PageController pageController = PageController(initialPage: 0); Pass the pageController to the controller property of Scrollbar widget. return Scrollbar( controller: pageController, isAlwaysShown: true, // This forces the scrollbar to be visible always child: PageView( scrollDirection: Axis.vertical, controller: pageController, You can set other properties like thickness and hoverthickness to addjust the thickness of the scroll bar. Refer this [this video] and documentation [LINK] for more details. A working demo. Also available as a dartpad here [LINK] : /// Flutter
Cites Matthew Trent · 2022-08 · Stack Overflow · on “Can't add ScrollBar to ScrollablePositionedList (it doesn't have a ScrollController)”
I'm using the scrollable_positioned_list [LINK] package, and have it rendering a large dynamic list. It works very well. However, I need my list to have a scrollbar (something like this [this video] ). So far, this is impossible. Does anyone know how to do it? My code looks as follows: Scrollbar( child: ScrollablePositionedList.builder( physics: const ClampingScrollPhysics( parent: AlwaysScrollableScrollPhysics(), ), itemCount: posts.length + 1, itemBuilder: (context, index) { if (index == 0) { return Container( height: 200, color: Colors.green, child: const Center( child: Text('post content'), ), ); } else if (posts[index - 1].isRoot) { return Container( padding: const EdgeInsets.symmetric(verti