How to get all detail of address when i am put mark on google map. and then it will fill up in text box in flutter

Question

I want to put a marker on the map and when I put marker it will get that address and filled into the textbox.

like I've mentioned in this images when I put a marker and then click on show address it will take that address and filled into textboxes. Hope you understand the question. if any query then let me know. I need help please help me. because I am very much stuck in this problem.

Here is some code for google maps.

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:tudo/src/styles/colors.dart';
import 'package:tudo/src/utils/navigation_helper.dart';
import 'package:tudo/src/widgets/google_map.dart';

const kGoogleApiKey = "API_KEY";

class BspAddressmapscreen extends StatefulWidget {
  BspAddressmapscreen({Key key}) : super(key: key);

  @override
  _BspAddressmapscreenState createState() => _BspAddressmapscreenState();
}

class _BspAddressmapscreenState extends State<BspAddressmapscreen> {
  final homeScaffoldKey = GlobalKey<ScaffoldState>();
  Completer<GoogleMapController> _controller = Completer();
  @override
  void initState() {
    super.initState();
  }

  double zoomVal = 5.0;
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        leading: IconButton(
            icon: Icon(Icons.arrow_back_ios),
            onPressed: () {
              NavigationHelper.navigatetoBack(context);
            }),
        centerTitle: true,
        title: Text("Business Address Detail"),
        actions: <Widget>[
          IconButton(
            icon: Icon(Icons.search),
            onPressed: () {},
          ),
        ],
      ),
      bottomNavigationBar: Container(
        color: Colors.transparent,
        height: 56,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: <Widget>[
            new FlatButton.icon(
              icon: Icon(Icons.arrow_back_ios),
              label: Text('Show Address'),
              textColor: Colors.white,
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(7),
              ),
              onPressed: () async {
                Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (context) => BspAddressmapscreen()));
              },
            ),
          ],
        ),
      ),
      body: Container(
        height: double.infinity,
        width: double.infinity,
        child: Stack(
          children: <Widget>[
            _searchbar(),
            _buildGoogleMap(context),
            _zoomminusfunction(),
            _zoomplusfunction(),
          ],
        ),
      ),
    );
  }

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

  Widget _zoomplusfunction() {
    return Align(
      alignment: Alignment.topRight,
      child: IconButton(
          icon: Icon(FontAwesomeIcons.searchPlus, color: Color(0xff008080)),
          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: MediaQuery.of(context).size.height,
      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);
        },
      ),
    );
  }

  Widget _searchbar() {
    return Positioned(
      top: 50.0,
      right: 15.0,
      left: 15.0,
      child: Container(
        height: 50.0,
        width: double.infinity,
        decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(10.0), color: Colors.white),
        child: TextField(
          decoration: InputDecoration(
              hintText: 'Enter Address',
              border: InputBorder.none,
              contentPadding: EdgeInsets.only(left: 15.0, top: 15.0),
              suffixIcon: IconButton(
                  icon: Icon(Icons.search),
                  //onPressed: searchandNavigate,
                  onPressed: () {},
                  iconSize: 30.0)),
          onChanged: (val) {
            setState(() {
              // searchAddr = val;
            });
          },
        ),
      ),
    );
  }
}

score 2 · Answer 1 · edited Sep 13 '19 at 13:13

Use below code to plot marker and get an address on button click, also use geocoder to get the address from latlng

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

const kGoogleApiKey = "API_KEY";

class BspAddressmapscreen extends StatefulWidget {
  BspAddressmapscreen({Key key}) : super(key: key);

  @override
  _BspAddressmapscreenState createState() => _BspAddressmapscreenState();
}

class _BspAddressmapscreenState extends State<BspAddressmapscreen> {
  final homeScaffoldKey = GlobalKey<ScaffoldState>();
  Completer<GoogleMapController> _controller = Completer();

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

  double zoomVal = 5.0;

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: AppBar(
        leading: IconButton(
        icon: Icon(Icons.arrow_back_ios),
        onPressed: () {
          /*NavigationHelper.navigatetoBack(context);*/
        }),
    centerTitle: true,
    title: Text("Business Address Detail"),
    actions: <Widget>[
      IconButton(
        icon: Icon(Icons.search),
        onPressed: () {},
      ),
    ],
  ),
  bottomNavigationBar: Container(
    color: Colors.transparent,
    height: 56,
    child: Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        new FlatButton.icon(
          icon: Icon(Icons.arrow_back_ios),
          label: Text('Show Address'),
          textColor: Colors.blue,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(7),
          ),
          onPressed: () {
            getUserLocation();
          },
        ),
      ],
    ),
  ),
  body: Container(
    height: double.infinity,
    width: double.infinity,
    child: Stack(
      children: <Widget>[
        _searchbar(),
        _buildGoogleMap(context),
        _zoomminusfunction(),
        _zoomplusfunction(),
      ],
    ),
  ),
    );
  }

  getUserLocation() async {
    markers.values.forEach((value) async {
  print(value.position);
  // From coordinates
  final coordinates =
      new Coordinates(value.position.latitude, value.position.longitude);
  var addresses = await Geocoder.google(kGoogleApiKey)
      .findAddressesFromCoordinates(coordinates);

  print("Address: ${addresses.first.featureName}");
    });
  }

  Widget _zoomminusfunction() {
    return Align(
      alignment: Alignment.topLeft,
      child: IconButton(
      icon: Icon(Icons.remove, color: Color(0xff008080)),
      onPressed: () {
        zoomVal--;
        _minus(zoomVal);
      }),
    );
  }

  Widget _zoomplusfunction() {
    return Align(
      alignment: Alignment.topRight,
      child: IconButton(
      icon: Icon(Icons.add, color: Color(0xff008080)),
      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)));
  }

  Map<MarkerId, Marker> markers = <MarkerId, Marker>{};

  Widget _buildGoogleMap(BuildContext context) {
    return Container(
  height: MediaQuery.of(context).size.height,
  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: Set<Marker>.of(markers.values),
    onLongPress: (LatLng latLng) {
      // creating a new MARKER
      final MarkerId markerId = MarkerId('4544');
      final Marker marker = Marker(
        markerId: markerId,
        position: latLng,
      );

      setState(() {
        markers.clear();
        // adding a new marker to map
        markers[markerId] = marker;
      });
    },
  ),
    );
  }

  Widget _searchbar() {
return Positioned(
  top: 50.0,
  right: 15.0,
  left: 15.0,
  child: Container(
    height: 50.0,
    width: double.infinity,
    decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(10.0), color: Colors.white),
    child: TextField(
      decoration: InputDecoration(
        hintText: 'Enter Address',
        border: InputBorder.none,
        contentPadding: EdgeInsets.only(left: 15.0, top: 15.0),
        suffixIcon: IconButton(
          icon: Icon(Icons.search),
          //onPressed: searchandNavigate,
          onPressed: () {},
          iconSize: 30.0,
        ),
      ),
      onChanged: (val) {
        setState(() {
          // searchAddr = val;
        });
      },
    ),
  ),
    );
 }
}

I appreciate your answer, but I get the error regarding dependency. it says resolve your dependency manually. — Rutvik Gumasana, Sep 14 '19 at 08:53

How to get all detail of address when i am put mark on google map. and then it will fill up in text box in flutter

1 Answers1