Prevent accidental back swipes

[Janneman84]

Newer Android phones rely on swiping the edge of the screen to go back. I noticed it's very easy to accidentally do this when trying to resize/move the crop box when it's near the edge of the screen. This can be really annoying.

https://developer.android.com/training/gestures/gesturenav#games

According to this link it's possible to block this by setting setSystemGestureExclusionRects(). If you use this to set the blocked area to the touchable area of the crop box you should be good to go. If working correctly you should still be able to swipe back if the crop box is not near the edge of the screen but you won't accidentally go back if it does.

How to test:

• set phone to use gesture bar (instead of old school 3 button nav bar)
• make the crop box as big as possible
• try resizing the crop box by grabbing the left or right edge and move inward
• back swipe gets triggered

I'm not familiar with the source code of this package so it's difficult to fix myself, anyone care to try to fix this?

[Canato]

@Janneman84 I believe you can use some options to help you

setInitialCropWindowPaddingRatio(0.1f)
setBorderLineThickness(3f)
setBorderCornerThickness(2f)
setBorderCornerOffset(5f)
setInitialCropWindowRectangle(null)

And others, let me know if works

list of features

[Canato]

If don't help what you want, feel free to open a PR so we can improve the experience ^^

Will use some tags in case another person wanna help

[Janneman84]

I downloaded the sample app and started messing around. It's actually a pretty straightforward fix. Turns out that you can only block the back swipe at most 200dp vertically (which explains the issues I had). So you have to be selective which areas to block (you can't block the entire screen). I'll try 60 for each corner and 80 for the center.

So the solution is there but it will take me some time to flesh it out

[Janneman84]

Ok I think I got it. I'm not really familiar with PRs and stuff so I'll just dump some code here:

Add this code to CropOverlayView.kt:

/** Stores areas that block back swipes. **/
private val exclusionRects = listOf(Rect(), Rect(), Rect())

/**
 *  Newer Android phones let you go back by swiping from the left or right edge of the screen inwards.
 *  When the crop window is near the edge it's easy to accidentally swipe back when trying to resize it.
 *  This can be prevented by setting systemGestureExclusionRects. However you can only exclude max 200dp vertically.
 *  Therefore a top, middle and bottom strip are used so at least the corners and the vertical middle of the crop window are covered.
 * **/
@RequiresApi(Build.VERSION_CODES.Q)
private fun setSystemGestureExclusionRects() {
    val cropWindowRect = mCropWindowHandler.getRect().toRect()
    val maxVerticalExclusion = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 200f, Resources.getSystem().displayMetrics)
    val touchMargin = mTouchRadius.roundToInt()
    val rectTop     = exclusionRects.get(0)
    val rectMiddle  = exclusionRects.get(1)
    val rectBottom  = exclusionRects.get(2)

    rectTop.left  = cropWindowRect.left  - touchMargin
    rectTop.right = cropWindowRect.right + touchMargin
    rectTop.top   = cropWindowRect.top   - touchMargin
    rectTop.bottom= (rectTop.top + (maxVerticalExclusion * 0.3)).toInt()

    rectMiddle.left  = rectTop.left
    rectMiddle.right = rectTop.right
    rectMiddle.top   = ((cropWindowRect.top + cropWindowRect.bottom)/2.0 - (maxVerticalExclusion * 0.2)).toInt()
    rectMiddle.bottom= (rectMiddle.top + (maxVerticalExclusion * 0.4)).toInt()

    rectBottom.left  = rectTop.left
    rectBottom.right = rectTop.right
    rectBottom.bottom= cropWindowRect.bottom + touchMargin
    rectBottom.top   = (rectBottom.bottom - (maxVerticalExclusion * 0.3)).toInt()

    systemGestureExclusionRects = exclusionRects
}

And add this to the bottom of its onDraw() method:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.Q) {
    setSystemGestureExclusionRects()
}

You may want to move maxVerticalExclusion to CropImageOptions.kt similarly to mTouchRadius.

I gave it a good test and it seems to work perfectly as far as I can tell.

[Canato]

Will wait for someone to open a PR ^^

Contributing guide

[Janneman84]

I'm first supposed to create a new branch right? When I do and try to push it it keep saying invalid username or password.

Frankly I have no idea what I'm doing and finding descent info is nearly impossible...

[Canato]

Hey @Janneman84 let me try to help you 🚀

The link I gave you has a session Doing some code

There are some steps there. Step 3 says:

Fork the repo, develop and test your code changes.

You need to fork not branch ^^.
You can branch your fork if you prefer, but not needed.
Later you need to open a PR from your fork to the main repo.

[Janneman84]

Ok I think I got it now, can you check?