Google_maps_Places issue

I am trying to create Google maps address search bar from here:

But I have encountered class undefined error. Is there something I am missing? Please help me.

Hey @Aman_Kr_Sharma ! Try installing:

https://pub.dev/packages/google_maps_webservice

And then add this import:
import 'package:google_maps_webservice/places.dart';

1 Like

Yeah, did that and it worked. Thanks, @sakina. But I have encountered some new kind of exception.

1 Like

Here is the code:

https://pastebin.com/iPd1YsYk

@Aman_Kr_Sharma

There is some issue with MaterialApp context in the library.The Navigator won’t work if you’re doing in under MateriaApp context like this.

You should instead create another widget as Home in Material App.

Reference

import 'package:flutter/material.dart';
import 'package:flutter_google_places/flutter_google_places.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'dart:async';
import 'package:google_maps_webservice/places.dart';
import 'package:geocoder/geocoder.dart';
 
void main() => runApp(MyApp());
 
const kGoogleApiKey = "My API key";
 
GoogleMapsPlaces _places = GoogleMapsPlaces(apiKey: kGoogleApiKey);
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        home: new HomeScreen());
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}
 
Future<Null> displayPrediction(Prediction p) async {
  if (p != null) {
    PlacesDetailsResponse detail = await _places.getDetailsByPlaceId(p.placeId);
 
    var placeId = p.placeId;
    double lat = detail.result.geometry.location.lat;
    double lng = detail.result.geometry.location.lng;
 
    var address = await Geocoder.local.findAddressesFromQuery(p.description);
 
    print(lat);
    print(lng);
  }
}
 
class _HomeScreenState extends State<HomeScreen> {
  GoogleMapController mapController;
 
  final LatLng _center = const LatLng(45.521563, -122.677433);
 
  void _onMapCreated(GoogleMapController controller) {
    mapController = controller;
  }
 
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        drawer: Drawer(
          child: ListView(
            padding: EdgeInsets.only(right: 10),
            children: <Widget>[
              DrawerHeader(
                padding: EdgeInsets.all(30),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    CircleAvatar(
                      backgroundImage: new NetworkImage(
                          'https://1.bp.blogspot.com/-xkOa184EX9w/XVhTRa2WRQI/AAAAAAAAb1E/jPDX8jZ8mAIsqqNEDgb8lmfKbttdP1BDACLcBGAs/w680/Profile-Picture-For-Boys%2B%252812%2529.jpg'),
                    ),
                    Text(
                      "Good morning,",
                      style: TextStyle(color: Colors.grey, fontSize: 16.0),
                    ),
                    Text(
                      "Avi",
                      style: TextStyle(
                          color: Colors.grey,
                          fontSize: 22.0,
                          fontWeight: FontWeight.bold),
                    )
                  ],
                ),
              ),
              ListTile(
                title: Text(
                  'Payment History',
                  style: TextStyle(fontSize: 20),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(
                  'Ride History',
                  style: TextStyle(fontSize: 20),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(
                  'Invite Friends',
                  style: TextStyle(fontSize: 20),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(
                  'Promo Codes',
                  style: TextStyle(fontSize: 20),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(
                  'Settings',
                  style: TextStyle(fontSize: 20),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(
                  'Support',
                  style: TextStyle(fontSize: 20),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
              ListTile(
                title: Text(
                  'Log Out',
                  style: TextStyle(fontSize: 20),
                ),
                onTap: () {
                  Navigator.pop(context);
                },
              ),
            ],
          ),
        ),
        appBar: PreferredSize(
          preferredSize: Size.fromHeight(70),
          child: AppBar(
            backgroundColor: Colors.transparent,
            elevation: 0,
            title: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  "Good morning, Avi",
                  style: TextStyle(color: Colors.grey, fontSize: 16.0),
                ),
                Text(
                  "Where are you going?",
                  style: TextStyle(
                      color: Colors.grey,
                      fontSize: 22.0,
                      fontWeight: FontWeight.bold),
                )
              ],
            ),
            leading: new Padding(
              padding: const EdgeInsets.all(5.0),
              child: new CircleAvatar(
                backgroundImage: new NetworkImage(
                    'https://1.bp.blogspot.com/-xkOa184EX9w/XVhTRa2WRQI/AAAAAAAAb1E/jPDX8jZ8mAIsqqNEDgb8lmfKbttdP1BDACLcBGAs/w680/Profile-Picture-For-Boys%2B%252812%2529.jpg'),
              ),
            ),
          ),
        ),
        body: Stack(
          children: <Widget>[
            GoogleMap(
              onMapCreated: _onMapCreated,
              initialCameraPosition: CameraPosition(
                target: _center,
                zoom: 15.0,
              ),
            ),
            Positioned(
              top: 10,
              right: 20,
              left: 20,
              child: Container(
                color: Colors.white,
                child: Row(
                  children: <Widget>[
                    Expanded(
                      child: TextField(
                        cursorColor: Colors.black,
                        keyboardType: TextInputType.text,
                        textInputAction: TextInputAction.go,
                        decoration: InputDecoration(
                          border: new OutlineInputBorder(
                            borderRadius: const BorderRadius.all(
                              const Radius.circular(10),
                            ),
                          ),
                          suffixIcon: IconButton(
                            //search icon
                            splashColor: Colors.grey,
                            icon: Icon(
                              Icons.search,
                              color: Colors.grey,
                            ),
                            onPressed: () async {
                              Prediction p = await PlacesAutocomplete.show(
                                  context: context, apiKey: kGoogleApiKey);
                              displayPrediction(p);
                            },
                          ),
                          contentPadding: EdgeInsets.symmetric(horizontal: 20),
                          hintText: "Search for destination",
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
            Stack(
              children: <Widget>[
                Positioned(
                  top: 500,
                  left: 320,
                  child: Container(
                      decoration: new BoxDecoration(
                        shape: BoxShape.circle,
                        color: Colors.green,
                      ),
                      child: IconButton(
                        icon: Icon(
                          Icons.gps_fixed,
                          color: Colors.white,
                        ),
                        onPressed: () {},
                      )),
                ),
              ],
            )
          ],
        ),
      ),
    );
  }
}