fix overflow hidden

Reviewed By: shergin

Differential Revision: D5917111

fbshipit-source-id: e3d97f26b6aada199f700ec6659ace0d7dffd4c5

ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewBackgroundDrawable.java

@@ -9,11 +9,6 @@
 
 package com.facebook.react.views.view;
 
-import javax.annotation.Nullable;
-
-import java.util.Arrays;
-import java.util.Locale;
-
 import android.graphics.Canvas;
 import android.graphics.Color;
 import android.graphics.ColorFilter;
@@ -26,11 +21,13 @@ import android.graphics.Rect;
 import android.graphics.RectF;
 import android.graphics.drawable.Drawable;
 import android.os.Build;
-
-import com.facebook.yoga.YogaConstants;
 import com.facebook.react.common.annotations.VisibleForTesting;
 import com.facebook.react.uimanager.FloatUtil;
 import com.facebook.react.uimanager.Spacing;
+import com.facebook.yoga.YogaConstants;
+import java.util.Arrays;
+import java.util.Locale;
+import javax.annotation.Nullable;
 
 /**
  * A subclass of {@link Drawable} used for background of {@link ReactViewGroup}. It supports
@@ -231,6 +228,10 @@ public class ReactViewBackgroundDrawable extends Drawable {
     }
   }
 
+  public float getRadius() {
+    return mBorderRadius;
+  }
+
   public void setColor(int color) {
     mColor = color;
     invalidateSelf();
@@ -334,10 +335,8 @@ public class ReactViewBackgroundDrawable extends Drawable {
     mPaint.setPathEffect(mPathEffectForBorderStyle);
   }
 
-  /**
-   * For rounded borders we use default "borderWidth" property.
-   */
-  private float getFullBorderWidth() {
+  /** For rounded borders we use default "borderWidth" property. */
+  public float getFullBorderWidth() {
     return (mBorderWidth != null && !YogaConstants.isUndefined(mBorderWidth.getRaw(Spacing.ALL))) ?
         mBorderWidth.getRaw(Spacing.ALL) : 0f;
   }

ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewGroup.java

@@ -10,8 +10,11 @@
 package com.facebook.react.views.view;
 
 import android.content.Context;
+import android.graphics.Canvas;
 import android.graphics.Color;
+import android.graphics.Path;
 import android.graphics.Rect;
+import android.graphics.RectF;
 import android.graphics.drawable.Drawable;
 import android.graphics.drawable.LayerDrawable;
 import android.os.Build;
@@ -31,6 +34,7 @@ import com.facebook.react.uimanager.ReactClippingViewGroupHelper;
 import com.facebook.react.uimanager.ReactPointerEventsView;
 import com.facebook.react.uimanager.ReactZIndexedViewGroup;
 import com.facebook.react.uimanager.ViewGroupDrawingOrderHelper;
+import com.facebook.yoga.YogaConstants;
 import javax.annotation.Nullable;
 
 /**
@@ -93,12 +97,14 @@ public class ReactViewGroup extends ViewGroup implements
   private int mAllChildrenCount;
   private @Nullable Rect mClippingRect;
   private @Nullable Rect mHitSlopRect;
+  private @Nullable String mOverflow;
   private PointerEvents mPointerEvents = PointerEvents.AUTO;
   private @Nullable ChildrenLayoutChangeListener mChildrenLayoutChangeListener;
   private @Nullable ReactViewBackgroundDrawable mReactBackgroundDrawable;
   private @Nullable OnInterceptTouchEventListener mOnInterceptTouchEventListener;
   private boolean mNeedsOffscreenAlphaCompositing = false;
   private final ViewGroupDrawingOrderHelper mDrawingOrderHelper;
+  private @Nullable Path mPath;
 
   public ReactViewGroup(Context context) {
     super(context);
@@ -584,6 +590,11 @@ public class ReactViewGroup extends ViewGroup implements
     mHitSlopRect = rect;
   }
 
+  public void setOverflow(String overflow) {
+    mOverflow = overflow;
+    invalidate();
+  }
+
   /**
    * Set the background for the view or remove the background. It calls {@link
    * #setBackground(Drawable)} or {@link #setBackgroundDrawable(Drawable)} based on the sdk version.
@@ -599,4 +610,45 @@ public class ReactViewGroup extends ViewGroup implements
     }
   }
 
+  @Override
+  protected void dispatchDraw(Canvas canvas) {
+    if (mOverflow != null) {
+      switch (mOverflow) {
+        case "visible":
+          if (mPath != null) {
+            mPath.rewind();
+          }
+          break;
+        case "hidden":
+          if (mReactBackgroundDrawable != null) {
+            float left = 0f;
+            float top = 0f;
+            float right = getWidth();
+            float bottom = getHeight();
+            if (mReactBackgroundDrawable.getFullBorderWidth() != 0f) {
+              float borderWidth = mReactBackgroundDrawable.getFullBorderWidth();
+              left += borderWidth;
+              top += borderWidth;
+              right -= borderWidth;
+              bottom -= borderWidth;
+            }
+            float radius = mReactBackgroundDrawable.getRadius();
+
+            if (radius != YogaConstants.UNDEFINED) {
+              if (mPath == null) {
+                mPath = new Path();
+              }
+              mPath.rewind();
+              mPath.addRoundRect(
+                  new RectF(left, top, right, bottom), radius, radius, Path.Direction.CW);
+              canvas.clipPath(mPath);
+            }
+          }
+          break;
+        default:
+          break;
+      }
+    }
+    super.dispatchDraw(canvas);
+  }
 }

ReactAndroid/src/main/java/com/facebook/react/views/view/ReactViewManager.java

@@ -163,6 +163,11 @@ public class ReactViewManager extends ViewGroupManager<ReactViewGroup> {
     // handled in NativeViewHierarchyOptimizer
   }
 
+  @ReactProp(name = ViewProps.OVERFLOW)
+  public void setOverflow(ReactViewGroup view, String overflow) {
+    view.setOverflow(overflow);
+  }
+
   @Override
   public String getName() {
     return REACT_CLASS;