When I scroll down the list in open panel (since, there is a list in the open panel state), instead of just scrolling the list down, the panel also closes.
Describe the bug
I used SlideUpPanel() to make a transition from collapsed to isPanelOpen mode, but since isPanelOpen mode contains an
CustomScrollView and hence AppBar and body, the body contains a list, so there is no issue when I open the panel and scroll down (i.e towards the bottom of list), but as I scroll up (towards AppBar/ top of the list), the panel collapses along with list being scrolled up, if the list is little bit long, then the panel will collapse before the list reaches its top, hence is very irritating.
To Reproduce Steps to reproduce the behavior:
In panelBuilder: include a ListView of say 50 itemCount, and scroll to the bottom of the list, then scroll Up towards top of the list, the panel will collapse along with list being scrolled
Expected behavior I expect the panel to not collapse the screen until top of the list is reached.
Smartphone (please complete the following information):
- Device: [e.g. Nokia 4.2]
- OS: [e.g. iOS8.1]
- Flutter Version [e.g. 2.2]
- sliding_up_panel Version [e.g. ^2.0.0+1]
Sample main.dart
Please provide a sample main.dart that reproduces this issue. The code provided here should be able to be run on its own without any external dependencies.
import 'package:flutter/material.dart';
import 'package:sliding_up_panel/sliding_up_panel.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primaryColor: Colors.teal[800],
),
home: SlideUpScreen(),
);
}
}
class Homepage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Slide up panel'),
),
);
}
}
class SlideUpScreen extends StatelessWidget {
final PanelController _pc = PanelController();
final String imgNet =
'https://1.bp.blogspot.com/-DDfhSEHLOGY/W3E2QCUpnkI/AAAAAAAACgw/pUTISwS2sOwH2RwbY6kslorz6C6epSYbACLcBGAs/s1600/Slide13.JPG';
@override
Widget build(BuildContext context) {
print(MediaQuery.of(context).size.height);
return Material(
child: SlidingUpPanel(
controller: _pc,
maxHeight: MediaQuery.of(context).size.height * 0.98,
minHeight: MediaQuery.of(context).size.height / 4.54,
borderRadius: BorderRadius.vertical(
top: Radius.circular(8),
),
backdropEnabled: true,
panelBuilder: (sc) {
return CustomScrollView(
slivers: [
SliverAppBar(
pinned: true,
expandedHeight: 200,
flexibleSpace: FlexibleSpaceBar(
title: Text('Counting with Parking'),
background: DecoratedBox(
position: DecorationPosition.foreground,
decoration: BoxDecoration(
borderRadius: BorderRadius.vertical(
top: Radius.circular(8),
),
gradient: LinearGradient(
colors: [Colors.teal[800]!, Colors.transparent],
begin: Alignment.bottomCenter,
end: Alignment.center),
),
child: Image.network(
imgNet,
fit: BoxFit.cover,
),
),
),
),
SliverList(
delegate: SliverChildBuilderDelegate((ctx, index) {
return ListTile(
leading: Icon(Icons.construction),
title: Text('${index + 1}'),
);
}, childCount: 20),
)
],
);
},
onPanelOpened: () => {_pc.open()},
collapsed: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.vertical(
top: Radius.circular(8),
),
color: Colors.teal[800]!,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Container(
constraints: BoxConstraints(
maxHeight: 200,
maxWidth: 175,
minWidth: 75,
),
margin: EdgeInsets.only(left: 10),
child: ClipRRect(
borderRadius: BorderRadius.circular(10),
child: Image.network(
imgNet,
fit: BoxFit.cover,
),
),
),
SizedBox(
height: 200,
child: SingleChildScrollView(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
mainAxisSize: MainAxisSize.min,
children: [
SizedBox(
height: 15,
),
Text(
'Building office',
style: TextStyle(
color: Colors.blueGrey[50],
fontSize: 22,
fontWeight: FontWeight.w500,
),
),
Text(
'Hours: Open',
style: TextStyle(
color: Colors.blueGrey[50],
fontSize: 22,
fontWeight: FontWeight.w500,
),
),
Text(
'8am - 11 pm',
style: TextStyle(
color: Colors.blueGrey[50],
fontSize: 22,
fontWeight: FontWeight.w500,
),
),
SizedBox(
height: 7,
),
],
),
),
),
],
),
),
body: Scaffold(
appBar: AppBar(
title: Text("SlidingUpPanelExample"),
),
body: SingleChildScrollView(
child: Column(
children: [
Row(
children: [
TextButton(
onPressed: () => _pc.show(),
child: Text('Show Panel'),
),
TextButton(
onPressed: () => _pc.hide(),
child: Text('Hide Panel'),
),
],
),
Row(
children: [
TextButton(
onPressed: () {
_pc.open();
},
child: Text('Open Panel'),
),
TextButton(
onPressed: () => _pc.close(),
child: Text('Close Panel'),
),
],
),
],
),
)),
));
}
}
@sudo-saksham did you find any solution?
nope.
do you find any solution ?
@sudo-saksham
no. @Harsh4598
Hey, try to pass ScrollController from panel into your SingleChildScrollView.
From example
panelBuilder: (scrollController) => _panel(scrollController),
_panel(ScrollController sc) => SingleChildScrollView( controller: sc, ....
@kurtiev thanks... it does work! I had a listView inside that panel and in its controller property i passed the Panels controller. Now when I scroll down it only shuts after the list hits the end and cant scroll any further. but it would be nice to know whats the logic behind that.
After you pass the Panel's scrollcontroller to the ListView what really happens... does the panels scrollcontroller not kick in untill the list hits the end???
The issue for two different list view in slidup panel when i scroll down towards to the bottom the panel will close ....
Use the scroll contro. It will help you .
On Wed, Feb 9, 2022 at 11:57 PM cc-appdev @.***> wrote:
The issue for two different list view in slidup panel when i scroll down towards to the bottom the panel will close ....
— Reply to this email directly, view it on GitHub https://github.com/akshathjain/sliding_up_panel/issues/252#issuecomment-1034493984, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKS5VKJWECAQU4SXGKRVY7LU2NAVJANCNFSM45LG5WPQ . Triage notifications on the go with GitHub Mobile for iOS https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675 or Android https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub.
You are receiving this because you were mentioned.Message ID: @.***>
-- Sent from Gmail Mobile
ScrollController
@kurtiev @YohanWadia @appdeveploment @Harsh4598 how to pass the scrollontroller , I don't get it panel builder accepts no arguments