Scrollbars should be always visible and instantiated by default on web and desktop #40107
Comments
|
Any active development is in progress for this feature. We are using Flutter widget as a component in existing web page but the issue is it is disabling browser scrollbar. |
|
I am trying to get a clarification since there is no milestone setup for the Flutter for the web to have the default scrollbar visible. Is this something that is planned for Flutter for the web to handle? Thank you. |
You'll just have to follow this issue to keep track of the progress. Since there is no milestone assigned it likely isn't at the top of the list and/or it isn't easy to implement. So I'd say at this point, I wouldn't expect this to get resolved anytime soon. |
|
@jaredbaszler Thanks... |
|
That's a big issue to address. I picked up flutter with the goal of rendering "web first" and then other devices. Meaning that if web does not work for me it's a big issue. My MVP depends on web working successfully in the early MVP life time and less so on the mobile platforms. Scrolls are super important for UX. I find this is an essential feature to have for the web. Please add priority to this request. |
|
For the web (and desktop applications), the scrollbars are very important. |
|
Hey @theacodes It looks like the Scrollbar.isAlwaysShown feature reached stable in version 1.17. Does this feature meet the need you described above? I have tried this on Mac, Web, and mobile, and I think it achieves the effect you described. class _MyHomePageState extends State<MyHomePage> {
final ScrollController scrollController = ScrollController();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Scrollbar(
isAlwaysShown: true,
controller: scrollController,
child: ListView.builder(
controller: scrollController,
itemCount: 200,
itemBuilder: (context, index) => ListTile(title: Text("Item= ${index + 1}"),),),
)
);
}
}
|
I am not the mentioned user, but I would like to have the normal scrollbar on web. Things like iOS Safari not scrolling to the top when you press the status bar, or accessibility issues like middle mouse button not functioning (haven’t tried it but I assume it does not work), also the scrollbar arrows where you can press a few times to scroll down and a setting in browsers to have smooth scrolling enabled or disabled are all the things that don’t work with isAlwaysShown. |
|
Hi @rbozan, this issue is focused on scrollbar visibility. |
|
Another clarifying question - is this a request for always visible scrollbars by default for web and desktop applications? Like how we create the GlowingOverscrollIndicator by default in scroll views? |
Piinks
changed the title
|
Yes! I think on web and desktop they should be visible by default (when needed). Of course with option to hide |
|
I am also missing the scrollbar as a default for web |
|
For the web version the scrollbar should always be visible if the content does not fit in the current window/page in the browser. I am really looking forward to this features, since users will not know how to scroll down on a web page when the scrollbars are not visible. Thank you. |
|
Consolidating into #70866 |
|
Re-opening again as an individual issue, see #70866 (comment) for latest |
|
it will be nice to have a new documentation showing how to use the reworked scrollbar on flutter web/desktop after the update launches |
|
The app fails while trying to drag the Scrollbar when used with Code: Scrollbar(
controller: _scrollController,
child: CustomScrollView(
controller: _scrollController,
physics: const ScrollPhysics(),
slivers: <Widget>[
SliverList(
delegate: SliverChildBuilderDelegate((BuildContext context, int index) {
if (index >= itemLength) {
return null;
}
return Container( width: 20);
}),
),
],
),
);Screen recordings:
My observation:
Error: flutter --version flutter doctor |
|
@ganeshrvel can you please file a new issue with a reproduction of your issue? This issue for for a separate feature. Thank you! |
If it when needed, then it is not always visible |
|
On some platforms (Windows) there is a system preference for if scrollbars should auto-hide or not. I understand we are not having scrollbars at all and respecting settings like this one is the cherry on top. But just pointing out that this system setting exist. Similar to how an app preferable respect system dark mode setting.
|
|
I have a proposed solution in #75354 Here are my concerns with auto-generated Scrollbars:
Also, I don't think we can automatically detect a Scrollbar created by the user. They can be placed anywhere in the tree, and even if we could track them all down, we would need to distinguish which were made automatically and which were user generated. Please see the change (#75354) for more context. All input is welcome while we try to decide the best way to proceed here. :) |
|
In response to request for comments. Your values state:
On desktop and desktop web end users of software use a vairity of input devices. A mouse with a scroll wheel is common, but it cannot be expected that every user has that. For example I use a trackball which do not have a scroll wheel, instead I use the scroll bars and hold a button and scroll by rolling the ball which has infinite movement by design. Other users may be using other devices for accessibility like voice control with eye mouse or a grid mouse. Basically, there are a vast vairity of users out there and not every developer is able to understand or anticipate the impact of not adding a scroll bar to their app. So the framework need to be accessible by default in order for most apps to have good accessibility. Then of course I'm not against flags to allow a developer to hide scrollbars if their app is a digital signage app or other situation where they know the scrollbar is not desired. But I think developers should need to opt-out of it. Which could be as simple as a property with a default value. |
|
@Piinks is there any expected date to your pr being implemented on any of the branchs? |
|
I am also looking for an update, especially for Flutter Web. I have a production app that really needs this feature. Thank you. |
and others
As mentioned in #38795, the the browser's scrollbar isn't currently visible when content can be scrolled. Ideally, we'd show the scrollbar when content can be scrolled otherwise this breaks users expectations on the platform.
The text was updated successfully, but these errors were encountered: