0

In scrollable widget, when google map come to screen edges, its camera position slightly shifting. And it produces lagging Is there an any way to prevent this behavior. Its like google_map trying to reposition its camera. I think this is like an undesired outcome. How could I keep stable the map while it is at screen edges


Sample code and flutter doctor outputs are below the example gif.

Problem example gif

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

class DenemePage extends StatelessWidget {
  const DenemePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Padding(
        padding: const EdgeInsets.only(top: 200, bottom: 1500),
        child: Container(
          width: MediaQuery.of(context).size.width,
          height: 400,
          child: Stack(
            alignment: Alignment.center,
            children: [
              GoogleMap(
                initialCameraPosition:
                    const CameraPosition(target: LatLng(40, 29), zoom: 10),
              ),
              Icon(Icons.radar_outlined)
            ],
          ),
        ),
      ),
    );
  }
}
Flutter Doctor 
[✓] Flutter (Channel stable, 2.10.3, on macOS 12.4 21F79 darwin-x64, locale tr-TR)
    • Flutter version 2.10.3 at /Volumes/HARDDISK/SDKs/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 7e9793dee1 (5 months ago), 2022-03-02 11:23:12 -0600
    • Engine revision bd539267b4
    • Dart version 2.16.1
    • DevTools version 2.9.2

[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
    • Android SDK at /Volumes/HARDDISK/SDKs/Android/sdk
    • Platform android-31, build-tools 31.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jre/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 11.0.10+0-b96-7281165)
    • All Android licenses accepted.

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

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

[✓] Android Studio (version 2020.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 11.0.10+0-b96-7281165)

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

[✓] Connected device (2 available)
    • iPhone 13 Pro (mobile) • BE0A3070-5A72-46F4-A649-6C7F17B9A731 • ios            • com.apple.CoreSimulator.SimRuntime.iOS-15-4 (simulator)
    • Chrome (web)           • chrome                               • web-javascript • Google Chrome 103.0.5060.114

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

• No issues found!
Md. Yeasin Sheikh
  • 54,221
  • 7
  • 29
  • 56
erdnj
  • 1
  • 1

1 Answers1

0

I have created a solution.

  1. Download the google_maps_flutter
  2. Edit the code in google_maps_flutter-2.1.8/iOS/Classes/GoogleMapController.m from
    _mapView.delegate = weakSelf;
    _registrar = registrar;

to

    _mapView.delegate = weakSelf;
    _mapView.paddingAdjustmentBehavior = kGMSMapViewPaddingAdjustmentBehaviorNever;
    _registrar = registrar;

  1. Put this modified google_maps_flutter-2.1.8 folder into somewhere. Let say parentFolder/google_maps_flutter-2.1.8.

  2. In pubspec.yaml file which flutter project you want to use this modified package.

google_maps_flutter:
    path: parentFolder/google_maps_flutter-2.1.8

Also I have opened a issue about that on GitHub. More detailed info is at there.

erdnj
  • 1
  • 1