ios – Flutter – I have to make a qrcode display screen, the place the background have to be blurred, and the middle of the display screen cleaned

I managed so as to add the impact I needed, but it surely solely works on Android gadgets, on IOS the blur impact is on the complete display screen.
my code and prints:

Web page:

class HomePayQrcodePage extends StatelessWidget {
const HomePayQrcodePage({required this.controller, tremendous.key});

ultimate HomePayQrcodeController controller;

@override
Widget construct(BuildContext context) {
return Scaffold(
backgroundColor: AppColors.transparentWhite,
physique: _body(context),
);
}

Widget _body(BuildContext context) {
const cutOutSize = 260.0;
const borderRadius = 20.0;

    return SafeArea(
      baby: Stack(
        kids: [
          QRView(
            key: GlobalKey(debugLabel: 'HomePayPage'),
            onQRViewCreated: controller.onQRViewCreated,
          ),
          Positioned.fill(
            child: ClipPath(
              clipper: HoleClipper(
                cutOutSize: cutOutSize,
                borderRadius: borderRadius,
              ),
              child: BackdropFilter(
                filter: ImageFilter.blur(sigmaX: 6.0, sigmaY: 6.0),
                child: Container(
                  color: Colors.black54.withOpacity(0.3),
                ),
              ),
            ),
          ),
          Positioned(
            top: 10,
            left: 10,
            child: AppBackButton(onTap: controller.onClickBack),
          ),
        ],
      ),
    );

}
}

class HoleClipper extends CustomClipper<Path> {
ultimate double cutOutSize;
ultimate double borderRadius;

HoleClipper({required this.cutOutSize, required this.borderRadius});

@override
Path getClip(Measurement measurement) {
ultimate cutOutRect = RRect.fromRectAndRadius(
Rect.fromCenter(
heart: Offset(measurement.width / 2, measurement.top / 2),
width: cutOutSize,
top: cutOutSize,
),
Radius.round(borderRadius),
);

    ultimate path = Path()
      ..addRect(Rect.fromLTWH(0, 0, measurement.width, measurement.top))
      ..addRRect(cutOutRect)
      ..fillType = PathFillType.evenOdd;
    
    return path;

}

@override
bool shouldReclip(CustomClipper<Path> oldClipper) => false;
}

controller

class HomePayQrcodeController extends GetxController {
QRViewController? tQrViewController;

RxInt cardsListIndex = (Get.arguments[0] as int).obs;

@override
void dispose() {
tremendous.dispose();
tQrViewController?.dispose();
}

Future<void> onQRViewCreated(QRViewController controller) async {
tQrViewController = controller;
controller.scannedDataStream.hear(
(scanData) async {
if (Platform.isAndroid) {
controller.pauseCamera();
} else if (Platform.isIOS) {
controller.resumeCamera();
}

        String scanned = scanData.code as String;
        log('QR Code Scanned: $scanned');
    
        Get.again(outcome: scanned);
      },
    );

}

void onClickBack() {
Get.again(outcome: 'again');
}

Future<void> underConstruction() async {
await Get.toNamed(NamedRoutes.underConstruction);
}
}

Android working appropriately:
enter picture description right here

IOS with drawback:
enter picture description right here

As QRView’s personal QrScannerOverlayShape doesn’t assist the blur impact, I attempted including a stack with the primary digicam being the QRView and the second a ClipPath to make the central cutout on the display screen