mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Xin Chen
bc9168d4ca
Summary: This diff adds `overflowInset` values in RN Android. These values are used to give an enlarged boundary of a view group that also contains all its children layout. Here is [the post](https://fb.workplace.com/groups/yogalayout/permalink/2264980363573947/) that discuss more on why this is useful. I steal the pic in that post here as TLDR: {F687030994} In the above case, we will get overflowInset for ViewGroup A as something like `top: 0, right: -20, bottom: -20, left: 0`. This has been added in the [Fabric core](https://fburl.com/code/f8c5tg7b) and [in IOS](https://fburl.com/code/vkh0hpt6). In Android, since we used to ignore all event coordinates outside of a ViewGroup boundary, this is not an issue. However, that caused unregistered touch area problem and got fixed in D30104853 (https://github.com/facebook/react-native/commit/e35a963bfb93bbbdd92f4dd74d14e2ad6df5e14a), which dropped the boundary check and made the hit test algorithm in [TouchTargetHelper.java](https://fburl.com/code/dj8jiz22) worse as we now need to explore all the child node under ReactRootNode. This perf issue is getting obvious when a view loads too many items, which matches our experience with "Hover getting slow after scrolling", "Hover getting slow after going back from PDP view", and "The saved list view (in Explore) is very fast (because it has very few components)" To fix this issue, I added the support to `overflowInset` to RN Android by 1. Sending the `overflowInset` values from Binding.cpp in RN Android as a separate mount instruction 2. Update `IntBufferBatchMountItem.java` to read the int buffer sent over JNI, and pass the `overflowInset` values to `SurfaceMountingManager.java` 3. Creating new interface `ReactOverflowViewWithInset.java` and extending the existing `ReactOverflowView.java` usages 4. Adding implementation of getter and setter for `overflowInset` in various views 5. Update `TouchTargetHelper.java` to read the values and check boundaries before exploring ViewGroup's children Note that in #3 I didn't change `ReactOverflowView.java` interface directly. I am concerned about backward compatibility issues in case this interface is being used in OSS. I suggest we deprecate it as we are not using it anymore in our code. Changelog: [Internal][Android] Reviewed By: JoshuaGross Differential Revision: D33133977 fbshipit-source-id: 64e3e837fe7ca6e6dbdbc836ab0615182e10f28c
34 lines
1.2 KiB
Java
34 lines
1.2 KiB
Java
/*
|
|
* 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.graphics.Rect;
|
|
import android.view.View;
|
|
|
|
/**
|
|
* Interface that should be implemented by {@link View} subclasses that support {@code overflow}
|
|
* style and want to use the overflowInset values. This allows the overflow information to be used
|
|
* by {@link TouchTargetHelper} to determine if a View is touchable.
|
|
*/
|
|
public interface ReactOverflowViewWithInset extends ReactOverflowView {
|
|
/**
|
|
* Get the overflow inset rect values which indicate the extensions to the boundaries of current
|
|
* view that wraps all of its children views
|
|
*
|
|
* @return Rect of integers indicating the left, top, right, bottom pixel extensions. The values
|
|
* are non-positive (indicating enlarged boundaries).
|
|
*/
|
|
Rect getOverflowInset();
|
|
|
|
/**
|
|
* Set the overflow inset rect values which indicate the extensions to the boundaries of current
|
|
* view that wraps all of its children views
|
|
*/
|
|
void setOverflowInset(int left, int top, int right, int bottom);
|
|
}
|