I have created a locator App for health services.
I Shows the location of Hospitals on the map with the list of hospitals below. Originally the Map showed on 50% of the screen and the list showed below.
No I wan the Map to cover the whole screen and the scrolling list to occupy the bottom half of the page with padding.
I tried stacking them but i am failing.
I managed to get the map to cover the whole screen bu the list does not show any more.
I hope it clear. Someone help.
There are no errors but the scrollable list does not show
import 'package:flutter/material.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:geolocator/geolocator.dart';
import 'package:drmap/services/geolocator_service.dart';
import 'package:drmap/services/marker_service.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:provider/provider.dart';
import 'package:url_launcher/url_launcher.dart';
import '../models/place.dart';
class Search extends StatelessWidget {
@override
Widget build(BuildContext context) {
final currentPosition = Provider.of<Position>(context);
final placesProvider = Provider.of<Future<List<Place>>>(context);
final geoService = GeoLocatorService();
final markerService = MarkerService();
return Stack(
children: <Widget>[
Container(
child: FutureProvider(
create: (context) => placesProvider,
child: Scaffold(
backgroundColor: Colors.grey[100],
body: (currentPosition != null)
? Consumer<List<Place>>(
builder: (_, places, __) {
var markers = (places != null)
? markerService.getMarkers(places)
: List<Marker>();
return (places != null)
? Column(
children: <Widget>[
Container(
height:
MediaQuery.of(context).size.height / 1,
width: MediaQuery.of(context).size.width,
child: GoogleMap(
initialCameraPosition: CameraPosition(
target: LatLng(
currentPosition.latitude,
currentPosition.longitude),
zoom: 16.0),
zoomGesturesEnabled: true,
markers: Set<Marker>.of(markers),
),
),
/* SizedBox(
height: 10.0,
),
*/
// List of locations
Container(
child: Expanded(
child: (places.length > 0)
? ListView.builder(
itemCount: places.length,
itemBuilder: (context, index) {
return FutureProvider(
create: (context) =>
geoService.getDistance(
currentPosition
.latitude,
currentPosition
.longitude,
places[index]
.geometry
.location
.lat,
places[index]
.geometry
.location
.lng),
// Card List
child: Padding(
padding:
const EdgeInsets.only(
left: 8.0,
right: 8.0),
child: Card(
color: Colors.white,
child: ListTile(
title: Text(
places[index].name),
subtitle: Column(
crossAxisAlignment:
CrossAxisAlignment
.start,
children: <Widget>[
SizedBox(
height: 3.0,
),
(places[index]
.rating !=
null)
? Row(
children: <
Widget>[
RatingBarIndicator(
rating:
places[index].rating,
itemBuilder: (context, index) => Icon(
Icons
.star,
color:
Colors.teal[400]),
itemCount:
5,
itemSize:
20.0,
direction:
Axis.horizontal,
)
],
)
: Row(),
SizedBox(
height: 5.0,
),
Consumer<double>(
builder: (context,
meters,
wiget) {
return (meters !=
null)
? Text(
'${places[index].vicinity}) u00b7 ${(meters / 1000).toStringAsFixed(2)} km',
style: TextStyle(
fontWeight:
FontWeight.bold),
)
: Container();
},
)
],
),
trailing: IconButton(
icon: Icon(
Icons.directions),
color:
Theme.of(context)
.primaryColor,
onPressed: () {
_launchMapsUrl(
places[index]
.geometry
.location
.lat,
places[index]
.geometry
.location
.lng);
},
),
),
),
),
);
})
: Center(
child: Text(
'No Medical Services Found'),
),
),
)
],
)
: Center(child: CircularProgressIndicator());
},
)
: Center(
child: CircularProgressIndicator(),
),
),
