Skip to content

Mouse Scrolling on Windows Desktop Does Not Respect # of Lines Specified in System Settings #97924

@rayliverified

Description

@rayliverified

Mouse scroll on Windows has a configurable "scroll per line" setting.
snap_screen_20220206191912

Flutter should respect this setting. Otherwise, scrolling feels slow and sticky - different than users are used to.

Flutter.Scroll.Test.Windows.vs.Web.20220206.mp4

Steps to Reproduce

  1. Run sample code on Windows desktop.
  2. Scroll using a Mouse. (scrolling with trackpad is identical between desktop and web)
  3. Run sample on Web https://dartpad.dev/?id=1e6e721d75aec76c26bca03a68f8edda
  4. Observe that scroll distance and feel is different on desktop vs web.

Expected results: Scroll distance should be identical between desktop and web.

Actual results: Scroll distance is different between desktop and web.

Code sample
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Scroll Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Scroll Demo'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<Color> colors = const [Colors.amber, Colors.blueAccent, Colors.green];
  ScrollController scrollController = ScrollController();
  double position = 0;

  @override
  void initState() {
    super.initState();
    scrollController.addListener(() {
      position = scrollController.position.extentBefore;
      setState(() {});
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Stack(
        children: [
          ListView.builder(
            controller: scrollController,
            itemCount: 100,
            itemBuilder: (context, index) {
              int colorIndex = index % 3;
              return Container(
                color: colors[colorIndex],
                height: 50,
              );
            },
          ),
          Positioned(
            bottom: 0,
            right: 0,
            child: Padding(
              padding: const EdgeInsets.all(16),
              child: Text(
                'Scroll Position: ${position.round()}',
                style:
                    const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
Logs
[√] Flutter (Channel stable, 2.10.0, on Microsoft Windows [Version 10.0.19044.1466], locale en-US)
    • Flutter version 2.10.0 at D:\Development\flutter-sdk
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5f105a6ca7 (5 days ago), 2022-02-01 14:15:42 -0800
    • Engine revision 776efd2034
    • Dart version 2.16.0
    • DevTools version 2.9.2

[√] Android toolchain - develop for Android devices (Android SDK version 30.0.2)
    • Android SDK at D:\Development\android-sdk
    • Platform android-31, build-tools 30.0.2
    • ANDROID_HOME = D:\Development\android-sdk
    • Java binary at: C:\Program Files\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.11+9-b60-7590822)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files (x86)\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Community 2022 17.0.5)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.0.32112.339
    • Windows 10 SDK version 10.0.19041.0

[√] Android Studio (version 2021.1)
    • Android Studio at C:\Program Files\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.11+9-b60-7590822)

[√] VS Code (version 1.63.2)
    • VS Code at C:\Users\Laptop\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension can be installed from:
       https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.19044.1466]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 96.0.4664.110
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 97.0.1072.69

[√] HTTP Host Availability
    • All required HTTP hosts are available

• No issues found!

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work lista: desktopRunning on desktopengineflutter/engine related. See also e: labels.platform-windowsBuilding on or for Windows specifically

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions