mirror of
https://github.com/flutter/samples.git
synced 2025-11-08 13:58:47 +00:00
Add stub reviews to the place details sheet. (#22)
* Add stub place reviews to the place details sheet. Offers a better demonstration of the map in a list view.
This commit is contained in:
@@ -4,12 +4,13 @@ import 'package:flutter/rendering.dart';
|
|||||||
import 'package:google_maps_flutter/google_maps_flutter.dart';
|
import 'package:google_maps_flutter/google_maps_flutter.dart';
|
||||||
|
|
||||||
import 'place.dart';
|
import 'place.dart';
|
||||||
|
import 'stub_data.dart';
|
||||||
|
|
||||||
class PlaceDetails extends StatefulWidget {
|
class PlaceDetails extends StatefulWidget {
|
||||||
const PlaceDetails({
|
const PlaceDetails({
|
||||||
Key key,
|
|
||||||
@required this.place,
|
@required this.place,
|
||||||
@required this.onChanged,
|
@required this.onChanged,
|
||||||
|
Key key,
|
||||||
}) : assert(place != null),
|
}) : assert(place != null),
|
||||||
assert(onChanged != null),
|
assert(onChanged != null),
|
||||||
super(key: key);
|
super(key: key);
|
||||||
@@ -38,10 +39,8 @@ class PlaceDetailsState extends State<PlaceDetails> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
void _onMapCreated(GoogleMapController controller) {
|
void _onMapCreated(GoogleMapController controller) {
|
||||||
setState(() {
|
|
||||||
_mapController = controller;
|
_mapController = controller;
|
||||||
_mapController.addMarker(MarkerOptions(position: _place.latLng));
|
_mapController.addMarker(MarkerOptions(position: _place.latLng));
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Widget _detailsBody() {
|
Widget _detailsBody() {
|
||||||
@@ -77,6 +76,7 @@ class PlaceDetailsState extends State<PlaceDetails> {
|
|||||||
mapController: _mapController,
|
mapController: _mapController,
|
||||||
onMapCreated: _onMapCreated,
|
onMapCreated: _onMapCreated,
|
||||||
),
|
),
|
||||||
|
const _Reviews(),
|
||||||
],
|
],
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -111,10 +111,13 @@ class PlaceDetailsState extends State<PlaceDetails> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class _NameTextField extends StatelessWidget {
|
class _NameTextField extends StatelessWidget {
|
||||||
_NameTextField({
|
const _NameTextField({
|
||||||
@required this.controller,
|
@required this.controller,
|
||||||
@required this.onChanged,
|
@required this.onChanged,
|
||||||
});
|
Key key,
|
||||||
|
}) : assert(controller != null),
|
||||||
|
assert(onChanged != null),
|
||||||
|
super(key: key);
|
||||||
|
|
||||||
final TextEditingController controller;
|
final TextEditingController controller;
|
||||||
final ValueChanged<String> onChanged;
|
final ValueChanged<String> onChanged;
|
||||||
@@ -124,9 +127,9 @@ class _NameTextField extends StatelessWidget {
|
|||||||
return Padding(
|
return Padding(
|
||||||
padding: const EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 16.0),
|
padding: const EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 16.0),
|
||||||
child: TextField(
|
child: TextField(
|
||||||
decoration: InputDecoration(
|
decoration: const InputDecoration(
|
||||||
labelText: 'Name',
|
labelText: 'Name',
|
||||||
labelStyle: const TextStyle(fontSize: 18.0),
|
labelStyle: TextStyle(fontSize: 18.0),
|
||||||
),
|
),
|
||||||
style: const TextStyle(fontSize: 20.0, color: Colors.black87),
|
style: const TextStyle(fontSize: 20.0, color: Colors.black87),
|
||||||
autocorrect: true,
|
autocorrect: true,
|
||||||
@@ -140,10 +143,13 @@ class _NameTextField extends StatelessWidget {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class _DescriptionTextField extends StatelessWidget {
|
class _DescriptionTextField extends StatelessWidget {
|
||||||
_DescriptionTextField({
|
const _DescriptionTextField({
|
||||||
@required this.controller,
|
@required this.controller,
|
||||||
@required this.onChanged,
|
@required this.onChanged,
|
||||||
});
|
Key key,
|
||||||
|
}) : assert(controller != null),
|
||||||
|
assert(onChanged != null),
|
||||||
|
super(key: key);
|
||||||
|
|
||||||
final TextEditingController controller;
|
final TextEditingController controller;
|
||||||
final ValueChanged<String> onChanged;
|
final ValueChanged<String> onChanged;
|
||||||
@@ -153,9 +159,9 @@ class _DescriptionTextField extends StatelessWidget {
|
|||||||
return Padding(
|
return Padding(
|
||||||
padding: const EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 16.0),
|
padding: const EdgeInsets.fromLTRB(0.0, 0.0, 0.0, 16.0),
|
||||||
child: TextField(
|
child: TextField(
|
||||||
decoration: InputDecoration(
|
decoration: const InputDecoration(
|
||||||
labelText: 'Description',
|
labelText: 'Description',
|
||||||
labelStyle: const TextStyle(fontSize: 18.0),
|
labelStyle: TextStyle(fontSize: 18.0),
|
||||||
),
|
),
|
||||||
style: const TextStyle(fontSize: 20.0, color: Colors.black87),
|
style: const TextStyle(fontSize: 20.0, color: Colors.black87),
|
||||||
maxLines: null,
|
maxLines: null,
|
||||||
@@ -171,10 +177,11 @@ class _DescriptionTextField extends StatelessWidget {
|
|||||||
|
|
||||||
class _StarBar extends StatelessWidget {
|
class _StarBar extends StatelessWidget {
|
||||||
const _StarBar({
|
const _StarBar({
|
||||||
Key key,
|
|
||||||
@required this.rating,
|
@required this.rating,
|
||||||
@required this.onChanged,
|
@required this.onChanged,
|
||||||
}) : assert(rating != null && rating >= 0 && rating <= 5),
|
Key key,
|
||||||
|
}) : assert(rating != null && rating >= 0 && rating <= maxStars),
|
||||||
|
assert(onChanged != null),
|
||||||
super(key: key);
|
super(key: key);
|
||||||
|
|
||||||
static const int maxStars = 5;
|
static const int maxStars = 5;
|
||||||
@@ -200,12 +207,14 @@ class _StarBar extends StatelessWidget {
|
|||||||
}
|
}
|
||||||
|
|
||||||
class _Map extends StatelessWidget {
|
class _Map extends StatelessWidget {
|
||||||
_Map({
|
const _Map({
|
||||||
Key key,
|
|
||||||
@required this.center,
|
@required this.center,
|
||||||
@required this.mapController,
|
@required this.mapController,
|
||||||
@required this.onMapCreated,
|
@required this.onMapCreated,
|
||||||
}) : assert(center != null);
|
Key key,
|
||||||
|
}) : assert(center != null),
|
||||||
|
assert(onMapCreated != null),
|
||||||
|
super(key: key);
|
||||||
|
|
||||||
final LatLng center;
|
final LatLng center;
|
||||||
final GoogleMapController mapController;
|
final GoogleMapController mapController;
|
||||||
@@ -236,3 +245,90 @@ class _Map extends StatelessWidget {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
class _Reviews extends StatelessWidget {
|
||||||
|
const _Reviews({
|
||||||
|
Key key,
|
||||||
|
}) : super(key: key);
|
||||||
|
|
||||||
|
Widget _buildSingleReview(String reviewText) {
|
||||||
|
return Column(
|
||||||
|
children: <Widget>[
|
||||||
|
Padding(
|
||||||
|
padding: const EdgeInsets.symmetric(vertical: 10.0),
|
||||||
|
child: Row(
|
||||||
|
children: <Widget>[
|
||||||
|
Container(
|
||||||
|
width: 80.0,
|
||||||
|
height: 80.0,
|
||||||
|
decoration: BoxDecoration(
|
||||||
|
borderRadius: BorderRadius.circular(40.0),
|
||||||
|
border: Border.all(
|
||||||
|
width: 3.0,
|
||||||
|
color: Colors.grey,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
child: Row(
|
||||||
|
mainAxisAlignment: MainAxisAlignment.center,
|
||||||
|
children: const <Widget>[
|
||||||
|
Text(
|
||||||
|
'5',
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 24.0,
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
color: Colors.black87,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Icon(
|
||||||
|
Icons.star,
|
||||||
|
color: Colors.amber,
|
||||||
|
size: 36.0,
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(width: 16.0),
|
||||||
|
Expanded(
|
||||||
|
child: Text(
|
||||||
|
reviewText,
|
||||||
|
style: const TextStyle(fontSize: 20.0, color: Colors.black87),
|
||||||
|
maxLines: null,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Divider(
|
||||||
|
height: 8.0,
|
||||||
|
color: Colors.grey[700],
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return Column(
|
||||||
|
children: <Widget>[
|
||||||
|
const Padding(
|
||||||
|
padding: EdgeInsets.fromLTRB(0.0, 12.0, 0.0, 8.0),
|
||||||
|
child: Align(
|
||||||
|
alignment: Alignment.topLeft,
|
||||||
|
child: Text(
|
||||||
|
'Reviews',
|
||||||
|
style: TextStyle(
|
||||||
|
fontSize: 24.0,
|
||||||
|
fontWeight: FontWeight.bold,
|
||||||
|
decoration: TextDecoration.underline,
|
||||||
|
color: Colors.black87,
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
Column(
|
||||||
|
children: StubData.reviewStrings.map((reviewText) => _buildSingleReview(reviewText)).toList(),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@@ -4,7 +4,7 @@ import 'package:flutter/rendering.dart';
|
|||||||
import 'package:google_maps_flutter/google_maps_flutter.dart';
|
import 'package:google_maps_flutter/google_maps_flutter.dart';
|
||||||
|
|
||||||
import 'place.dart';
|
import 'place.dart';
|
||||||
import 'place_stub_data.dart';
|
import 'stub_data.dart';
|
||||||
import 'place_details.dart';
|
import 'place_details.dart';
|
||||||
|
|
||||||
class PlaceMap extends StatefulWidget {
|
class PlaceMap extends StatefulWidget {
|
||||||
@@ -57,7 +57,7 @@ class PlaceMapState extends State<PlaceMap> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
Future<Map<Marker, Place>> _initializeStubPlaces() async {
|
Future<Map<Marker, Place>> _initializeStubPlaces() async {
|
||||||
await Future.wait(PlaceStubData.places.map((Place place) => _initializeStubPlace(place)));
|
await Future.wait(StubData.places.map((Place place) => _initializeStubPlace(place)));
|
||||||
return _places;
|
return _places;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -435,7 +435,7 @@ class _MapFabs extends StatelessWidget {
|
|||||||
child: Column(
|
child: Column(
|
||||||
children: <Widget>[
|
children: <Widget>[
|
||||||
FloatingActionButton(
|
FloatingActionButton(
|
||||||
heroTag: "add_place_button",
|
heroTag: 'add_place_button',
|
||||||
onPressed: onAddPlacePressed,
|
onPressed: onAddPlacePressed,
|
||||||
materialTapTargetSize: MaterialTapTargetSize.padded,
|
materialTapTargetSize: MaterialTapTargetSize.padded,
|
||||||
backgroundColor: Colors.green,
|
backgroundColor: Colors.green,
|
||||||
@@ -443,7 +443,7 @@ class _MapFabs extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
SizedBox(height: 12.0),
|
SizedBox(height: 12.0),
|
||||||
FloatingActionButton(
|
FloatingActionButton(
|
||||||
heroTag: "toggle_map_type_button",
|
heroTag: 'toggle_map_type_button',
|
||||||
onPressed: onToggleMapTypePressed,
|
onPressed: onToggleMapTypePressed,
|
||||||
materialTapTargetSize: MaterialTapTargetSize.padded,
|
materialTapTargetSize: MaterialTapTargetSize.padded,
|
||||||
mini: true,
|
mini: true,
|
||||||
@@ -452,7 +452,6 @@ class _MapFabs extends StatelessWidget {
|
|||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
|
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import 'package:google_maps_flutter/google_maps_flutter.dart';
|
|||||||
|
|
||||||
import 'place.dart';
|
import 'place.dart';
|
||||||
|
|
||||||
class PlaceStubData {
|
class StubData {
|
||||||
static const List<Place> places = [
|
static const List<Place> places = [
|
||||||
Place(
|
Place(
|
||||||
latLng: LatLng(45.524676, -122.681922),
|
latLng: LatLng(45.524676, -122.681922),
|
||||||
@@ -96,4 +96,10 @@ class PlaceStubData {
|
|||||||
category: PlaceCategory.wantToGo,
|
category: PlaceCategory.wantToGo,
|
||||||
starRating: 4),
|
starRating: 4),
|
||||||
];
|
];
|
||||||
|
|
||||||
|
static const List<String> reviewStrings = [
|
||||||
|
'My favorite place in Portand. The employees are wonderful and so is the food. I go here at least once a month!',
|
||||||
|
'Staff was very friendly. Great atmosphere and good music. Would reccommend.',
|
||||||
|
'Best. Place. In. Town. Period.'
|
||||||
|
];
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user