Skip to content

[Impeller] [iOS] PhysicalModel shadows are drawn with artifacts under circumstances #128410

@weidenbach

Description

@weidenbach

Is there an existing issue for this?

Steps to reproduce

Run the provided code sample with an iOS device or simulator using impeller

Expected results

The shadow should be rendered smoothly

Actual results

The shadow consists of horizontal rectangles, when the width and height are equal and are >= 512px.
This only seems to occur when the PhysicalModel is within an OverflowBox.

Code sample

Code sample
import 'package:flutter/material.dart';

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

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

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: Scaffold(
        body: Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: [
            // widthHeight >= 512 breaks shadows
            Circle(color: Colors.red, widthHeight: 512, heightOffset: 0),
            // shadows are fine when width and height are below 512
            Circle(color: Colors.green, widthHeight: 511, heightOffset: 0),
            // shadows are fine when height != width
            Circle(color: Colors.green, widthHeight: 512, heightOffset: 0.0001),
          ],
        ),
      ),
    );
  }
}

class Circle extends StatelessWidget {
  const Circle({
    Key? key,
    required this.heightOffset,
    required this.widthHeight,
    required this.color,
  }) : super(key: key);
  final double heightOffset;
  final double widthHeight;
  final Color color;
  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: Alignment.topLeft,
      child: SizedBox.shrink(
        child: OverflowBox(
          maxWidth: double.infinity,
          maxHeight: double.infinity,
          child: PhysicalModel(
            color: color,
            elevation: 50,
            shape: BoxShape.circle,
            child: SizedBox(
                width: widthHeight, height: widthHeight + heightOffset),
          ),
        ),
      ),
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration image

Logs

Logs
[Paste your logs here]

Flutter Doctor output

Doctor output
fvm flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[!] Flutter (Channel stable, 3.10.3, on macOS 13.4 22F66 darwin-arm64, locale de-DE)
    ! Warning: `dart` on your path resolves to /usr/local/Homebrew/Cellar/dart/3.0.3/libexec/bin/dart, which is not inside your current Flutter SDK checkout at /Users/pascalweidenbach/fvm/versions/3.10.3. Consider adding /Users/pascalweidenbach/fvm/versions/3.10.3/bin to the front of your path.
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 14.2)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2022.2)
[✓] Android Studio (version 2022.2)
[✓] IntelliJ IDEA Community Edition (version 2023.1.2)
[✓] VS Code (version 1.75.0)
[✓] Connected device (4 available)
[✓] Network resources

! Doctor found issues in 1 category.

Metadata

Metadata

Assignees

Labels

P1High-priority issues at the top of the work liste: impellerImpeller rendering backend issues and features requestsengineflutter/engine related. See also e: labels.found in release: 3.10Found to occur in 3.10found in release: 3.11Found to occur in 3.11has reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-iosiOS applications specificallyr: fixedIssue is closed as already fixed in a newer version

Type

No type

Projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions