mapbox / mapbox/mapbox-maps-flutter

[Android] Map flickers when app is resumed, and sometimes get transparent.

Open
#298 0 comments 9 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
Dart
Stars
380
Forks
204
PR merge metrics
No merged PRs in 30d

Description

### Flickers:

https://github.com/mapbox/mapbox-maps-flutter/assets/28344195/70349373-2ecf-4b3a-937b-44c5f19dce24

### Transparent:

https://github.com/mapbox/mapbox-maps-flutter/assets/28344195/f4958434-24ae-4e12-b8ab-499cdf9f71dc

## Steps to reproduce:
- I reproduced the bug with the example app of mapbox_maps_flutter.
- I used on Samsung galaxy S9 on Android 10.

flutter doctor:
```bash
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.13.8, on macOS 14.0 23A344 darwin-arm64, locale en-FR)
[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 15.0)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.3)
[✓] VS Code (version 1.84.1)
[✓] Connected device (3 available)
[✓] Network resources

• No issues found!
```

logs:
```bash
I/Mapbox (13985): [threading]: Worker 4 priority is now 4
I/Mapbox (13985): [threading]: OnlineFileSourc priority is now 4
I/flutter (13985): StyleDataLoadedEventData: begin: 1946412733, end: 1946431174
I/flutter (13985): StyleDataLoadedEventData: begin: 1946412733, end: 1946574119
I/flutter (13985): Receive event, type: style-loaded, data: {"begin":1946235466,"end":1946575571}
D/libmdf (13985): libmdf v2.9.0.0 On 64bit PLATFORM
I/Mapbox (13985): [maps-android\Mbgl-RenderThread]: onSurfaceCreated
I/Mapbox (13985): [maps-android\Mbgl-RenderThread]: onSurfaceCreated: waiting Android surface to be processed...
I/Mapbox (13985): [maps-android\Mbgl-RenderThread]: Setting up render thread, flags: creatingSurface=true, nativeRenderCreated=false, eglContextCreated=false, eglPrepared=false, paused=false
I/Mapbox (13985): [maps-android\Mbgl-EGLConfigChooser]: In emulator: false
I/Mapbox (13985): [maps-android\Mbgl-EGLConfigChooser]: In emulator: false
I/Mapbox (13985): [maps-android\Mbgl-EglCore]: EGLContext created, client version 2
I/mali_winsys(13985): new_window_surface() [1440x2640] return: 0x3000
I/Mapbox (13985): [maps-core]: Using OpenGL render backend
I/Mapbox (13985): [threading]: MapboxRenderThr priority is now -10
I/Mapbox (13985): [maps-android\Mbgl-RenderThread]: Native renderer created.
I/Mapbox (13985): [maps-android\Mbgl-RenderThread]: onSurfaceCreated: Android surface was processed.
I/Mapbox (13985): [threading]: ResourceLoaderT priority is now 4
I/Mapbox (13985): [threading]: Worker 1 priority is now 4
I/Mapbox (13985): [maps-core]: {MapboxRenderThr}[General]: GPU Identifier: Mali-G72
I/Mapbox (13985): [threading]: TileStoreFileSo priority is now 4
I/flutter (13985): CameraChangedEventData: begin: 1947077249, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1947394709, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1947547601, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947551139, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947552521, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947553368, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947554151, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947554863, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1947596896, end: null
W/Mapbox (13985): [LiveTrackingClient]: Skipping request to start: state == Started
I/flutter (13985): RenderFrameFinishedEventData: begin: 1947823282, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947827930, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947829133, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947832243, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947833157, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947833876, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947834590, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947835742, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947836662, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947837390, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947838098, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947935449, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947936915, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947937749, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947938668, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947939640, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947940454, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947941193, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947941915, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1947942586, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1947943378, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948004642, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948007183, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948008278, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948009126, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948009940, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948010869, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948011602, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948012423, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948037866, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948039211, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948039981, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948040727, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948041436, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948293980, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948296644, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948297707, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948298540, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948299307, end: null
I/flutter (13985): SourceDataLoadedEventData: begin: 1948300109, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948318197, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948449933, end: null
I/flutter (13985): Receive event, type: map-loaded, data: {"begin":1946235466,"end":1948450039}
I/flutter (13985): MapLoadedEventData: begin: 1946235466, end: 1948450039
I/flutter (13985): Receive event, type: map-loaded, data: {"begin":1946235466,"end":1948450039}
I/flutter (13985): MapLoadedEventData: begin: 1946235466, end: 1948450039
I/flutter (13985): RenderFrameStartedEventData: begin: 1948478880, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948478963, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948493577, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948493658, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948520876, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948523992, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948540152, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948541783, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948554014, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948557503, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948573550, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948575962, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948598192, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948598255, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948609270, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948612871, end: null
I/flutter (13985): RenderFrameStartedEventData: begin: 1948628599, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1948628713, end: null
I/flutter (13985): Receive event, type: map-idle, data: {"begin":1948628741}
I/flutter (13985): MapIdleEventData: begin: 1948628741, end: null
I/flutter (13985): Receive event, type: map-idle, data: {"begin":1948628741}
I/flutter (13985): MapIdleEventData: begin: 1948628741, end: null
I/Mapbox (13985): [tile_store]: Searching for stale partial downloads to clean up
I/Mapbox (13985): [tile_store]: Cleanup of stray partial downloads complete
I/SurfaceView(13985): onWindowVisibilityChanged(8) false io.flutter.embedding.android.FlutterSurfaceView{1ca09bc V.E...... ........ 0,0-1440,2960} of ViewRootImpl@4d5c5e1[MainActivity]
I/SurfaceView(13985): surfaceDestroyed callback.size 1 #2 io.flutter.embedding.android.FlutterSurfaceView{1ca09bc V.E...... ........ 0,0-1440,2960}
I/mali_egl(13985): eglDestroySurface() in
I/mali_winsys(13985): delete_surface() [1440x2960] return
I/mali_egl(13985): eglDestroySurface() out
W/libEGL (13985): EGLNativeWindowType 0x7d5ef3a010 disconnect failed
I/SurfaceView(13985): remove() io.flutter.embedding.android.FlutterSurfaceView{1ca09bc V.E...... ........ 0,0-1440,2960} Surface(name=SurfaceView - com.mapbox.maps.flutter.example/com.mapbox.maps.mapbox_maps_example.MainActivity@1ca09bc@0)/@0xacee179
I/mali_egl(13985): eglDestroySurface() in
I/mali_winsys(13985): delete_surface() [1440x2960] return
I/mali_egl(13985): eglDestroySurface() out
W/libEGL (13985): EGLNativeWindowType 0x7d58ec07d0 disconnect failed
I/ViewRootImpl@4d5c5e1[MainActivity](13985): Relayout returned: old=(0,0,1440,2960) new=(0,0,1440,2960) req=(1440,2960)8 dur=16 res=0x5 s={false 0} ch=true
I/ViewRootImpl@4d5c5e1[MainActivity](13985): MSG_WINDOW_FOCUS_CHANGED 0 1
D/InputMethodManager(13985): prepareNavigationBarInfo() DecorView@3680865[MainActivity]
D/InputMethodManager(13985): getNavigationBarColor() -855310
I/ViewRootImpl@4d5c5e1[MainActivity](13985): stopped(true) old=false
I/SurfaceView(13985): windowStopped(true) false io.flutter.embedding.android.FlutterSurfaceView{1ca09bc V.E...... ........ 0,0-1440,2960} of ViewRootImpl@4d5c5e1[MainActivity]
I/Mapbox (13985): [events_service]: Queue is empty, nothing to flush
I/Mapbox (13985): [maps-android\Mbgl-RenderThread]: Renderer paused
I/Mapbox (13985): [events_service]: Queue is empty, nothing to flush
I/Mapbox (13985): [events_service]: Queue is empty, nothing to flush
D/InputTransport(13985): Input channel destroyed: 'ClientS', fd=101
I/SurfaceView(13985): onWindowVisibilityChanged(4) false io.flutter.embedding.android.FlutterSurfaceView{1ca09bc G.E...... ......I. 0,0-1440,2960} of ViewRootImpl@4d5c5e1[MainActivity]
I/ViewRootImpl@4d5c5e1[MainActivity](13985): Relayout returned: old=(0,0,1440,2960) new=(0,0,1440,2960) req=(1440,2960)4 dur=7 res=0x1 s={false 0} ch=false
I/ViewRootImpl@4d5c5e1[MainActivity](13985): stopped(false) old=true
I/SurfaceView(13985): windowStopped(false) false io.flutter.embedding.android.FlutterSurfaceView{1ca09bc G.E...... ......I. 0,0-1440,2960} of ViewRootImpl@4d5c5e1[MainActivity]
I/Mapbox (13985): [maps-android\Mbgl-RenderThread]: Renderer resumed, renderThreadPrepared=true
I/ViewRootImpl@4d5c5e1[MainActivity](13985): stopped(false) old=false
I/Mapbox (13985): [threading]: Worker 2 priority is now 4
I/Mapbox (13985): [threading]: Worker 3 priority is now 4
I/SurfaceView(13985): onWindowVisibilityChanged(0) true io.flutter.embedding.android.FlutterSurfaceView{1ca09bc V.E...... ......ID 0,0-1440,2960} of ViewRootImpl@4d5c5e1[MainActivity]
I/ViewRootImpl@4d5c5e1[MainActivity](13985): Relayout returned: old=(0,0,1440,2960) new=(0,0,1440,2960) req=(1440,2960)0 dur=8 res=0x7 s={true 538463932416} ch=true
I/mali_winsys(13985): new_window_surface() [1440x2960] return: 0x3000
I/SurfaceView(13985): surfaceCreated 1 #5 io.flutter.embedding.android.FlutterSurfaceView{1ca09bc V.E...... ......ID 0,0-1440,2960}
I/mali_winsys(13985): new_window_surface() [1440x2960] return: 0x3000
I/SurfaceView(13985): surfaceChanged (1440,2960) 1 #5 io.flutter.embedding.android.FlutterSurfaceView{1ca09bc V.E...... ......ID 0,0-1440,2960}
I/OpenGLRenderer(13985): doUpdatePositionAsync is called and callVoidMethod
I/flutter (13985): RenderFrameStartedEventData: begin: 1958575993, end: null
I/flutter (13985): RenderFrameFinishedEventData: begin: 1958576166, end: null
I/flutter (13985): Receive event, type: map-idle, data: {"begin":1958576206}
I/flutter (13985): MapIdleEventData: begin: 1958576206, end: null
I/ViewRootImpl@4d5c5e1[MainActivity](13985): MSG_WINDOW_FOCUS_CHANGED 1 1
I/flutter (13985): Receive event, type: map-idle, data: {"begin":1958576206}
D/InputMethodManager(13985): prepareNavigationBarInfo() DecorView@3680865[MainActivity]
I/flutter (13985): MapIdleEventData: begin: 1958576206, end: null
D/InputMethodManager(13985): getNavigationBarColor() -855310
D/InputMethodManager(13985): prepareNavigationBarInfo() DecorView@3680865[MainActivity]
D/InputMethodManager(13985): getNavigationBarColor() -855310
V/InputMethodManager(13985): Starting input: tba=com.mapbox.maps.flutter.example ic=null mNaviBarColor -855310 mIsGetNaviBarColorSuccess true , NavVisible : true , NavTrans : false
D/InputMethodManager(13985): startInputInner - Id : 0
I/InputMethodManager(13985): startInputInner - mService.startInputOrWindowGainedFocus
I/Mapbox (13985): [threading]: Worker 4 priority is now 4
I/Mapbox (13985): [threading]: Worker 1 priority is now 4
W/Mapbox (13985): [Type is not supported: android.location.Location]: ValueUtils
```
---

### Related informations:
✅ This bug is not present in [Maplibre Native](https://github.com/maplibre/maplibre-native).
🐞 This bug is present in [flutter_maplibre_gl](https://github.com/maplibre/flutter-maplibre-gl/issues/327)
✅ This bug is not present in [google_map_flutter](https://github.com/flutter/packages/tree/main/packages/google_maps_flutter/google_maps_flutter)

The root cause might be in the platform-view implementation.

**See Google Map**

https://github.com/maplibre/flutter-maplibre-gl/assets/28344195/43dcb350-b010-4de3-ac61-bc90b92f7035

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reproducing the issue in the mapbox_maps_flutter example app on a Samsung Galaxy S9 running Android 10, then review the app lifecycle and the provided renderer and SurfaceView logs around resume. Done means the map resumes without flickering or becoming transparent.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, dart, flutter
Domain
mobile-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.