Simulator Flickering Issue with Latest Flutter and iOS Versions #148660

sinnoorc · 2024-05-20T06:20:40Z

Steps to reproduce

After updating Flutter to version 3.22 and iOS to version 17.5, I've encountered a bug in the iOS simulator. The simulator screen flickers whenever an animation occurs, such as when a loading indicator is displayed. This issue did not exist before the updates.

Update Flutter and iOS:
- Ensure your Flutter is updated to version 3.22.
- Ensure your iOS is updated to version 17.5.
Open a Flutter Project:
Add an Animation:
Run the Project in the iOS Simulator:
- Open the iOS simulator.
- Run the Flutter project using the command flutter run.
Observe the Issue:
- Observe the simulator for any screen flickering when the animation (e.g., the loading indicator) is running.

Environment

Flutter version: 3.22
iOS version: 17.5
Simulator device: [iPhone 15 pro]

Expected results

The iOS simulator should run smoothly without any screen flickering during animations. For example, when a loading indicator is displayed, the animation should appear seamlessly without any visual disturbances. The application should function as intended, providing a stable and clear user experience.

Actual results

After updating Flutter to version 3.22 and iOS to version 17.5, the iOS simulator exhibits screen flickering whenever an animation occurs. For example, when a loading indicator is displayed, the screen flickers continuously, disrupting the animation and overall user experience. This issue was not present before the updates.

Code sample

import 'package:flutter/material.dart';

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

     class MyApp extends StatelessWidget {
       @override
       Widget build(BuildContext context) {
         return MaterialApp(
           home: Scaffold(
             appBar: AppBar(title: Text('Flicker Test')),
             body: Center(
               child: CircularProgressIndicator(),
             ),
           ),
         );
       }
     }

Screenshots or Video

Screenshots / Video demonstration

Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-05-20.at.11.44.16.mp4

Logs

https://pastebin.com/BjRKbn8J

Flutter Doctor output

Doctor output

flutter doctor -v
[✓] Flutter (Channel stable, 3.22.0, on macOS 14.5 23F79 darwin-x64, locale en-IN)
    • Flutter version 3.22.0 on channel stable at /Users/macsho/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5dcb86f68f (11 days ago), 2024-05-09 07:39:20 -0500
    • Engine revision f6344b75dc
    • Dart version 3.4.0
    • DevTools version 2.34.3

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/macsho/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/macsho/Library/Android/sdk
    • ANDROID_SDK_ROOT = /Users/macsho/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11572160)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.4)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15F31d
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.3)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.10+0-17.0.10b1087.21-11572160)

[✓] VS Code (version 1.89.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.89.20240501

[✓] Connected device (4 available)
    • Sinnoor’s iPhone (mobile) • 00008110-0016391E2E29401E            • ios            • iOS 17.5 21F79
    • iPhone 15 Pro (mobile)    • 057185C5-1CED-4300-9FDE-24444626C307 • ios            •
      com.apple.CoreSimulator.SimRuntime.iOS-17-5 (simulator)
    • macOS (desktop)           • macos                                • darwin-x64     • macOS 14.5 23F79 darwin-x64
    • Chrome (web)              • chrome                               • web-javascript • Google Chrome 124.0.6367.208

[✓] Network resources
    • All expected network resources are available.

• No issues found!

The text was updated successfully, but these errors were encountered:

darshankawar · 2024-05-20T12:44:18Z

Thanks for the report @sinnoorc
It seems to be OS version specific, as I wasn't able to replicate this on iOS 15.
Can you check if this only occurs using impeller or without it as well ? You can disable it as below in info.plist and re-run your scenario to confirm.


<key>FLTEnableImpeller</key>
<false/>

sinnoorc · 2024-05-21T04:26:44Z

@darshankawar
I disabled Impeller as per your instructions by adding FLTEnableImpeller to the info.plist file. After making this change, the issue no longer occurs and the simulator runs smoothly without any screen flickering during animations.

Thank you for the assistance!

sinnoorc · 2024-05-21T06:24:17Z

@darshankawar
After adding this, I am getting the following warning:

[IMPORTANT:flutter/shell/common/shell.cc(454)] [Action Required] The application opted out of Impeller by either using the --no-enable-impeller flag or FLTEnableImpeller=false plist flag. This option is going to go away in an upcoming Flutter release. Remove the explicit opt-out. If you need to opt-out, report a bug describing the issue.
[IMPORTANT:flutter/shell/platform/darwin/graphics/FlutterDarwinContextMetalSkia.mm(66)] Using the Skia rendering backend (Metal).

huycozy · 2024-05-21T06:39:09Z

I can reproduce this issue on iOS 17.4 emulator (haven't checked this on a physical device as I don't have one). I narrowed this down a bit and see the issue seems to appear with AnimatedBuilder which is used internally inside CircularProgressIndicator.

The issue occurs on the latest stable 3.22.0 and master channel whilst it works normally on the previous 3.19.6.

This seems to only happen on iOS as I don't see the issue on Android (enabled Impeller).

with CircularProgressIndicator	with AnimatedBuilder
Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-05-21.at.13.05.07.mp4	Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-05-21.at.13.17.55.mp4

flutter doctor -v (stable and master)

[✓] Flutter (Channel stable, 3.22.0, on macOS 14.1 23B74 darwin-x64, locale en-VN)
    • Flutter version 3.22.0 on channel stable at /Users/huynq/Documents/GitHub/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 5dcb86f68f (11 days ago), 2024-05-09 07:39:20 -0500
    • Engine revision f6344b75dc
    • Dart version 3.4.0
    • DevTools version 2.34.3

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/huynq/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/huynq/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode15.3.app/Contents/Developer
    • Build 15E204a
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • android-studio-dir = /Applications/Android Studio.app/
    • Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)

[✓] VS Code (version 1.89.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.88.0

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-x64     • macOS 14.1 23B74 darwin-x64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 124.0.6367.208

[✓] Network resources
    • All expected network resources are available.

• No issues found!

[!] Flutter (Channel master, 3.22.0-39.0.pre.1, on macOS 14.1 23B74 darwin-x64, locale en-VN)
    • Flutter version 3.22.0-39.0.pre.1 on channel master at /Users/huynq/Documents/GitHub/flutter_master
    ! Warning: `flutter` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/huynq/Documents/GitHub/flutter/bin/dart, which is not inside your current Flutter SDK checkout at /Users/huynq/Documents/GitHub/flutter_master. Consider adding /Users/huynq/Documents/GitHub/flutter_master/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 165e535474 (3 hours ago), 2024-05-20 16:52:15 -0700
    • Engine revision c2ef01f6f1
    • Dart version 3.5.0 (build 3.5.0-172.0.dev)
    • DevTools version 2.36.0-dev.10
    • If those were intentional, you can disregard the above warnings; however it is recommended to use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/huynq/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • ANDROID_HOME = /Users/huynq/Library/Android/sdk
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode15.3.app/Contents/Developer
    • Build 15E204a
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2023.2)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • android-studio-dir = /Applications/Android Studio.app/
    • Java version OpenJDK Runtime Environment (build 17.0.9+0-17.0.9b1087.7-11185874)

[✓] VS Code (version 1.89.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.88.0

[✓] Connected device (2 available)
    • macOS (desktop) • macos  • darwin-x64     • macOS 14.1 23B74 darwin-x64
    • Chrome (web)    • chrome • web-javascript • Google Chrome 125.0.6422.61

[✓] Network resources
    • All expected network resources are available.

! Doctor found issues in 1 category.

mauricev · 2024-05-21T18:09:48Z

When I put up a showdialog and type into a text field, i see all manner of screen artifacts including the widgets in the screen behind disappearing. When i disabled impeller per the suggestion above, these problems cease. I am using ipad simulator with 17.2 and flutter 3.22.

gaaclarke · 2024-05-21T20:11:10Z

I was able to verify that the flickering doesn't happen on device (iPhone SE 2022 - iOS 17.4.1) at 8eba63f29b8b26931496807cb4fc2fed8e4e3258

I was also able to verify that the flickering doesn't happen on iPhone 15 Pro on iOS 17.4 (Xcode 15) at the same hash.

I was able to test on iPhone 15 Pro on iOS 17.5 (Xcode 15.4) at the same hash and it also worked:

gaaclarke · 2024-05-21T20:34:11Z

I tested with 3.22 stable as well and I don't see the flickering on the iPhone 15 Pro iOS 17.5 simulator.

navaronbracke · 2024-05-22T09:51:59Z

I do see it on stable 3.22.0, when running with Impeller only.

I am using XCode 15F31d* and the Iphone 15 iOS 17.5 Simulator.
Edit: I also see it on the Iphone 15 Pro iOS 17.5 Simulator.

*: gaaclarke's note: Xcode 15.4 like above.

gaaclarke · 2024-05-22T15:35:28Z

Okay, here's what we know:

The glitch doesn't happen on device
The glitch only happens on some macs

Here's the next question: For the people that are seeing it, what kind of Mac are you using. I have an M1 Max.

This is sounding like an Apple bug unfortunately. Someone that can reproduce it should file an apple bug and try downgrading xcode to 15.3 for now. I'm unable to reproduce the problem so I can't test if that is a valid workaround. If someone does verify that, could they post that info here please for others?

sinnoorc · 2024-05-22T15:41:13Z

I am running on a Mac with an Intel chip.

gaaclarke · 2024-05-22T16:09:35Z

I am running on a Mac with an Intel chip.

That's what I was afraid of. I don't know how successful you will be at getting Apple to address this since it has stopped selling intel macs a while ago. I'm going to close this since there is nothing we can do from flutter's side to address this.

The workaround is to test on device if you have an intel mac.

gaaclarke · 2024-05-22T20:43:47Z

Reopening this so the bot doesn't lock this in case more information comes in.

jason-simmons · 2024-05-22T23:49:49Z

Reproduced this on an Intel Mac Mini. Bisected it to flutter/engine@431d64d

@jonahwilliams

jonahwilliams · 2024-05-23T00:27:39Z

So this is likely a problem with the storage mode + flush implementation for simulators. I'm not sure what kind of buffer storage mode we're getting on the intel simulators. I don't know if FML_OS_IOS is enabled for simuators as well, but if not then the DeviceBuffer::Flush implementation might be broken:

https://github.com/flutter/engine/blob/main/impeller/renderer/backend/metal/device_buffer_mtl.mm#L57-L65

gaaclarke · 2024-05-23T15:43:23Z

I don't know if FML_OS_IOS is enabled for simuators as well

FML_OS_IOS will be defined as 1 for any target of iOS (iphone, ipad) and that includes builds that run on simulators or devices.

jonahwilliams · 2024-05-23T16:27:09Z

Okay then that code is wrong, we need to execute the flush for sim targets

jason-simmons · 2024-05-23T21:53:25Z

In the scenario where this happens it looks like HostBuffer is reusing device buffers before Metal is done consuming them.

Tried adding some logging to HostBuffer::Reset and an addCompletedHandler callback on the MTLCommandBuffer. The rate of HostBuffer::Reset calls exceeds the completion handler calls.

Each HostBuffer::Reset advances the HostBuffer's frame index. The frame index rotates among a pool of kHostBufferArenaSize (currently 3) sets of buffers that are reused. So if HostBuffer::Reset is not evenly matched with frame completion then eventually the frame index will wrap around to a buffer that is still in use by Metal.

I was able to get this to run smoothly on the Intel Mac Mini iOS simulator with this patch:

add an fml::Semaphore initialized with count=3 to surface_mtl.mm
call Wait on the semaphore before the CAMetalLayer.nextDrawable call in SurfaceMTL::GetMetalDrawableAndValidate
in SurfaceMTL::Present call command_buffer.addCompletedHandler with a callback that signals the semaphore

emrszr · 2024-05-25T12:18:51Z

I faced the issue on an an Intel chip Mac.

jacekendrick · 2024-06-04T16:56:49Z

🙋 Another Intel mac user with the issue

See also: flutter/flutter#148660 Intel iOS simulators do not seem to enforce any backpressure on drawable acquisition. Fix this via blocking on completion in the surface_mtl.

…r#53073) See also: flutter/flutter#148660 Intel iOS simulators do not seem to enforce any backpressure on drawable acquisition. Fix this via blocking on completion in the surface_mtl.

jonahwilliams · 2024-06-05T00:32:34Z

Cherry pick pending at #149700

Khushnu · 2024-06-05T13:35:02Z

another mac intel core i5 user here facing same problem after upgrading flutter sdk also xcode 15.4 and emulator to 17.5

IbrokhimMirzaev · 2024-06-08T14:05:23Z

how to fix this issue now ??

This comment was marked as duplicate.

Sign in to view

darshankawar added the in triage Presently being triaged by the triage team label May 20, 2024

darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 20, 2024

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 21, 2024

darshankawar added the engine flutter/engine repository. See also e: labels. label May 21, 2024

gaaclarke added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 21, 2024

github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 22, 2024

gaaclarke closed this as completed May 22, 2024

gaaclarke added the P3 Issues that are less important to the Flutter project label May 22, 2024

gaaclarke reopened this May 22, 2024

cbracken added team-engine Owned by Engine team fyi-ios For the attention of iOS platform team and removed team-ios Owned by iOS platform team labels May 22, 2024

jmagman removed the fyi-engine For the attention of Engine team label May 22, 2024

cbracken added the triaged-ios Triaged by iOS platform team label May 22, 2024

flutter-triage-bot bot removed fyi-ios For the attention of iOS platform team triaged-ios Triaged by iOS platform team labels May 23, 2024

darshankawar mentioned this issue May 24, 2024

[Impeller]: UI jitter occurs when running the app on the iOS simulator, after upgrading to flutter 3.22.1. #149036

Closed

jonahwilliams added P1 High-priority issues at the top of the work list and removed P3 Issues that are less important to the Flutter project labels May 28, 2024

jonahwilliams self-assigned this May 28, 2024

jonahwilliams added the triaged-engine Triaged by Engine team label May 28, 2024

jonahwilliams mentioned this issue May 28, 2024

[Impeller] Intel iOS Simulators must block on GPU completion. flutter/engine#53073

Merged

This was referenced Jun 5, 2024

[CP][Impeller] Intel iOS Simulators must block on GPU completion. (#53073) flutter/engine#53205

Open

[CP] Fixes Intel Simulator rendering bug #149700

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Simulator Flickering Issue with Latest Flutter and iOS Versions #148660

Simulator Flickering Issue with Latest Flutter and iOS Versions #148660

sinnoorc commented May 20, 2024 •

edited

This comment was marked as duplicate.

darshankawar commented May 20, 2024

sinnoorc commented May 21, 2024

sinnoorc commented May 21, 2024 •

edited

huycozy commented May 21, 2024 •

edited

mauricev commented May 21, 2024 •

edited

gaaclarke commented May 21, 2024

gaaclarke commented May 21, 2024

navaronbracke commented May 22, 2024 •

edited by gaaclarke

gaaclarke commented May 22, 2024

sinnoorc commented May 22, 2024

gaaclarke commented May 22, 2024

gaaclarke commented May 22, 2024

jason-simmons commented May 22, 2024

jonahwilliams commented May 23, 2024

gaaclarke commented May 23, 2024

jonahwilliams commented May 23, 2024

jason-simmons commented May 23, 2024

emrszr commented May 25, 2024

jacekendrick commented Jun 4, 2024

jonahwilliams commented Jun 5, 2024

Khushnu commented Jun 5, 2024

IbrokhimMirzaev commented Jun 8, 2024

Simulator Flickering Issue with Latest Flutter and iOS Versions #148660

Simulator Flickering Issue with Latest Flutter and iOS Versions #148660

Comments

sinnoorc commented May 20, 2024 • edited

Steps to reproduce

Environment

Expected results

Actual results

Code sample

Screenshots or Video

Logs

Flutter Doctor output

This comment was marked as duplicate.

darshankawar commented May 20, 2024

sinnoorc commented May 21, 2024

sinnoorc commented May 21, 2024 • edited

huycozy commented May 21, 2024 • edited

mauricev commented May 21, 2024 • edited

gaaclarke commented May 21, 2024

gaaclarke commented May 21, 2024

navaronbracke commented May 22, 2024 • edited by gaaclarke

gaaclarke commented May 22, 2024

sinnoorc commented May 22, 2024

gaaclarke commented May 22, 2024

gaaclarke commented May 22, 2024

jason-simmons commented May 22, 2024

jonahwilliams commented May 23, 2024

gaaclarke commented May 23, 2024

jonahwilliams commented May 23, 2024

jason-simmons commented May 23, 2024

emrszr commented May 25, 2024

jacekendrick commented Jun 4, 2024

jonahwilliams commented Jun 5, 2024

Khushnu commented Jun 5, 2024

IbrokhimMirzaev commented Jun 8, 2024

sinnoorc commented May 20, 2024 •

edited

sinnoorc commented May 21, 2024 •

edited

huycozy commented May 21, 2024 •

edited

mauricev commented May 21, 2024 •

edited

navaronbracke commented May 22, 2024 •

edited by gaaclarke