search

discord / OverlappingPanels

Overlapping Panels is a gestures-driven navigation UI library for Android
Apache License 2.0
420 stars 27 forks source link

Fix closed center panel click detection #20

Closed donaldchen closed 3 years ago

donaldchen commented 3 years ago

This PR fixes a bug where in landscape mode on a device with a display cutout (e.g. a Samsung S10), clicking the right edge of the opened left panel gets handled incorrectly as clicking the closed center panel.

Steps to reproduce the bug 1) Install the sample app with the changes in this PR on a device with a display cutout 2) Rotate the device to landscape mode. 3) Click the right edge of the "show toast" button

Buggy behavior before this PR The click gets handled as clicking the closed center panel

https://user-images.githubusercontent.com/3821698/106031575-4b49a800-6084-11eb-92a3-acf5ed2fdf12.mp4

Expected behavior after this PR The click gets handled as clicking the button, so you see the toast.

https://user-images.githubusercontent.com/3821698/106031586-4edd2f00-6084-11eb-8ca8-25cce13b3903.mp4

Using the debug logs in https://github.com/discord/OverlappingPanels/pull/20/commits/ca3a4fba0132b949be670b2e175b433309bf2016 , I observed the following values in isTouchingCenterPanelWhileSidePanelOpen. Screen Shot 2021-01-27 at 9 32 02 AM . That method tries to detect if the touch event is to the right of the left edge of the center panel. If so, it considers the click event a click on the closed center panel. However, I saw that the rawX was at 1016px while the right edge of the start panel was at 954px even though I clicked to the left of the center panel. I realized the rawX was greater than it should've been because it included the width of the display cutout which was not included in the start panel width. To fix this, I changed event.rawX to event.x. Now we consider the click event relative to the coordinates in the OverlappingPanelsLayout view when calculating isTouchingCenterPanelWhileSidePanelOpen.

tpcstld commented 3 years ago

Interesting, I kind of wonder how this issue was reproducible in my Pixel 3 simulator then, since it does not have a display cutout iirc. 🤔

donaldchen commented 3 years ago

It probably doesn't have to specifically have a display cutout. It could be something else creating window insets on the left / outside of the OverlappingPanelsLayout view. If you'd like, feel free to test out the sample app with the before-and-after changes on your Pixel 3 simulator to confirm whether this code fixes the bug for your device, too.