fix: foreignObject clipping and transform

software-mansion · Jan 11, 2020 · 85e7943 · 85e7943
1 parent f18c483
commit 85e7943
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 1 deletion.
diff --git a/android/src/main/java/com/horcrux/svg/ForeignObjectView.java b/android/src/main/java/com/horcrux/svg/ForeignObjectView.java
@@ -10,6 +10,11 @@
 package com.horcrux.svg;
 
 import android.annotation.SuppressLint;
+import android.graphics.Canvas;
+import android.graphics.Paint;
+import android.view.View;
+
+import androidx.annotation.NonNull;
 
 import com.facebook.react.bridge.Dynamic;
 import com.facebook.react.bridge.ReactContext;
@@ -27,6 +32,23 @@ public ForeignObjectView(ReactContext reactContext) {
         super(reactContext);
     }
 
+    @Override
+    void draw(Canvas canvas, Paint paint, float opacity) {
+        float x = (float)relativeOnWidth(mX);
+        float y = (float)relativeOnHeight(mY);
+        float w = (float)relativeOnWidth(mW);
+        float h = (float)relativeOnHeight(mH);
+        canvas.translate(x, y);
+        canvas.clipRect(0, 0, w, h);
+        super.draw(canvas, paint, opacity);
+    }
+
+    @Override
+    public void onDescendantInvalidated(@NonNull View child, @NonNull View target) {
+        super.onDescendantInvalidated(child, target);
+        invalidate();
+    }
+
     @ReactProp(name = "x")
     public void setX(Dynamic x) {
         mX = SVGLength.from(x);

diff --git a/ios/Elements/RNSVGForeignObject.m b/ios/Elements/RNSVGForeignObject.m
@@ -18,7 +18,20 @@ - (UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
 - (void)parseReference
 {
     self.dirty = false;
-    [self.svgView defineForeignObject:self foreignObjectName:self.name];
+}
+
+- (void)renderLayerTo:(CGContextRef)context rect:(CGRect)rect
+{
+    [self clip:context];
+    CGContextTranslateCTM(context, [self relativeOnWidth:self.x], [self relativeOnHeight:self.y]);
+    CGRect clip = CGRectMake(
+                             0,
+                             0,
+                             [self relativeOnWidth:self.foreignObjectwidth],
+                             [self relativeOnHeight:self.foreignObjectheight]
+                             );
+    CGContextClipToRect(context, clip);
+    [super renderLayerTo:context rect:rect];
 }
 
 - (void)setX:(RNSVGLength *)x