Skip to content

Commit

Permalink
RN: Add Support for overflow on Android
Browse files Browse the repository at this point in the history
Summary:
Adds support for the `overflow` style property on React Native for Android.

This switches overflowing views to be visible by default with the ability to override this at the container level using `overflow: 'hidden'`. This is the same behavior as React Native on iOS.

One major caveat to this solution is that it uses `setClipChildren` which does not extend the hit target to the overflow draw regions. While this is a pitfall, the current state of React Native on Android where `overflow` is hidden by default (which is the opposite of iOS) is also a huge pitfall. But I think this moves us in the right direction because where you *don't* need the touch behavior, you are now able to leverage overflow draws.

Reviewed By: himabindugadupudi

Differential Revision: D8666509

fbshipit-source-id: 5e98e658e16188414016260224caa696b4fbd390
  • Loading branch information
yungsters authored and facebook-github-bot committed Jun 28, 2018
1 parent 0a3055d commit 6110a4c
Show file tree
Hide file tree
Showing 2 changed files with 4 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -254,8 +254,8 @@ public static boolean isLayoutOnly(ReadableMap map, String prop) {
return map.isNull(BORDER_RIGHT_WIDTH) || map.getDouble(BORDER_RIGHT_WIDTH) == 0d;
case BORDER_BOTTOM_WIDTH:
return map.isNull(BORDER_BOTTOM_WIDTH) || map.getDouble(BORDER_BOTTOM_WIDTH) == 0d;
case OVERFLOW: // We do nothing with this right now.
return true;
case OVERFLOW:
return map.isNull(OVERFLOW) || map.getString(OVERFLOW) == "visible";
default:
return false;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,7 @@ public void onLayoutChange(

public ReactViewGroup(Context context) {
super(context);
setClipChildren(false);
mDrawingOrderHelper = new ViewGroupDrawingOrderHelper(this);
}

Expand Down Expand Up @@ -638,6 +639,7 @@ public void setHitSlopRect(@Nullable Rect rect) {
}

public void setOverflow(String overflow) {
setClipChildren(mOverflow == "hidden");
mOverflow = overflow;
invalidate();
}
Expand Down

5 comments on commit 6110a4c

@sunnylqm
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👏

@yungsters
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This approach is actually flawed, but I have an alternative fix coming soon.

@rodrigobdz
Copy link

@rodrigobdz rodrigobdz commented on 6110a4c Jul 19, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is the fix scheduled for the august release?

@yungsters
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes.

@yongjiliu
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What flaw?

Please sign in to comment.