Map flickers or turns black when zooming/panning

[kalucky0]

When using Mapbox Maps for Flutter the map exhibits flickering or turns completely black during zoom and pan gestures. The issue occurs both in debug and release mode on Android devices and emulators.

• Flutter: 3.22.3 (stable)
• Mapbox Maps Flutter: 2.2.0

flutter doctor

[√] Flutter (Channel stable, 3.22.3, on Microsoft Windows [Version 10.0.22631.3880], locale en-US)
    • Flutter version 3.22.3 on channel stable at D:\Flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision b0850beeb2 (6 weeks ago), 2024-07-16 21:43:41 -0700
    • Engine revision 235db911ba
    • Dart version 3.4.4
    • DevTools version 2.34.3

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at C:\Users\kaluc\AppData\Local\Android\sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: C:\Users\kaluc\AppData\Local\Programs\Android Studio\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.10+0--11572160)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • CHROME_EXECUTABLE = C:\Program Files (x86)\Microsoft\Edge\Application\msedge.exe

[√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.11.1)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.11.35219.272
    • Windows 10 SDK version 10.0.22621.0

[√] Android Studio (version 2023.3)
    • Android Studio at C:\Users\kaluc\AppData\Local\Programs\Android Studio
    • 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--11572160)

[√] IntelliJ IDEA Ultimate Edition (version 2024.2)
    • IntelliJ at C:\Users\kaluc\AppData\Local\Programs\IntelliJ IDEA Ultimate
    • 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

[√] VS Code (version 1.92.2)
    • VS Code at C:\Users\kaluc\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.94.0

[√] Connected device (4 available)
    • sdk gphone64 x86 64 (mobile) • emulator-5554 • android-x64    • Android 14 (API 34) (emulator)
    • Windows (desktop)            • windows       • windows-x64    • Microsoft Windows [Version 10.0.22631.3880]
    • Chrome (web)                 • chrome        • web-javascript • unknown
    • Edge (web)                   • edge          • web-javascript • Microsoft Edge 128.0.2739.42

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

• No issues found!

Code: https://gist.github.com/kalucky0/16424470b37c4a8a3c68ce130ee37fc7

Screenshots

Video

8mb.video-Bs0-yuE5dDhs.mp4

[hafidzaini]

get this problem too

[maios]

Hi, does this happen also on iOS simulators/devices?

[kalucky0]

I wasn't able to reproduce the issue on iOS so I don't think so

[alejandrogiubel]

Any update on this?