How can I adjust the height of a Google Map in order to see the background of the page slightly. I've been using curved_navigation_bar
It would be great if anybody could help me out, thank you so much in advance!.
Current result
Expected output
Navigation Bar
Widget _content = Container();
Color color = Colors.deepPurple;
class HomePage extends State<MyHomePage>{
@override
Widget build(BuildContext context){
return Scaffold(
backgroundColor: color,
body: _content,
bottomNavigationBar: CurvedNavigationBar(
backgroundColor: color,
items: [
Icon(Icons.home),
Icon(Icons.dashboard),
Icon(Icons.settings)
],
onTap: (index){
setState(() {
if (index ==0){
_content = GoogleMapScreen();
}
else if (index ==1){
_content = GoogleMapScreen();
}
else{
_content = GoogleMapScreen();
}
});
},
),
);
}
}
Google Map Page
class GoogleMapScreen extends StatefulWidget{
@override
_GoogleMapScreenState createState() => _GoogleMapScreenState();
}
class _GoogleMapScreenState extends State<GoogleMapScreen>{
Set<Marker> _markers = {};
void _onMapCreated(GoogleMapController controller) {
setState(() {
_markers.add(
Marker(markerId: MarkerId('id-1'),
position: LatLng(39.9042, 116.4074),
infoWindow: InfoWindow(
title: 'Sample Marker',
snippet: 'A secret Place',
)
),
);
});
}
@override
Widget build(BuildContext context){
return Scaffold(
appBar: AppBar(
title: Text('API MAP'),
),
body: GoogleMap(
onMapCreated: _onMapCreated,
markers: _markers,
initialCameraPosition: CameraPosition(target: LatLng(39.9042, 116.4074),
zoom: 15,
))
);
}
}
Solution 1: BabC
You can wrap your GoogleMap widget into a Padding :
body:Padding(
padding: EdgeInsets.only(bottom 16.0),
child : GoogleMap(
onMapCreated: _onMapCreated,
markers: _markers,
initialCameraPosition: CameraPosition(target: LatLng(39.9042, 116.4074),
zoom: 15,
)))