Rendering bug on iPads

main.dart

// Copyright 2014 The Flutter Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.

import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

void main() =>
  runApp(
    MaterialApp(home: Scaffold(body: LightboxView()))
    );


/// Draws the complete lightbox UI, consisting of a toolbar, and the carousel.
class LightboxView extends StatefulWidget {
  const LightboxView({
    super.key,
  });

  @override
  State<LightboxView> createState() => _LightboxViewState();
}

class _LightboxViewState extends State<LightboxView> {
  late final controller =  WebViewController()
  ..setJavaScriptMode(JavaScriptMode.unrestricted)
  ..setBackgroundColor(const Color(0x00000000))
  ..setNavigationDelegate(
    NavigationDelegate(
      onProgress: (int progress) {
        // Update loading bar.
      },
      onPageStarted: (String url) {},
      onPageFinished: (String url) {},
      onHttpError: (HttpResponseError error) {},
      onWebResourceError: (WebResourceError error) {},
      onNavigationRequest: (NavigationRequest request) {
        if (request.url.startsWith('https://www.youtube.com/')) {
          return NavigationDecision.prevent;
        }
        return NavigationDecision.navigate;
      },
    ),
  )
  ..loadRequest(Uri.parse('https://flutter.dev'));

  @override
  Widget build(BuildContext context) {
    return LayoutBuilder(
      builder: (context, constraints) {
        return Material(
          color: Colors.transparent,
          child: Stack(
            children: [
              WebViewWidget(controller: controller),
              BackdropFilter(
                filter: ImageFilter.blur(
                  tileMode: TileMode.repeated,
                  sigmaX: 5.0,
                  sigmaY: 5.0,
                ),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    const Text('Test'),
                    Container(child: ListView(
                      scrollDirection: Axis.horizontal,
                      children: [
                        for (int i = 0; i < 20; i++)
                        Opacity(child: Image.network('https://picsum.photos/800/800?random=$i'), opacity: 0.9),
                      ],
                    ),
                    height: 1000),
                  ],
                ),
              ),
            ]
          ),
        );
      },
    );
  }
}