import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter_shaders/flutter_shaders.dart';

void main() {
  runApp(const MainApp());
}

class MainApp extends StatelessWidget {
  const MainApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Stack(
          children: [
            Positioned.fill(child: GridPaper()),
            Positioned.fill(
              child: ShaderBuilder(
                assetKey: 'assets/shaders/uv.frag',
                (context, shader, child) => MyShaderWidget(shader: shader),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class MyShaderWidget extends SingleChildRenderObjectWidget {
  const MyShaderWidget({super.key, required this.shader, super.child});

  final FragmentShader shader;

  @override
  RenderObject createRenderObject(BuildContext context) {
    return RenderMyShader(shader);
  }
}

class RenderMyShader extends RenderProxyBox {
  RenderMyShader(this.shader);

  final FragmentShader shader;

  final LayerHandle<ClipRectLayer> _clipRectLayer =
      LayerHandle<ClipRectLayer>();

  final LayerHandle<BackdropFilterLayer> _backdropFilterLayer =
      LayerHandle<BackdropFilterLayer>();

  static const inset = EdgeInsets.all(66);

  @override
  void paint(PaintingContext context, Offset offset) {
    final rect = offset & size;
    _clipRectLayer.layer = context.pushClipRect(
      true,
      offset,
      inset.deflateRect(rect),
      (context, offset) {
        final layer = _backdropFilterLayer.layer ??= BackdropFilterLayer();

        layer.filter = ImageFilter.shader(shader);
        context.pushLayer(layer, (context, offset) {}, offset);
      },
      oldLayer: _clipRectLayer.layer,
    );

    super.paint(context, offset);
  }

  @override
  void dispose() {
    _clipRectLayer.layer = null;
    _backdropFilterLayer.layer = null;
    super.dispose();
  }
}