flutter 网络 : Cannot scroll with mouse down (drag) (Flutter 2. 5+)

标签 flutter dart flutter-web

[更新]
我可以确认这个问题发生在 2.5 以上的 flutter 中。使用 2.2.3 没问题。问题变成了为什么在 2.5 中删除了此功能?以及如何在 flutter 2.5 中启用它?
[起源问题]
我在带有桌面浏览器的 flutter web 上使用 SingleChildScrollView。滚动仅适用于鼠标滚轮,而不适用于鼠标单击(拖动)。如何将鼠标单击映射到像移动设备一样触摸和滚动?

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 Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: SingleChildScrollView(
        child: Column(
          children: List<Widget>.generate(50, (i) => Text(i.toString())).toList(),
        ),
      ),
    );
  }
}
flutter doctor -v
[✓] Flutter (Channel master, 2.6.0-6.0.pre.6, on Ubuntu 20.04.3 LTS 5.11.0-34-generic, locale en_US.UTF-8)
    • Flutter version 2.6.0-6.0.pre.6 at /home/XXX
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 0c5431d99c (12 days ago), 2021-09-05 22:31:02 -0400
    • Engine revision b9c633900e
    • Dart version 2.15.0 (build 2.15.0-82.0.dev)

[✓] Chrome - develop for the web
    • Chrome at google-chrome

[✓] Connected device (2 available)
    • Linux (desktop) • linux  • linux-x64      • Ubuntu 20.04.3 LTS 5.11.0-34-generic
    • Chrome (web)    • chrome • web-javascript • Google Chrome 93.0.4577.82

最佳答案

Flutter 在 2.5 之后更改鼠标滚动行为。见 this详情。

class MyCustomScrollBehavior extends MaterialScrollBehavior {
  // Override behavior methods and getters like dragDevices
  @override
  Set<PointerDeviceKind> get dragDevices => { 
    PointerDeviceKind.touch,
    PointerDeviceKind.mouse,
    // etc.
  };
}

// ScrollBehavior can be set for a specific widget.
final ScrollController controller = ScrollController();
ScrollConfiguration(
  behavior: MyCustomScrollBehavior(),
  child: ListView.builder(
    controller: controller,
    itemBuilder: (BuildContext context, int index) {
     return Text('Item $index');
    }
  ),
);

关于 flutter 网络 : Cannot scroll with mouse down (drag) (Flutter 2. 5+),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69232764/

相关文章:

Flutter:滚动每个包含 1k 个选择的 DropdownButtons 列表太慢

dart - 如何检测 Flutter 中布局的方向变化?

flutter - Instagram Profile标题布局在Flutter中

flutter - 如何更改 Flutter Web 中的 chrome 标题颜色?

flutter - 多次使用 TextEditingController

java - Android Studio 抛出 "Exception in thread "main"javax.net.ssl.SSLException : Received fatal alert: protocol_version"

css - 如何用Dart Angle 2 Material 设置 Material 扩展面板的样式

websocket - Flutter 使用 dart 实现 socket.io

flutter - 该软件包的 `dependencies`的 `pubspec.yaml`部分没有flutter_web_plugins

firebase - 如果我只使用 flutter web(没有 android 或 ios 应用程序),我是否还应该在 index.html 和 main.dart 中初始化 firebase 应用程序两次?