水平列表视图在网页上不滚动，但在移动设备上滚动

Question

在flutter 2.5更新后，listview仅在移动平台上滚动。当我在网上打开它时，它不会滚动。它在以前的版本中工作得很好。我尝试了卷轴物理，但它不起作用。你建议我怎么做?对不起，我的英语不好。

return SizedBox(
height: 400,
child: ListView.builder(
physics: ClampingScrollPhysics(),
scrollDirection: Axis.horizontal,
// ignore: unnecessary_null_comparison
itemCount: items == null ? 0 : items.length,
itemBuilder: (context, index) {
return GestureDetector(
onTap: () {
LoginForm();
},
child: Container(
margin:
EdgeInsets.symmetric(horizontal: 20, vertical: 6),
child: SizedBox(
width: 400,
height: 50,
child: Stack(
fit: StackFit.expand,
children: <Widget>[
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(20.0)),
boxShadow: [
BoxShadow(
color: fromCssColor(
items[index].color.toString()),
// color: Colors.black38,
offset: Offset(2.0, 2.0),
blurRadius: 5.0,
spreadRadius: 1.0)
]),
),
ClipRRect(
borderRadius:
BorderRadius.all(Radius.circular(20.0)),
child: Image.asset(
items[index].image.toString(),
fit: BoxFit.cover,
),
),
Container(
decoration: BoxDecoration(
borderRadius:
BorderRadius.all(Radius.circular(20.0)),
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Colors.transparent,
Colors.black45
]))
),
],
),
),

Answer 1

扑动2.5摘要

ScrollBehaviors现在允许或不允许从指定拖动滚动PointerDeviceKinds。ScrollBehavior.dragDevices默认为允许滚动部件将被所有PointerDeviceKinds拖动，除了PointerDeviceKind.mouse.

import 'package:flutter/material.dart';
// Set ScrollBehavior for an entire application.
MaterialApp(
scrollBehavior: MyCustomScrollBehavior(),
// ...
);

import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
class MyCustomScrollBehavior extends MaterialScrollBehavior {
// Override behavior methods and getters like dragDevices
@override
Set<PointerDeviceKind> get dragDevices => {
PointerDeviceKind.touch,
PointerDeviceKind.mouse,
};
}

参考官方文档。

Answer 2

如果您想要特定Widget的解决方案，请尝试下面的

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 dev

Answer 3

我能够通过在我的MaterialApp小部件中放置以下代码来解决此问题

scrollBehavior: const MaterialScrollBehavior().copyWith(
dragDevices: {PointerDeviceKind.mouse},
),

我的代码

return MaterialApp(
scrollBehavior: const MaterialScrollBehavior().copyWith(
dragDevices: {PointerDeviceKind.mouse},
),
title: 'Flutter app',
debugShowCheckedModeBanner: false,
theme: ThemeData(useMaterial3: true),
home: const SplashScreen(),
);