Question

我正在尝试将 google map 集成到 flutter 中，google map 的所有不同图标都工作正常，但地图未按应有的方式显示。地图一片空白。

代码如下：

import 'dart:async';
import "package:url_launcher/url_launcher.dart";
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

class Get_address extends StatefulWidget{
  @override
  _Get_addressState createState() => _Get_addressState();
}

class _Get_addressState extends State<Get_address> {
    Completer<GoogleMapController> _controller = Completer();
    
    @override
  void initState() {
    super.initState();
  }
  double zoomVal=5.0;
  
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: const Text('Helping Hands'),
        centerTitle: true,
        titleTextStyle: TextStyle(
            fontSize: 30,
            fontWeight: FontWeight.bold
        ),
        backgroundColor: Colors.lightBlue[900],
      ),
      body: Stack(
            children: [
              _buildGoogleMap(context),
              _zoomminusfunction(),
              _zoomplusfunction(),
            ],
          ),
        ],
      ),
    );
  }
  
  Widget _zoomminusfunction() {

    return Align(
      alignment: Alignment.topLeft,
      child: IconButton(
          icon: Icon(FontAwesomeIcons.searchMinus,color:Color(0xff6200ee)),
          onPressed: () {
            zoomVal--;
            _minus( zoomVal);
          }),
    );
  }
  Widget _zoomplusfunction() {

    return Align(
      alignment: Alignment.topRight,
      child: IconButton(
          icon: Icon(FontAwesomeIcons.searchPlus,color:Color(0xff6200ee)),
          onPressed: () {
            zoomVal++;
            _plus(zoomVal);
          }),
    );
  }

  Future<void> _minus(double zoomVal) async {
    final GoogleMapController controller = await _controller.future;
    controller.animateCamera(CameraUpdate.newCameraPosition(CameraPosition(target: LatLng(40.712776, -74.005974), zoom: zoomVal)));
  }
  Future<void> _plus(double zoomVal) async {
    final GoogleMapController controller = await _controller.future;
    controller.animateCamera(CameraUpdate.newCameraPosition(CameraPosition(target: LatLng(40.712776, -74.005974), zoom: zoomVal)));
  }
  
  Widget _buildGoogleMap(BuildContext context) {
    return Container(
      height: 550,
      width: MediaQuery.of(context).size.width,
      child: GoogleMap(
        mapType: MapType.normal,
        initialCameraPosition:  CameraPosition(target: LatLng(40.712776, -74.005974), zoom: 12),
        onMapCreated: (GoogleMapController controller) {
          _controller.complete(controller);
        },
        markers: {
          newyork1Marker,newyork2Marker,newyork3Marker,gramercyMarker,bernardinMarker,blueMarker
        },
      ),
    );
  }

  Future<void> _gotoLocation(double lat,double long) async {
    final GoogleMapController controller = await _controller.future;
    controller.animateCamera(CameraUpdate.newCameraPosition(CameraPosition(target: LatLng(lat, long), zoom: 15,tilt: 50.0,
      bearing: 45.0,)));
  }
  
  
  
}

我尝试了不同的方法，但在任何地方都无法正确显示地图。我已经添加了 API 密钥并在清单文件中进行了必要的更改。但仍然没有显示该应用程序。有人可以帮我吗？

Answer 1

试试下面的代码。替换您的 Scaffold 并重新运行您的应用

 return Scaffold(
      appBar: AppBar(
        title: const Text('Helping Hands'),
        centerTitle: true,
        titleTextStyle: TextStyle(
            fontSize: 30,
            fontWeight: FontWeight.bold
        ),
        backgroundColor: Colors.lightBlue[900],
      ),
      body: Stack(
        children: [
          _buildGoogleMap(context),
          _zoomminusfunction(),
          _zoomplusfunction(),
        ],
      ),
    );

谷歌地图在颤动屏幕中无法正确显示

1 个答案: