Scrollbar with ListView shows 2 scrollbars #99724
Comments
|
Can you try this to position scrollbar away from list ? child: SingleChildScrollView(
child: Padding(
padding: const EdgeInsets.only(right: 150),
child: Column(children: [
...List.generate(100, (index) => Padding(
padding: const EdgeInsets.all(20.0),
child: Text('Scrollable 1 : Index $index'),
)).toList()
]),
),
),instead of Scrollbar and list view combination. |
|
No, I can't use that. I have a header that doesn't scroll and what you have there wouldn't support the header. Additionally, your approach makes it impossible to utilize the Regardless, I believe that I'm using the widgets as intended. If that's the case, then this is a bug and should be fixed. |
|
this can make the header fixed. |
|
Thanks for the report and code sample @matthew-carroll. Using latest master and stable, I see the same behavior:
stable, master flutter doctor -v |
darshankawar
added
f: material design
|
/cc @Piinks |
|
Is the second scrollbar you are seeing the one that is automatically added when running on desktop (+ web on desktop)? This guide explains where they come from and how to configure or disable: |
Piinks
added
the
waiting for customer response
|
Adding a If this is the intended behavior, you can close this issue. Updated code: import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
static const String _title = 'Flutter Code Sample';
@override
Widget build(BuildContext context) {
return MaterialApp(
title: _title,
home: Scaffold(
appBar: AppBar(title: const Text(_title)),
body: const Center(
child: MyStatefulWidget(),
),
),
);
}
}
class MyStatefulWidget extends StatefulWidget {
const MyStatefulWidget({Key? key}) : super(key: key);
@override
State<MyStatefulWidget> createState() => _MyStatefulWidgetState();
}
class _MyStatefulWidgetState extends State<MyStatefulWidget> {
final ScrollController _firstController = ScrollController();
@override
Widget build(BuildContext context) {
return LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
return SizedBox(
width: constraints.maxWidth / 2,
// Only one scroll position can be attached to the
// PrimaryScrollController if using Scrollbars. Providing a
// unique scroll controller to this scroll view prevents it
// from attaching to the PrimaryScrollController.
child: Scrollbar(
isAlwaysShown: true,
controller: _firstController,
child: Padding(
padding: const EdgeInsets.all(48.0),
// Here's the ScrollConfiguration
child: ScrollConfiguration(
behavior: ScrollConfiguration.of(context).copyWith(scrollbars: false),
child: ListView.builder(
controller: _firstController,
itemCount: 100,
itemBuilder: (BuildContext context, int index) {
return Padding(
padding: const EdgeInsets.all(8.0),
child: Text('Scrollable 1 : Index $index'),
);
}),
),
),
),);
});
}
}
|
github-actions
bot
removed
the
waiting for customer response
|
Nice! Thanks for updating! I will close this then as WAI. |
|
This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of |
I have a
Scrollbaras an ancestor to aListViewso that I can position the scrollbar a bit further away from the list of items.There are now 2 scrollbars painted for the same list. Also, the scrollbar that's drawn by the
Scrollbarwidget doesn't scroll all the way down its height. Instead, theScrollbarwidget makes its own scroll track the same pixel height as theListView, which isn't the expected behavior. TheScrollbarwidget should scroll from its top to its bottom.Screen.Recording.2022-03-07.at.4.13.00.PM.mov
I copied the code from the
Scrollbardocs and adjusted the code to demonstrate the issue. This code can be copied and pasted into DartPad (Flutter 2.10.3 Dart SDK 2.16.1):The text was updated successfully, but these errors were encountered: