How to display map when i call screen - flutter

Question

I have been using map_view: ^0.0.14 plugin to display map in flutter. Mapview.show() method does not return widget. It returns void So i can call show() method and display map. I want to display map When page loads. How can i do that.
#override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text('Google Maps'),
),
body: new Center(
child: Container(
child: RaisedButton(
child: Text('Tap me'),
color: Colors.blue,
textColor: Colors.white,
elevation: 7.0,
onPressed: ( ) {
mapView.show(
new MapOptions(
mapViewType: MapViewType.normal,
showMyLocationButton: true,
showCompassButton: true,
showUserLocation: true,
initialCameraPosition: new CameraPosition(new Location(11.6643, 78.1460), 14.0),
title: 'Google Map'));
},
),
),
),
);
}

Answer 1

As far as I can tell map_view doesn't have a widget.
You can give google_maps_flutter a try, which has a widget that let's you do things like pan or zoom through a controller.
You'll first need to specify your API key in your app's manifest (Android):
<manifest ...
<application ...
<meta-data android:name="com.google.android.geo.API_KEY"
android:value="YOUR KEY HERE"/>
or the app delegate (iOS):
#include "AppDelegate.h"
#include "GeneratedPluginRegistrant.h"
#import "GoogleMaps/GoogleMaps.h"
#implementation AppDelegate
- (BOOL)application:(UIApplication *)application
didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
[GMSServices provideAPIKey:#"YOUR KEY HERE"];
[GeneratedPluginRegistrant registerWithRegistry:self];
return [super application:application didFinishLaunchingWithOptions:launchOptions];
}
#end
On iOS you'll also have to add a boolean to your Info.plist with the key io.flutter.embedded_views_preview and the value YES.
Then you can add the GoogleMap widget to your widget tree:
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
void main() {
runApp(MaterialApp(
home: Scaffold(
appBar: AppBar(title: const Text('Google Maps demo')),
body: MapsDemo(),
),
));
}
class MapsDemo extends StatefulWidget {
#override
State createState() => MapsDemoState();
}
class MapsDemoState extends State<MapsDemo> {
GoogleMapController mapController;
#override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.all(15.0),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: <Widget>[
Center(
child: SizedBox(
width: 300.0,
height: 200.0,
child: GoogleMap(
onMapCreated: _onMapCreated,
),
),
),
RaisedButton(
child: const Text('Go to London'),
onPressed: mapController == null ? null : () {
mapController.animateCamera(CameraUpdate.newCameraPosition(
const CameraPosition(
bearing: 270.0,
target: LatLng(51.5160895, -0.1294527),
tilt: 30.0,
zoom: 17.0,
),
));
},
),
],
),
);
}
void _onMapCreated(GoogleMapController controller) {
setState(() { mapController = controller; });
}
}