Skip to content

[google_maps_flutter] Polygons flash blue on iOS #143570

@Colman

Description

@Colman

Steps to reproduce

  1. Add a Google map widget to your Flutter project
  2. In the "polygons" field, add a big polygon (so the effect is noticeable)
  3. Give the polygon a color that is not blue
  4. Run the app on iOS

Expected results

The Google map widget should always render the polygon with the correct color

Actual results

When the map appears on the screen, the polygon will appear blue for a short while then change to the correct color

Related issues

#112150
#117513

Dependency versions

google_maps_flutter: 2.5.0

Code sample

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

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

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

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _showing = false;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: SafeArea(
        child: Column(
          children: [
            Expanded(
              child: GoogleMap(
                polygons: {
                  if (_showing)
                    const Polygon(
                      polygonId: PolygonId('testPoly'),
                      fillColor: Colors.red,
                      strokeWidth: 0,
                      points: [
                        LatLng(51.098076, -114.073451),
                        LatLng(51.078129, -114.088175),
                        LatLng(51.079036, -114.053242),
                      ],
                    ),
                },
                initialCameraPosition: const CameraPosition(
                  target: LatLng(51.087378, -114.071430),
                  zoom: 12.5,
                ),
              ),
            ),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  _showing = !_showing;
                });
              },
              child: const Text('Toggle polygon'),
            ),
          ],
        ),
      ),
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration
BSJJ6427.MP4

Flutter Doctor output

Doctor output
[!] Flutter (Channel [user-branch], 3.16.2, on macOS 14.0 23A344 darwin-x64, locale en-CA)
    ! Flutter version 3.16.2 on channel [user-branch] at /Users/cekoivisto/Documents/flutter
      Currently on an unknown channel. Run `flutter channel` to switch to an official channel.
      If that doesn't fix the issue, reinstall Flutter by following instructions at https://flutter.dev/docs/get-started/install.
    ! Upstream repository unknown source is not a standard remote.
      Set environment variable "FLUTTER_GIT_URL" to unknown source to dismiss this error.
    • Framework revision 9e1c857886 (3 months ago), 2023-11-30 11:51:18 -0600
    • Engine revision cf7a9d0800
    • Dart version 3.2.2
    • DevTools version 2.28.3
    • 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/cekoivisto/Library/Android/sdk
    • Platform android-33, 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.6+0-17.0.6b802.4-9586694)
    • All Android licenses accepted.

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

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

[✓] Android Studio (version 2022.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
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-17.0.6b802.4-9586694)

[✓] Connected device (3 available)
    • Chris Serafin’s iPhone (mobile) • 00008020-000544423485002E • ios            • iOS 16.3.1 20D67
    • macOS (desktop)                 • macos                     • darwin-x64     • macOS 14.0 23A344 darwin-x64
    • Chrome (web)                    • chrome                    • web-javascript • Google Chrome 121.0.6167.160
    ! Error: Browsing on the local area network for Nancy iPhone. Ensure the device is unlocked and attached with a cable or associated with the same local area network as this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

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

! Doctor found issues in 1 category.

Metadata

Metadata

Assignees

No one assigned

    Labels

    P2Important issues not at the top of the work listfound in release: 3.19Found to occur in 3.19found in release: 3.20Found to occur in 3.20has partial patchThere is a PR awaiting someone to take it across the finish linehas reproducible stepsThe issue has been confirmed reproducible and is ready to work onp: mapsGoogle Maps pluginpackageflutter/packages repository. See also p: labels.platform-iosiOS applications specificallyteam-iosOwned by iOS platform teamtriaged-iosTriaged by iOS platform teamworkaround availableThere is a workaround available to overcome the issue

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions