Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[google_maps_flutter] Marker is flickering when marker update and rebuild. #147153

Open
L4rue opened this issue Apr 22, 2024 · 12 comments
Open

[google_maps_flutter] Marker is flickering when marker update and rebuild. #147153

L4rue opened this issue Apr 22, 2024 · 12 comments
Labels
found in release: 3.19 Found to occur in 3.19 found in release: 3.22 Found to occur in 3.22 has reproducible steps The issue has been confirmed reproducible and is ready to work on p: maps Google Maps plugin P2 Important issues not at the top of the work list package flutter/packages repository. See also p: labels. platform-android Android applications specifically team-android Owned by Android platform team triaged-android Triaged by Android platform team

Comments

@L4rue
Copy link

L4rue commented Apr 22, 2024

Steps to reproduce

When update the marker List and rebuild, the target marker will flicker. Not every times but easy to reproduce.

Only happened on Android. iOS is good.
Device: Android 14 API 34(whatever simulator or real device)

try this with the minimal code sample.

  1. tap the marker => change target marker to yellow
  2. tap the map => change yellow marker back to red

it works good before I upgrade SDK version
Before:

flutter 3.7.12
google_maps_flutter 2.2.6

After:

flutter 3.19.6
google_maps_flutter 2.6.1

Anything helpful? Thanks to everyone.

Minimal Code sample

main.dart
import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';

void main() {
  runApp(const ProviderScope(
    child: MyApp(),
  ));
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'GOOGLE MAP FLASH',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Google Map Flash'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: const Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[Expanded(child: MapWidget())],
        ),
      ),
    );
  }
}

class MapWidget extends ConsumerStatefulWidget {
  const MapWidget({super.key});

  @override
  ConsumerState<ConsumerStatefulWidget> createState() => _MapWidgetState();
}

class _MapWidgetState extends ConsumerState<MapWidget> {
  final Completer<GoogleMapController> _mapController = Completer<GoogleMapController>();
  late final GoogleMapController controller;
  static const defaultZoom = 16.0;
  late List<Marker> markersList = ref.read(markersProvider);
  late int lastRebuildTime;

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addPostFrameCallback((_) async {
      // refresh icon after get markersList from backend
      ref.read(markersProvider.notifier).setState(getMarker());
      controller = await _mapController.future;
    });
  }

  /// a mock of api which returns a list of position
  List<LatLng> getlocation = [
    const LatLng(35.5594, 139.7210),
    const LatLng(35.5604, 139.7210),
    const LatLng(35.5614, 139.7210),
    const LatLng(35.5624, 139.7210),
    const LatLng(35.5634, 139.7210),
    const LatLng(35.5644, 139.7210),
    const LatLng(35.5654, 139.7210),
    const LatLng(35.5664, 139.7210),
    const LatLng(35.5674, 139.7210),
  ];

  getMarker() {
    List<Marker> markerList = [];
    for (var i = 0; i < getlocation.length; i++) {
      var marker = Marker(
        markerId: MarkerId('$i'),
        position: LatLng(getlocation[i].latitude, getlocation[i].longitude),
        icon: BitmapDescriptor.defaultMarker,
        consumeTapEvents: true,
        onTap: () {
          ref.read(nowIndexProvider.notifier).state = i;
        },
        zIndex: 0,
      );
      markerList.add(marker);
    }
    return markerList;
  }

  @override
  Widget build(BuildContext context) {
    lastRebuildTime = DateTime.now().millisecondsSinceEpoch;

    ref.listen(markersProvider, (oldMarker, newMarker) async {
      int rebuildTimeDiff = DateTime.now().millisecondsSinceEpoch - lastRebuildTime;
      if (rebuildTimeDiff < 200) {
        await Future.delayed(Duration(milliseconds: 200 - rebuildTimeDiff));
      }
      setState(() {
        // refresh marker when markersList update
        markersList = newMarker;
      });
    });

    ref.listen(nowIndexProvider, (oldIndex, nowIndex) async {
      if (nowIndex != -1) {
        CameraPosition cameraPos = CameraPosition(target: getlocation[nowIndex], zoom: defaultZoom);
        controller.animateCamera(CameraUpdate.newCameraPosition(cameraPos));
      }

      if (nowIndex == -1) {
        // set all marker to default color
        ref.read(markersProvider.notifier).changeMarker(oldIndex!, BitmapDescriptor.defaultMarker, 0);
      } else if (oldIndex != -1 && oldIndex! < getlocation.length) {
        // change the target marker to special color
        ref.read(markersProvider.notifier).changeMarker(oldIndex, BitmapDescriptor.defaultMarker, 0);
        ref.read(markersProvider.notifier).changeMarker(nowIndex, BitmapDescriptor.defaultMarkerWithHue(60), 1.0);
      } else {
        // change the target marker to special color
        ref.read(markersProvider.notifier).changeMarker(nowIndex, BitmapDescriptor.defaultMarkerWithHue(60), 1.0);
      }
    });

    return GoogleMap(
      mapType: MapType.normal,
      initialCameraPosition: const CameraPosition(target: LatLng(35.5594, 139.7210), zoom: defaultZoom),
      markers: Set.of(markersList),
      onMapCreated: (GoogleMapController controller) {
        if (!_mapController.isCompleted) {
          _mapController.complete(controller);
        }
      },
      mapToolbarEnabled: false,
      zoomControlsEnabled: false,
      myLocationButtonEnabled: false,
      onTap: (argument) async {
        ref.read(nowIndexProvider.notifier).state = -1;
      },
    );
  }
}

class MarkerList extends StateNotifier<List<Marker>> {
  MarkerList() : super([]);

  List<Marker> changeMarker(int index, BitmapDescriptor bitmap, double zIndex) {
    var item = state[index];
    var marker = Marker(
      markerId: item.markerId,
      position: item.position,
      consumeTapEvents: item.consumeTapEvents,
      icon: bitmap,
      onTap: item.onTap,
      zIndex: zIndex,
    );
    state[index] = marker;
    state = [...state];
    return state;
  }

  void setState(List<Marker> newState) {
    state = newState;
  }
}

final markersProvider = StateNotifierProvider<MarkerList, List<Marker>>((ref) {
  return MarkerList();
});

final nowIndexProvider = StateProvider<int>((ref) {
  return -1;
});
pubspec.yaml
name: google_map_flash
description: "A new Flutter project."
version: 1.0.0+1

environment:
  sdk: '>=3.3.1 <4.0.0'
dependencies:
  flutter:
    sdk: flutter
  google_maps_flutter: ^2.6.1
  flutter_riverpod: ^2.5.1

  cupertino_icons: ^1.0.6

dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_lints: ^3.0.0
flutter:
  uses-material-design: true

Video

Screenrecorder-2024-04-22-17-30-44-99.mp4
Logs
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_DOWN, id[0]=0, pointerCount=1, eventTime=599817703, downTime=599817703, phoneEventTime=17:30:48.953 } moveCount:0
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_UP, id[0]=0, pointerCount=1, eventTime=599817745, downTime=599817703, phoneEventTime=17:30:48.995 } moveCount:0
W/ProxyAndroidLoggerBackend( 7333): Too many Flogger logs received before configuration. Dropping old logs.
6
E/FrameEvents( 7333): updateAcquireFence: Did not find frame.
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_DOWN, id[0]=0, pointerCount=1, eventTime=599818469, downTime=599818469, phoneEventTime=17:30:49.720 } moveCount:0
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_UP, id[0]=0, pointerCount=1, eventTime=599818553, downTime=599818469, phoneEventTime=17:30:49.803 } moveCount:0
W/ProxyAndroidLoggerBackend( 7333): Too many Flogger logs received before configuration. Dropping old logs.
4
E/FrameEvents( 7333): updateAcquireFence: Did not find frame.
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_DOWN, id[0]=0, pointerCount=1, eventTime=599819106, downTime=599819106, phoneEventTime=17:30:50.356 } moveCount:0
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_UP, id[0]=0, pointerCount=1, eventTime=599819156, downTime=599819106, phoneEventTime=17:30:50.406 } moveCount:0
W/ProxyAndroidLoggerBackend( 7333): Too many Flogger logs received before configuration. Dropping old logs.
42
E/FrameEvents( 7333): updateAcquireFence: Did not find frame.
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_DOWN, id[0]=0, pointerCount=1, eventTime=599819817, downTime=599819817, phoneEventTime=17:30:51.067 } moveCount:0
D/MIUIInput( 7333): [MotionEvent] ViewRootImpl windowName 'com.example.google_map_flash/com.example.google_map_flash.MainActivity', { action=ACTION_UP, id[0]=0, pointerCount=1, eventTime=599819885, downTime=599819817, phoneEventTime=17:30:51.135 } moveCount:0
W/ProxyAndroidLoggerBackend( 7333): Too many Flogger logs received before configuration. Dropping old logs.
4
E/FrameEvents( 7333): updateAcquireFence: Did not find frame.
Flutter Doctor output
[✓] Flutter (Channel stable, 3.19.6, on macOS 14.3.1 23D60 darwin-arm64, locale zh-Hans-CN)
    • Flutter version 3.19.6 on channel stable at /Users/a005103/fvm/versions/3.19.6
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 54e66469a9 (5 days ago), 2024-04-17 13:08:03 -0700
    • Engine revision c4cd48e186
    • Dart version 3.3.4
    • DevTools version 2.31.1

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/a005103/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.7+0-17.0.7b1000.6-10550314)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.3)
    • Xcode at /Applications/Xcode.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.1)
    • 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.7+0-17.0.7b1000.6-10550314)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.3.5)
    • IntelliJ at /Applications/IntelliJ IDEA.app
    • 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.88.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.86.0

[✓] Connected device (5 available)
    • 23127PN0CC (mobile)         • e727544e                             • android-arm64  • Android 14 (API 34)
    • sdk gphone64 arm64 (mobile) • emulator-5554                        • android-arm64  • Android 14 (API 34) (emulator)
    • iPhone 15 (mobile)          • B91C6079-B635-427F-90B6-1E36C2B025CC • ios            • com.apple.CoreSimulator.SimRuntime.iOS-17-4 (simulator)
    • macOS (desktop)             • macos                                • darwin-arm64   • macOS 14.3.1 23D60 darwin-arm64
    • Chrome (web)                • chrome                               • web-javascript • Google Chrome 124.0.6367.61

[✓] Network resources
    • All expected network resources are available.
@darshankawar darshankawar added the in triage Presently being triaged by the triage team label Apr 22, 2024
@darshankawar
Copy link
Member

@L4rue
Can you check this issue and see if it resembles your case or not ?
If not, in your case, does it replicate without flutter_riverpod implementation ? If so, please provide us updated code sample without that package code.

@darshankawar darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Apr 22, 2024
@L4rue
Copy link
Author

L4rue commented Apr 23, 2024

@L4rue Can you check this issue and see if it resembles your case or not ? If not, in your case, does it replicate without flutter_riverpod implementation ? If so, please provide us updated code sample without that package code.

Thanks for your reminding. I have checked the issue before, but nothing useful. It's look like different from what I meet.
And as your say, I remove the flutter_riverpod from the minimal code sample.
Due to our business, the position of the marker must be returned by the backend server.
I use ChangeNotifier Instead of Ref which from flutter_riverpod. So that I know when to rebuild the map.

Here is the minimal code sample without flutter_riverpod

main.dart
import 'dart:async';

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

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'GOOGLE MAP FLASH',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Google Map Flash'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(widget.title),
      ),
      body: const Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[Expanded(child: MapWidget())],
        ),
      ),
    );
  }
}

class MapWidget extends StatefulWidget {
  const MapWidget({super.key});

  @override
  State<StatefulWidget> createState() => _MapWidgetState();
}

class _MapWidgetState extends State<MapWidget> {
  final Completer<GoogleMapController> _mapController = Completer<GoogleMapController>();
  late final GoogleMapController controller;
  static const defaultZoom = 16.0;
  late List<Marker> markersList = markersNotifier.markerList;
  late int lastRebuildTime;

  @override
  void initState() {
    super.initState();

    nowIndexProvider.addListener(() {
      if (nowIndexProvider.nowIndex != -1) {
        CameraPosition cameraPos = CameraPosition(target: getlocation[nowIndexProvider.nowIndex], zoom: defaultZoom);
        controller.animateCamera(CameraUpdate.newCameraPosition(cameraPos));
      }

      if (nowIndexProvider.nowIndex == -1) {
        // set all marker to default color
        markersNotifier.changeMarker(nowIndexProvider.oldIndex, BitmapDescriptor.defaultMarker, 0);
      } else if (nowIndexProvider.oldIndex != -1 && nowIndexProvider.oldIndex! < getlocation.length) {
        // change the target marker to special color
        markersNotifier.changeMarker(nowIndexProvider.oldIndex, BitmapDescriptor.defaultMarker, 0);
        markersNotifier.changeMarker(nowIndexProvider.nowIndex, BitmapDescriptor.defaultMarkerWithHue(60), 1.0);
      } else {
        // change the target marker to special color
        markersNotifier.changeMarker(nowIndexProvider.nowIndex, BitmapDescriptor.defaultMarkerWithHue(60), 1.0);
      }
    });

    markersNotifier.addListener(() async {
      int rebuildTimeDiff = DateTime.now().millisecondsSinceEpoch - lastRebuildTime;
      if (rebuildTimeDiff < 200) {
        await Future.delayed(Duration(milliseconds: 200 - rebuildTimeDiff));
      }
      setState(() {
        // refresh marker when markersList update
        markersList = markersNotifier.markerList;
      });
    });

    WidgetsBinding.instance.addPostFrameCallback((_) async {
      // refresh icon after get markersList from backend
      markersNotifier.setState(getMarker());
      controller = await _mapController.future;
    });
  }

  /// a mock of api which returns a list of position
  List<LatLng> getlocation = [
    const LatLng(35.5594, 139.7210),
    const LatLng(35.5604, 139.7210),
    const LatLng(35.5614, 139.7210),
    const LatLng(35.5624, 139.7210),
    const LatLng(35.5634, 139.7210),
    const LatLng(35.5644, 139.7210),
    const LatLng(35.5654, 139.7210),
    const LatLng(35.5664, 139.7210),
    const LatLng(35.5674, 139.7210),
  ];

  getMarker() {
    List<Marker> markerList = [];
    for (var i = 0; i < getlocation.length; i++) {
      var marker = Marker(
        markerId: MarkerId('$i'),
        position: LatLng(getlocation[i].latitude, getlocation[i].longitude),
        icon: BitmapDescriptor.defaultMarker,
        consumeTapEvents: true,
        onTap: () {
          nowIndexProvider.changeIndex(i);
        },
        zIndex: 0,
      );
      markerList.add(marker);
    }
    return markerList;
  }

  @override
  Widget build(BuildContext context) {
    lastRebuildTime = DateTime.now().millisecondsSinceEpoch;

    return GoogleMap(
      mapType: MapType.normal,
      initialCameraPosition: const CameraPosition(target: LatLng(35.5594, 139.7210), zoom: defaultZoom),
      markers: Set.of(markersList),
      onMapCreated: (GoogleMapController controller) {
        if (!_mapController.isCompleted) {
          _mapController.complete(controller);
        }
      },
      mapToolbarEnabled: false,
      zoomControlsEnabled: false,
      myLocationButtonEnabled: false,
      onTap: (argument) async {
        nowIndexProvider.changeIndex(-1);
      },
    );
  }
}

class MarkersNotifier extends ChangeNotifier {
  List<Marker> _markerList = [];

  List<Marker> get markerList => _markerList;

  void changeMarker(int index, BitmapDescriptor bitmap, double zIndex) {
    var item = _markerList[index];
    var marker = Marker(
      markerId: item.markerId,
      position: item.position,
      consumeTapEvents: item.consumeTapEvents,
      icon: bitmap,
      onTap: item.onTap,
      zIndex: zIndex,
    );
    _markerList[index] = marker;
    notifyListeners();
  }

  void setState(List<Marker> markerListTemp) {
    _markerList = markerListTemp;
    notifyListeners();
  }
}

MarkersNotifier markersNotifier = MarkersNotifier();

class NowIndexProvider extends ChangeNotifier {
  int _nowIndex = -1;
  int _oldIndex = -1;

  int get nowIndex => _nowIndex;
  int get oldIndex => _oldIndex;

  changeIndex(int index) {
    _oldIndex = _nowIndex;
    _nowIndex = index;
    notifyListeners();
  }
}

NowIndexProvider nowIndexProvider = NowIndexProvider();
pubspec.yaml
name: google_map_flash
description: "A new Flutter project."
version: 1.0.0+1

environment:
  sdk: '>=3.3.1 <4.0.0'
dependencies:
  flutter:
    sdk: flutter
  google_maps_flutter: ^2.6.1

  cupertino_icons: ^1.0.6

dev_dependencies:
  flutter_test:
    sdk: flutter
  flutter_lints: ^3.0.0
flutter:
  uses-material-design: true

still could reproduce the problem by this code.

Screenrecorder-2024-04-23-09-21-11-563.mp4

@github-actions 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 Apr 23, 2024
@darshankawar
Copy link
Member

Thanks for the update. I tried replicating on Pixel XL api 33 emulator, but wasn't able to see the reported behavior.
Also tried to use your code sample in plugin example (marker_icon.dart) but still didn't get the behavior.
Can you try the same and check at your end ?

@darshankawar darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Apr 23, 2024
@L4rue
Copy link
Author

L4rue commented Apr 23, 2024

Thanks for your trying.
At first, I tried replicating on Pixel XL API 33 emulator same as you and all markers are good like before.
But I found the path or roads of map are black. That was strange. So, I search some about that. At this comment, he mentioned Google’s latest renderer dependency on Google Play and Pixel XL API 33 emulator has no Google Play. I suspect the reported issue is related to this.
Based on the above guess, I tried replicating on Pixel 7 Pro API 33 emulator which has Google Play. In this time, the black roads are gone. But the reported behavior happened again. It's really hard but still could reproduce on emulator.

Look this video.

Video
record.online-video-cutter.com.mp4

On real device, almost evetimes could reproduce the behavior.
Just a guess, maybe the difficulty of reproducing is related to the performance of device?Because of low performance and low frame on emulator. After all, it might only last one or two frame.

Here some information of device what I used.

Emulator
Device: Pixel 7 Pro API 33 / Pixel 7 Pro API 34
Google Play Server version: 24.13.19(190400-626168189)
Google Play Store version: 40.6.31-31 [0] [PR] 626489609
Real Device
Device: Xiaomi 14
OS: Xiaomi Hyper OS 1.0.35.0.UNCCNXM (Base on Android 14)
Google Play Server version: 24.13.19(190408-626168189)
Google Play Store version: 38.4.22-21 [0] [PR] 582466152

Device: Pixel 8
OS: Android 14
Google Play Server version: 24.13.18(190400-623909296)
Google Play Store version: 40.4.32-31 [0] [PR] 621277340

@github-actions 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 Apr 23, 2024
@darshankawar
Copy link
Member

Thanks for the update. I tried on Samsung S10 device and also on PIxel XL emulator running Android 13, but was unable to see the flickering. Does the flickering occur while trying to drag the marker or while zooming in and out ?

Screen_Recording_20240424_111624.mp4

@darshankawar darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Apr 24, 2024
@L4rue
Copy link
Author

L4rue commented Apr 24, 2024

Thanks for the update. I tried on Samsung S10 device and also on PIxel XL emulator running Android 13, but was unable to see the flickering. Does the flickering occur while trying to drag the marker or while zooming in and out ?

Screen_Recording_20240424_111624.mp4

Thanks for your trying. By your video, I think I caused a misunderstanding by not describing my operations in detail.

try this.

  1. Not double click, but single tap the marker (not drag the map or zoom in/out)
    => This will trigger the callback function nowIndexProvider.changeIndex(i);, it will change the taped marker to yellow by notifyListener as my video (camera will move to marker's position by the callback function. It's not a drag event)
  2. Not double click, but single tap the map (not drag the map or zoom in/out)
    => This will trigger the callback function nowIndexProvider.changeIndex(-1);, it will change the taped marker back to red by notifyListener as my video

Maybe useful

This is my code sample. Same as the code I provided before. Just need to change the googleMapApiKey to yourself's

By the way, did your see any black road in map on PIxel XL emulator? PIxel XL emulator has no Play Store on my mac.

Snapshot

截屏2024-04-24 14 22 00

@github-actions 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 Apr 24, 2024
@darshankawar
Copy link
Member

Thanks for the update and patience while we try to figure this out.
I followed the steps you mentioned and clicking on the marker does change the color but I didn't observe the flicker, as shown in below video:

147153.mov

I ran on latest stable version and on Pixel XL emulator running Android 13.

@darshankawar darshankawar added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label Apr 25, 2024
@L4rue
Copy link
Author

L4rue commented Apr 25, 2024

Could you click between marker and map, not between marker and marker? In addition, it is easier to reproduce the problem on a real device. My colleagues all reproduced this problem on their mobile phones.

Anyway, thanks for your work.

@github-actions 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 Apr 25, 2024
@darshankawar
Copy link
Member

Thanks for the update. I was able to replicate this by running on S10 device with latest versions.

Screen_Recording_20240426_115511.mp4
stable, master flutter doctor -v
[!] Flutter (Channel stable, 3.19.6, on macOS 12.2.1 21D62 darwin-x64, locale
    en-GB)
    • Flutter version 3.19.6 on channel stable at
      /Users/dhs/documents/fluttersdk/flutter
    ! Warning: `flutter` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/flutter, which is not inside
      your current Flutter SDK checkout at
      /Users/dhs/documents/fluttersdk/flutter. Consider adding
      /Users/dhs/documents/fluttersdk/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/dart, which is not inside your
      current Flutter SDK checkout at /Users/dhs/documents/fluttersdk/flutter.
      Consider adding /Users/dhs/documents/fluttersdk/flutter/bin to the front
      of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 54e66469a9 (6 days ago), 2024-04-17 13:08:03 -0700
    • Engine revision c4cd48e186
    • Dart version 3.3.4
    • DevTools version 2.31.1
    • If those were intentional, you can disregard the above warnings; however
      it is recommended to use "git" directly to perform update checks and
      upgrades.

[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

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

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

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.

[!] Flutter (Channel master, 3.22.0-14.0.pre.67, on macOS 12.2.1 21D62
    darwin-x64, locale en-GB)
    • Flutter version 3.22.0-14.0.pre.67 on channel master at
      /Users/dhs/documents/fluttersdk/flutter
    ! Warning: `flutter` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/flutter, which is not inside
      your current Flutter SDK checkout at
      /Users/dhs/documents/fluttersdk/flutter. Consider adding
      /Users/dhs/documents/fluttersdk/flutter/bin to the front of your path.
    ! Warning: `dart` on your path resolves to
      /Users/dhs/Documents/Fluttersdk/flutter/bin/dart, which is not inside your
      current Flutter SDK checkout at /Users/dhs/documents/fluttersdk/flutter.
      Consider adding /Users/dhs/documents/fluttersdk/flutter/bin to the front
      of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 1a905d508d (20 hours ago), 2024-04-21 06:44:23 -0400
    • Engine revision 75ca2195c9
    • Dart version 3.5.0 (build 3.5.0-83.0.dev)
    • DevTools version 2.35.0-dev.8
    • 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 30.0.3)
    • Android SDK at /Users/dhs/Library/Android/sdk
    ✗ cmdline-tools component is missing
      Run `path/to/sdkmanager --install "cmdline-tools;latest"`
      See https://developer.android.com/studio/command-line for more details.
    ✗ Android license status unknown.
      Run `flutter doctor --android-licenses` to accept the SDK licenses.
      See https://flutter.dev/docs/get-started/install/macos#android-setup for
      more details.

[✓] Xcode - develop for iOS and macOS (Xcode 13.2.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 13C100
    • CocoaPods version 1.11.2

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

[✓] IntelliJ IDEA Ultimate Edition (version 2021.3.2)
    • IntelliJ at /Applications/IntelliJ IDEA.app
    • Flutter plugin version 65.1.4
    • Dart plugin version 213.7228

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

[✓] Connected device (3 available)
    • Darshan's iphone (mobile) • 21150b119064aecc249dfcfe05e259197461ce23 • ios
      • iOS 15.3.1 19D52
    • macOS (desktop)           • macos                                    •
      darwin-x64     • macOS 12.2.1 21D62 darwin-x64
    • Chrome (web)              • chrome                                   •
      web-javascript • Google Chrome 109.0.5414.119

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

! Doctor found issues in 1 category.
      
[!] Xcode - develop for iOS and macOS (Xcode 12.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    ! Flutter recommends a minimum Xcode version of 13.
      Download the latest version or update via the Mac App Store.
    • CocoaPods version 1.11.2

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

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

[✓] Connected device (5 available)
    • SM G975F (mobile)       • RZ8M802WY0X • android-arm64   • Android 11 (API 30)
    • Darshan's iphone (mobile)  • 21150b119064aecc249dfcfe05e259197461ce23 •
      ios            • iOS 14.4.1 18D61
    • iPhone 12 Pro Max (mobile) • A5473606-0213-4FD8-BA16-553433949729     •
      ios            • com.apple.CoreSimulator.SimRuntime.iOS-14-3 (simulator)
    • macOS (desktop)            • macos                                    •
      darwin-x64     • Mac OS X 10.15.4 19E2269 darwin-x64
    • Chrome (web)               • chrome                                   •
      web-javascript • Google Chrome 98.0.4758.80

[✓] HTTP Host Availability
    • All required HTTP hosts are available

! Doctor found issues in 1 category.



@darshankawar darshankawar added p: maps Google Maps plugin package flutter/packages repository. See also p: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on found in release: 3.19 Found to occur in 3.19 found in release: 3.22 Found to occur in 3.22 platform-android Android applications specifically team-android Owned by Android platform team fyi-ecosystem For the attention of Ecosystem team and removed in triage Presently being triaged by the triage team labels Apr 26, 2024
@stuartmorgan stuartmorgan added the triaged-ecosystem Triaged by Ecosystem team label Apr 30, 2024
@flutter-triage-bot flutter-triage-bot bot removed fyi-ecosystem For the attention of Ecosystem team triaged-ecosystem Triaged by Ecosystem team labels Apr 30, 2024
@yaakovschectman
Copy link
Contributor

From triage: There are major changes planned for markers. We will re-investigate after flutter/packages#4055 lands.

@reidbaker reidbaker added the triaged-android Triaged by Android platform team label May 9, 2024
@flutter-triage-bot flutter-triage-bot bot removed the triaged-android Triaged by Android platform team label May 15, 2024
@flutter-triage-bot
Copy link

This issue is missing a priority label. Please set a priority label when adding the triaged-android label.

@reidbaker reidbaker added the P2 Important issues not at the top of the work list label May 30, 2024
@reidbaker
Copy link
Contributor

@jokerttu is currently working on marker improvements. I am not sure if this issue will be addressed as part of that work.

@reidbaker reidbaker added triaged-android Triaged by Android platform team team-android Owned by Android platform team and removed team-android Owned by Android platform team labels May 30, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
found in release: 3.19 Found to occur in 3.19 found in release: 3.22 Found to occur in 3.22 has reproducible steps The issue has been confirmed reproducible and is ready to work on p: maps Google Maps plugin P2 Important issues not at the top of the work list package flutter/packages repository. See also p: labels. platform-android Android applications specifically team-android Owned by Android platform team triaged-android Triaged by Android platform team
Projects
None yet
Development

No branches or pull requests

5 participants