Fix to make taps on views outside parent bounds work on Android (#29039)

Summary:
By default, Views in React Native have `overflow: visible`. When a child view is outside of the parent view's boundaries, it's visible on Android, but not tappable. This behaviour is incorrect, and doesn't match iOS behaviour.

- Taps on Views outside the bounds of a parent with `overflow: visible` (or unset) should register
- Taps on Views outside the bounds of a parent with `overflow: hidden` should continue to not register

Related issues:

- fixes https://github.com/facebook/react-native/issues/21455
- fixes https://github.com/facebook/react-native/issues/27061
- fixes https://github.com/facebook/react-native/issues/27232

### Fix

- Made `findTouchTargetView` not check that the touch was in the bounds of the immediate children, but instead
  - Check that the touch is in its own bounds when returning itself
  - Check that the touch for a child is in its own bounds only when `overflow: hidden` is set
- Modified related code to adjust to this change
- Added RNTesterApp test

## Changelog

<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->

[Android] [Fixed] - Allow taps on views outside the bounds of a parent with `overflow: hidden`

Pull Request resolved: https://github.com/facebook/react-native/pull/29039

Test Plan:
This can be tested with 2 examples added to the bottom of the PointerEvents page of the RNTesterApp:

| Before | After |
| --- | --- |
| ![Before](https://user-images.githubusercontent.com/2937410/83610933-19079b00-a535-11ea-8add-22daae0191e1.gif) | ![After](https://user-images.githubusercontent.com/2937410/83610583-8830bf80-a534-11ea-97e2-71e180a70343.gif) |

Reviewed By: ShikaSD

Differential Revision: D30104853

Pulled By: JoshuaGross

fbshipit-source-id: 644a109706258bfe829096354dfe477599e2db23
This commit is contained in:
Harry Yu authored and Facebook GitHub Bot committed 2021-08-06 12:33:08 -07:00
1 parent c677e196a9
commit e35a963bfb
6 files changed
+248 -74

No files matched your search

@@ -0,0 +1,25 @@
/*
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
package com.facebook.react.uimanager;
import android.view.View;
import androidx.annotation.Nullable;
/**
* Interface that should be implemented by {@link View} subclasses that support {@code overflow}
* style. This allows the overflow information to be used by {@link TouchTargetHelper} to determine
* if a View is touchable.
*/
public interface ReactOverflowView {
/**
* Gets the overflow state of a view. If set, this should be one of {@link ViewProps#HIDDEN},
* {@link ViewProps#VISIBLE} or {@link ViewProps#SCROLL}.
*/
@Nullable
String getOverflow();
}