Use the layer tree to do more efficient calculation of transform/clip (#401)

Author: dnfield

packages/visibility_detector/lib/src/render_visibility_detector.dart

@@ -165,7 +165,7 @@ mixin RenderVisibilityDetectorBase on RenderObject {
   }
 
   VisibilityInfo _determineVisibility(ContainerLayer? layer, Rect bounds) {
-    if (_disposed || layer?.attached == false || !attached) {
+    if (_disposed || layer == null || layer.attached == false || !attached) {
       // layer is detached and thus invisible.
       return VisibilityInfo(
         key: key,
@@ -174,39 +174,50 @@ mixin RenderVisibilityDetectorBase on RenderObject {
     }
     final transform = Matrix4.identity();
 
-    // Create a list of RenderObjects from this to the root, excluding the root
+    // Check if any ancestors decided to skip painting this RenderObject.
+    if (parent != null) {
+      RenderObject ancestor = parent! as RenderObject;
+      RenderObject child = this;
+      while (ancestor.parent != null) {
+        if (!ancestor.paintsChild(child)) {
+          return VisibilityInfo(key: key, size: bounds.size);
+        }
+        child = ancestor;
+        ancestor = ancestor.parent! as RenderObject;
+      }
+    }
+
+    // Create a list of Layers from layer to the root, excluding the root
     // since that has the DPR transform and we want to work with logical pixels.
-    // Cannot use the layer tree since some ancestor render object may have
-    // directly transformed/clipped the canvas. If there is some way to figure
-    // out how to get the RenderObjects below [layer], could take advantage of
-    // the usually shallower height of the layer tree compared to the render
-    // tree. Alternatively, if the canvas itself exposed the current matrix/clip
-    // we could use that.
-    RenderObject? ancestor = parent as RenderObject?;
-
-    final List<RenderObject> ancestors = <RenderObject>[];
-    ancestors.add(this);
-    RenderObject child = this;
+    // Add one extra leaf layer so that we can apply the transform of `layer`
+    // to the matrix.
+    ContainerLayer? ancestor = layer;
+    final List<ContainerLayer> ancestors = <ContainerLayer>[ContainerLayer()];
     while (ancestor != null && ancestor.parent != null) {
-      if (!ancestor.paintsChild(child)) {
-        return VisibilityInfo(key: key, size: bounds.size);
-      }
       ancestors.add(ancestor);
-      child = ancestor;
-      ancestor = ancestor.parent as RenderObject?;
+      ancestor = ancestor.parent;
     }
 
-    // Determine the transform and clip from first child of root down to
-    // this.
     Rect clip = Rect.largest;
     for (int index = ancestors.length - 1; index > 0; index -= 1) {
       final parent = ancestors[index];
       final child = ancestors[index - 1];
-      Rect? parentClip = parent.describeApproximatePaintClip(child);
+      Rect? parentClip = parent.describeClipBounds();
       if (parentClip != null) {
         clip = clip.intersect(MatrixUtils.transformRect(transform, parentClip));
       }
-      parent.applyPaintTransform(child, transform);
+      parent.applyTransform(child, transform);
+    }
+
+    // Apply whatever transform/clip was on the canvas when painting.
+    if (_lastPaintClipBounds != null) {
+      clip = clip.intersect(MatrixUtils.transformRect(
+        transform,
+        _lastPaintClipBounds!,
+      ));
+    }
+    if (_lastPaintTransform != null) {
+      transform.multiply(_lastPaintTransform!);
     }
     return VisibilityInfo.fromRects(
       key: key,
@@ -219,9 +230,17 @@ mixin RenderVisibilityDetectorBase on RenderObject {
   /// clients about visibility.
   Rect get bounds;
 
+  Matrix4? _lastPaintTransform;
+  Rect? _lastPaintClipBounds;
+
   @override
   void paint(PaintingContext context, Offset offset) {
     if (onVisibilityChanged != null) {
+      _lastPaintClipBounds = context.canvas.getLocalClipBounds();
+      _lastPaintTransform =
+          Matrix4.fromFloat64List(context.canvas.getTransform())
+            ..translate(offset.dx, offset.dy, 0);
+
       _compositionCallbackCanceller?.call();
       _compositionCallbackCanceller =
           context.addCompositionCallback((Layer layer) {

packages/visibility_detector/test/render_visibility_detector_test.dart

@@ -28,6 +28,9 @@ void main() {
     detector.layout(BoxConstraints.tight(const Size(200, 200)));
     detector.paint(context, Offset.zero);
     detector.paint(context, Offset.zero);
+
+    context.stopRecordingIfNeeded(); // ignore: invalid_use_of_protected_member
+
     expect(layer.subtreeHasCompositionCallbacks, true);
 
     expect(detector.debugScheduleUpdateCount, 0);
@@ -73,6 +76,7 @@ void main() {
     expect(layer.subtreeHasCompositionCallbacks, true);
 
     expect(detector.debugScheduleUpdateCount, 0);
+    context.stopRecordingIfNeeded(); // ignore: invalid_use_of_protected_member
     layer.buildScene(SceneBuilder()).dispose();
 
     expect(detector.debugScheduleUpdateCount, 1);
@@ -98,6 +102,7 @@ void main() {
     expect(layer.subtreeHasCompositionCallbacks, false);
 
     expect(detector.debugScheduleUpdateCount, 0);
+    context.stopRecordingIfNeeded(); // ignore: invalid_use_of_protected_member
     layer.buildScene(SceneBuilder()).dispose();
 
     expect(detector.debugScheduleUpdateCount, 0);
@@ -124,6 +129,7 @@ void main() {
     expect(layer.subtreeHasCompositionCallbacks, false);
 
     expect(detector.debugScheduleUpdateCount, 0);
+    context.stopRecordingIfNeeded(); // ignore: invalid_use_of_protected_member
     layer.buildScene(SceneBuilder()).dispose();
 
     expect(detector.debugScheduleUpdateCount, 0);

packages/visibility_detector/test/widget_test.dart

@@ -25,6 +25,73 @@ void main() {
 
   tearDown(_positionToVisibilityInfo.clear);
 
+  testWidgets('Offset coming into paint applied to clip',
+      (WidgetTester tester) async {
+    VisibilityInfo? lastInfo;
+    await tester.pumpWidget(
+      Center(
+        child: SizedBox(
+          height: 400,
+          width: 400,
+          child: Transform(
+            transform: Matrix4.identity()..translate(0.0, -300.0),
+            child: ClipRect(
+              clipBehavior: Clip.hardEdge,
+              child: VisibilityDetector(
+                key: UniqueKey(),
+                onVisibilityChanged: (info) {
+                  lastInfo = info;
+                },
+                child: Container(width: 200, height: 350, color: Colors.red),
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+    await tester.pump(VisibilityDetectorController.instance.updateInterval);
+    expect(lastInfo, isNotNull);
+    expect(lastInfo!.visibleFraction, 1.0);
+    await tester.pumpWidget(const Placeholder());
+    await tester.pump(VisibilityDetectorController.instance.updateInterval);
+  });
+
+  testWidgets('Transform in layer tree, clip on canvas gets transformed',
+      (WidgetTester tester) async {
+    VisibilityInfo? lastInfo;
+    await tester.pumpWidget(
+      Center(
+        child: SizedBox(
+          height: 400,
+          width: 400,
+          child: Transform(
+            transform: Matrix4.identity()
+              ..translate(0.0, -300.0)
+              ..scale(-.9, -.9),
+            child: Opacity(
+              opacity: .8,
+              child: ClipRect(
+                clipBehavior: Clip.hardEdge,
+                child: VisibilityDetector(
+                  key: UniqueKey(),
+                  onVisibilityChanged: (info) {
+                    lastInfo = info;
+                  },
+                  child: Container(width: 200, height: 350, color: Colors.red),
+                ),
+              ),
+            ),
+          ),
+        ),
+      ),
+    );
+    await tester.pump(VisibilityDetectorController.instance.updateInterval);
+    expect(lastInfo, isNotNull);
+    expect(lastInfo!.visibleFraction, 1.0);
+    await tester.pumpWidget(const Placeholder());
+    await tester.pump(VisibilityDetectorController.instance.updateInterval);
+  });
+
   _wrapTest(
     'VisibilityDetector properly builds',
     callback: (tester) async {