実現したいこと
FlutterでSlidingUpPanelを使った画面を構築しています。
panelが最大化している状態でpanelをダブルタップした時に、panelが最小化するように実装したいです。
しかし、panelを最大化してから、panel内のウィジェットを下スクロールしてからダブルタップすると、panelが最小化したあと、最大化ができず、panel内のウィジェットがスクロールされます。
panel内のウィジェットをスクロールせずにダブルタップをした場合はpanelが正しく動作します。
正しく動作するためにどこを修正すればいいでしょうか。
該当のソースコード
Dart
1import 'package:flutter/material.dart'; 2import 'package:sliding_up_panel/sliding_up_panel.dart'; 3 4void main() { 5 runApp(const MyApp()); 6} 7 8class MyApp extends StatelessWidget { 9 const MyApp({super.key}); 10 11 12 Widget build(BuildContext context) { 13 return const MaterialApp( 14 title: 'SlidingUpPanelDemo', 15 home: MyHomePage(title: 'SlidingUpPanelDemo'), 16 ); 17 } 18} 19 20class MyHomePage extends StatefulWidget { 21 const MyHomePage({super.key, required this.title}); 22 23 final String title; 24 25 26 State<MyHomePage> createState() => _MyHomePageState(); 27} 28 29class _MyHomePageState extends State<MyHomePage> { 30 PanelController panelController = PanelController(); 31 DateTime lastTapTime = DateTime.now(); 32 33 34 Widget build(BuildContext context) { 35 return Scaffold( 36 body: SlidingUpPanel( 37 controller: panelController, 38 minHeight: MediaQuery.of(context).size.height * 0.45, 39 maxHeight: MediaQuery.of(context).size.height * 0.8, 40 panelBuilder: (ScrollController scrollController) { 41 return Listener( 42 onPointerDown: (event) { 43 final now = DateTime.now(); 44 45 if (now.difference(lastTapTime) < 46 const Duration(milliseconds: 300)) { 47 if (panelController.isPanelOpen) { 48 scrollController.jumpTo(0); 49 panelController.close(); 50 } 51 } 52 lastTapTime = now; 53 }, 54 child: GestureDetector( 55 onDoubleTap: () {}, 56 child: SingleChildScrollView( 57 controller: scrollController, 58 child: Column( 59 children: [ 60 for (int i = 0; i < 6; i++) ...{ 61 Container( 62 height: 200, 63 color: Colors.blue, 64 ), 65 const Divider(color: Colors.grey), 66 } 67 ], 68 ), 69 ), 70 ), 71 ); 72 }, 73 borderRadius: const BorderRadius.only( 74 topLeft: Radius.circular(24.0), 75 topRight: Radius.circular(24.0), 76 ), 77 body: Container( 78 decoration: BoxDecoration( 79 color: Colors.white, 80 borderRadius: BorderRadius.circular(24), 81 ), 82 padding: EdgeInsets.only( 83 bottom: MediaQuery.of(context).size.height * 0.5, 84 ), 85 ), 86 ), 87 ); 88 } 89}
試したこと
SingleChildScrollViewに下記を加えてましたが、やはり正しく動作しませんでした。
Dart
1physics: panelController.isPanelClosed ? const NeverScrollableScrollPhysics() : const AlwaysScrollableScrollPhysics(),
![guest](/img/icon/icnUserSample.jpg)
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2024/06/13 12:50
2024/06/15 12:27