akshathjain / sliding_up_panel

A draggable Flutter widget that makes implementing a SlidingUpPanel much easier!
https://pub.dartlang.org/packages/sliding_up_panel
Other
1.38k stars 378 forks source link

Fix exception when panelBuilder ScrollController attached to multiple views & SafeArea on iPhones #204

Open tneotia opened 4 years ago

tneotia commented 4 years ago

Situation:

This PR has fixed the exception and, as far as I can tell, maintains the original functionality. I tested the example app as well as my app and the scrolling behavior works like normal. Feel free to update this PR if a specific use case is broken because of this, testing will definitely be necessary.

BazinC commented 3 years ago

Hi @tneotia , I'm glad to meet someone who use SlidingUpPanel + panelBuilder + Tabs :) Could you please show me how you handled the 2 directions swipe conflict ? I have an issue, when the list in a tab is scrolled to the top, if I want to swipe horizontally to another tab, the vertical slide is triggered. It's too sensitive and leads to bad UX. slidinguppanel_tabs

Repo to reproduce here: https://github.com/BazinC/sliding_up_panel_with_tab

tneotia commented 3 years ago

Could you please show me how you handled the 2 directions swipe conflict ? I have an issue, when the list in a tab is scrolled to the top, if I want to swipe horizontally to another tab, the vertical slide is triggered. It's too sensitive and leads to bad UX.

Yeah, I saw this but after trying a lot of different things with GestureDetectors I couldn't find a way to fix this. I guess this issue is happening because the TabBar and the SlidingUpPanel cannot talk to each other. The panel isn't expecting a horizontal swipe, so any form of vertical motion is detected (even though the horizontal swipe should be detected by TabBar and ignored by the panel). I suggest you try this out on a physical device, on the iOS emulator I can get this bad UX to happen every time but on a physical device, if you are a little bit careful with the swipes you wouldn't notice it. It still isn't the best by any stretch of the imagination, though.

tneotia commented 3 years ago

Update: I gave it another look for fun and I seemed to have solved it (on your use case at least - doesn't seem to be working on mine). Basically the way it works is:

  1. Calculate initial swipe direction based on the dx and dy of the swipe movement
  2. If direction is vertical, set shouldSlide to true, or if the direction is horizontal, set shouldSlide to false
  3. The onPointerMove method runs many times during the swipe so only run the gesture funtion to slide the panel if shouldSlide is true. Basically this means that you could start swiping horizontally and then curve your swipe so it ends vertically, but the panel will not slide because your initial swipe was horizontal.
  4. Once the swipe is finished, if shouldSlide is true, run the panel flinging function (based on swipe velocity). If shouldSwipe is false, set it to true until the next swipe detection starts again and repeats the process.

I feel like there will be issues with this, can you check the commit out and see how it works on the emulator?

Edit: I think I got it working for my use case as well with a new commit I'm about to push. It seems that when swiping left/right to change tabs, the panel will not slide down (which is what we want) but when sliding down the panel, the user could still end up changing tabs (which is not what we want). A step in the right direction, though.

BazinC commented 3 years ago

Hey @tneotia , I've just tested, and your last commit fixes the issue! :) Thanks a lot 🙌

BazinC commented 3 years ago

@tneotia You should remove SafeArea you've added. People may want to keep the panel starting from the bottom of the screen. Adding ViewPadding should be handled outside of the package, by providing SafeArea to panel/panelBuilder. illustation

tneotia commented 3 years ago

@BazinC I didn't remove it entirely with the above commit but added an option for it (applySafeArea - default value false). I was having an issue within the panel where elements were getting cut off by the notch and curves of the device if my app was rotated in landscape mode, and applying SafeArea to the panelBuilder widgets didn't fix it for some reason. To fix it I had to change the plugin's functionality.

Can you try this out and see if it produces the expected functionality? I don't have access to my mac right now otherwise I would have :)

AppetiteTeam commented 3 years ago

Situation:

  • Exception: I have a TabBar inside my SlidingUpPanel's panelBuilder with 2 tabs, each with their own CustomScrollView. I was using the ScrollController of the panelBuilder on each CustomScrollView, but I would always get this error repeatedly when switching tabs:

ScrollController attached to multiple scroll views.

Same problem 🙄 scrollController from panelBuilder attached to 3 listViews, so i gotted error: _AssertionError ('package:flutter/src/widgets/scroll_controller.dart': Failed assertion: line 109 pos 12: '_positions.length == 1': ScrollController attached to multiple scroll views.)

Help 😭

AppetiteTeam commented 3 years ago

Please help me solve this problem. 😔

alanlanglois commented 2 years ago

I'm also using tabBar in my app and this bug is annoying. Any plan to merge this PR, or adapt it to fix it?

fabcall commented 2 years ago

Any progress on this?