Repository navigation
Swiping on a listview under perspective can cause erratic behaviour #154104
Description
Steps to reproduce
Have a ListView under a Transform with a perspective that imitates a "road".
If you swipe your finger outside of the visible bounds of the list, the list jumps to an unpredictable location, in a direction opposite to that of a swipe.
Expected results
The list should behave "normally".
Actual results
The list jumps to an unpredictable location.
Code sample
Code sample
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
useMaterial3: true,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({super.key, required this.title});
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final _scrollController = ScrollController();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Theme.of(context).colorScheme.inversePrimary,
title: Text(widget.title),
),
body: Transform(
transform: Matrix4.identity()..setEntry(3, 1, -0.003),
alignment: Alignment.bottomCenter,
child: ListView.builder(
controller: _scrollController,
physics: const ClampingScrollPhysics(),
reverse: true,
itemBuilder: (context, index) => Container(
color: index.isEven ? Colors.white : Colors.black12,
alignment: Alignment.center,
child: Text('Item $index'),
),
),
),
floatingActionButton: FloatingActionButton(
tooltip: 'Reset To Start of the List',
onPressed: () => _scrollController.animateTo(
0,
duration: const Duration(seconds: 1),
curve: Curves.easeInOut,
),
child: const Icon(Icons.backspace_sharp),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
Screenshots or Video
Screenshots / Video demonstration
Screen.Recording.2024-08-26.at.11.50.31.mov
Logs
Logs
Nothing in the logs when this happensFlutter Doctor output
(Flutter version should not matter, we've had this for a long time.)
Doctor output
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.22.3, on macOS 14.5 23F79 darwin-arm64, locale en-PL)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
[✓] Xcode - develop for iOS and macOS (Xcode 15.4)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2022.3)
[✓] IntelliJ IDEA Community Edition (version 2023.2.1)
[✓] VS Code (version 1.92.1)
[✓] Connected device (4 available)
[✓] Network resources
• No issues found!Reacted by BoyanCreo, Krzysztof Świętnicki, OliverNarramore, Michael Stachowicz, Francesco Iapicca and 낭만코딩
Activity
danagbemava-nc commentedon Aug 27, 2024
Reproducible using the code sample provided above.
flutter doctor -v
Piinks commentedon Aug 28, 2024
This is likely because the transform also affects the coordinate plane the gesture is being applied to.