在顫振中，我有一個挑戰，我想要一個簡單的Listview專案，每個專案的底部都有一個影像和文本，你假設我們有Instagram卡片，
正如我們所知，當我們有一個垂直時，ListView我們可以滾動頂部或底部，滾動串列視圖可以發生在串列視圖的每個專案上。
現在在這個串列視圖的每個專案上，我想像滾動頂部一樣滑動頂部，而不是將串列視圖滾動到頂部，我想在這個專案上顯示另一個小部件
我的問題是如何避免在我們將影像刷入卡片期間滾動串列視圖
uj5u.com熱心網友回復：
當用戶點擊影像小部件時，您可以GestureDetector使用此方法包裝影像小部件并使用此方法禁用滾動行為。
我發現使用這種方法的一個方便的行為是用戶仍然可以根據需要向上或向下滾動（點擊并立即滑動而不是點擊然后滑動）。這可能不是最好的方法，因為我不能只阻止向上滾動行為。
這是我的例子：
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
debugShowCheckedModeBanner: false,
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
final String title;
const MyHomePage({
Key? key,
required this.title,
}) : super(key: key);
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
ScrollPhysics physics = const AlwaysScrollableScrollPhysics();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: ListView(
// Add the scroll physics controller here
physics: physics,
children: [
for (int i = 0; i < 20; i ) ...[
// Wrap the Widget with GestureDetector
GestureDetector(
// Disable the scroll behavior when users tap down
onTapDown: (_) {
setState(() {
physics = const NeverScrollableScrollPhysics();
});
},
// Enable the scroll behavior when user leave
onTapCancel: () {
setState(() {
physics = const AlwaysScrollableScrollPhysics();
});
},
onPanUpdate: (details) {
// Catch the swip up action.
if (details.delta.dy < 0) {
print('Swipping up the element $i');
}
// Catch the swip down action.
if (details.delta.dy > 0) {
print('Swipping down the element $i');
}
},
// Your image widget here
child: Padding(
padding: const EdgeInsets.all(20),
child: Container(
width: 100,
height: 100,
color: Colors.red,
),
),
),
Center(child: Text('Element $i')),
],
],
),
);
}
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/330996.html