Skip to content
This repository has been archived by the owner on Apr 10, 2024. It is now read-only.

Commit

Permalink
Calculate proper vert. offset for autocomplete #13
Browse files Browse the repository at this point in the history
  • Loading branch information
Martin Braun committed Mar 6, 2022
1 parent fb4db45 commit a8829b9
Show file tree
Hide file tree
Showing 2 changed files with 161 additions and 124 deletions.
279 changes: 158 additions & 121 deletions example/lib/main.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@ class HomePage extends StatefulWidget {

class _HomePageState extends State<HomePage> {
PickResult selectedPlace;
bool showGoogleMapInContainer = false;

@override
Widget build(BuildContext context) {
Expand All @@ -58,14 +59,157 @@ class _HomePageState extends State<HomePage> {
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
ElevatedButton(
child: Text("Load Google Map"),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) {
return PlacePicker(
!showGoogleMapInContainer
? ElevatedButton(
child: Text("Load Google Map"),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) {
return PlacePicker(
apiKey: Platform.isAndroid
? APIKeys.androidApiKey
: APIKeys.iosApiKey,
hintText: "Find a place ...",
searchingText: "Please wait ...",
selectText: "Select place",
outsideOfPickAreaText: "Place not in area",
initialPosition: HomePage.kInitialPosition,
useCurrentLocation: true,
selectInitialPosition: true,
usePinPointingSearch: true,
usePlaceDetailSearch: true,
onPlacePicked: (PickResult result) {
setState(() {
selectedPlace = result;
Navigator.of(context).pop();
});
},
// #region additional stuff
// forceSearchOnZoomChanged: true,
// automaticallyImplyAppBarLeading: false,
// autocompleteLanguage: "ko",
// region: 'au',
// pickArea: CircleArea(
// center: HomePage.kInitialPosition,
// radius: 300,
// fillColor: Colors.lightGreen.withGreen(255).withAlpha(32),
// strokeColor: Colors.lightGreen.withGreen(255).withAlpha(192),
// strokeWidth: 2,
// ),
// selectedPlaceWidgetBuilder: (_, selectedPlace, state, isSearchBarFocused) {
// print("state: $state, isSearchBarFocused: $isSearchBarFocused");
// return isSearchBarFocused
// ? Container()
// : FloatingCard(
// bottomPosition: 0.0, // MediaQuery.of(context) will cause rebuild. See MediaQuery document for the information.
// leftPosition: 0.0,
// rightPosition: 0.0,
// width: 500,
// borderRadius: BorderRadius.circular(12.0),
// child: state == SearchingState.Searching
// ? Center(child: CircularProgressIndicator())
// : RaisedButton(
// child: Text("Pick Here"),
// onPressed: () {
// // IMPORTANT: You MUST manage selectedPlace data yourself as using this build will not invoke onPlacePicker as
// // this will override default 'Select here' Button.
// print("do something with [selectedPlace] data");
// Navigator.of(context).pop();
// },
// ),
// );
// },
// pinBuilder: (context, state) {
// if (state == PinState.Idle) {
// return Icon(Icons.favorite_border);
// } else {
// return Icon(Icons.favorite);
// }
// },
// introModalWidgetBuilder: (context, close) {
// return Positioned(
// top: MediaQuery.of(context).size.height * 0.35,
// right: MediaQuery.of(context).size.width * 0.15,
// left: MediaQuery.of(context).size.width * 0.15,
// child: Container(
// width: MediaQuery.of(context).size.width * 0.7,
// child: Material(
// type: MaterialType.canvas,
// color: Theme.of(context).cardColor,
// shape: RoundedRectangleBorder(
// borderRadius: BorderRadius.circular(12.0),
// ),
// elevation: 4.0,
// child: ClipRRect(
// borderRadius: BorderRadius.circular(12.0),
// child: Container(
// padding: EdgeInsets.all(8.0),
// child: Column(
// children: [
// SizedBox.fromSize(size: new Size(0, 10)),
// Text("Please select your preferred address.",
// style: TextStyle(
// fontWeight: FontWeight.bold,
// )
// ),
// SizedBox.fromSize(size: new Size(0, 10)),
// SizedBox.fromSize(
// size: Size(MediaQuery.of(context).size.width * 0.6, 56), // button width and height
// child: ClipRRect(
// borderRadius: BorderRadius.circular(10.0),
// child: Material(
// child: InkWell(
// overlayColor: MaterialStateColor.resolveWith(
// (states) => Colors.blueAccent
// ),
// onTap: close,
// child: Row(
// mainAxisAlignment: MainAxisAlignment.center,
// children: [
// Icon(Icons.check_sharp, color: Colors.blueAccent),
// SizedBox.fromSize(size: new Size(10, 0)),
// Text("OK",
// style: TextStyle(
// color: Colors.blueAccent
// )
// )
// ],
// )
// ),
// ),
// ),
// )
// ]
// )
// ),
// ),
// ),
// )
// );
// },
// #endregion
);
},
),
);
},
)
: Container(),
!showGoogleMapInContainer
? ElevatedButton(
child: Text("Load Google Map in Container"),
onPressed: () {
setState(() {
showGoogleMapInContainer = true;
});
},
)
: Container(
width: MediaQuery.of(context).size.width * 0.75,
height: MediaQuery.of(context).size.height * 0.35,
child: PlacePicker(
apiKey: Platform.isAndroid
? APIKeys.androidApiKey
: APIKeys.iosApiKey,
Expand All @@ -78,119 +222,12 @@ class _HomePageState extends State<HomePage> {
selectInitialPosition: true,
usePinPointingSearch: true,
usePlaceDetailSearch: true,
onPlacePicked: (result) {
selectedPlace = result;
Navigator.of(context).pop();
setState(() {});
},
// forceSearchOnZoomChanged: true,
// automaticallyImplyAppBarLeading: false,
// autocompleteLanguage: "ko",
// region: 'au',
// pickArea: CircleArea(
// center: HomePage.kInitialPosition,
// radius: 300,
// fillColor: Colors.lightGreen.withGreen(255).withAlpha(32),
// strokeColor: Colors.lightGreen.withGreen(255).withAlpha(192),
// strokeWidth: 2,
// ),
// selectedPlaceWidgetBuilder: (_, selectedPlace, state, isSearchBarFocused) {
// print("state: $state, isSearchBarFocused: $isSearchBarFocused");
// return isSearchBarFocused
// ? Container()
// : FloatingCard(
// bottomPosition: 0.0, // MediaQuery.of(context) will cause rebuild. See MediaQuery document for the information.
// leftPosition: 0.0,
// rightPosition: 0.0,
// width: 500,
// borderRadius: BorderRadius.circular(12.0),
// child: state == SearchingState.Searching
// ? Center(child: CircularProgressIndicator())
// : RaisedButton(
// child: Text("Pick Here"),
// onPressed: () {
// // IMPORTANT: You MUST manage selectedPlace data yourself as using this build will not invoke onPlacePicker as
// // this will override default 'Select here' Button.
// print("do something with [selectedPlace] data");
// Navigator.of(context).pop();
// },
// ),
// );
// },
// pinBuilder: (context, state) {
// if (state == PinState.Idle) {
// return Icon(Icons.favorite_border);
// } else {
// return Icon(Icons.favorite);
// }
// },
// introModalWidgetBuilder: (context, close) {
// return Positioned(
// top: MediaQuery.of(context).size.height * 0.35,
// right: MediaQuery.of(context).size.width * 0.15,
// left: MediaQuery.of(context).size.width * 0.15,
// child: Container(
// width: MediaQuery.of(context).size.width * 0.7,
// child: Material(
// type: MaterialType.canvas,
// color: Theme.of(context).cardColor,
// shape: RoundedRectangleBorder(
// borderRadius: BorderRadius.circular(12.0),
// ),
// elevation: 4.0,
// child: ClipRRect(
// borderRadius: BorderRadius.circular(12.0),
// child: Container(
// padding: EdgeInsets.all(8.0),
// child: Column(
// children: [
// SizedBox.fromSize(size: new Size(0, 10)),
// Text("Please select your preferred address.",
// style: TextStyle(
// fontWeight: FontWeight.bold,
// )
// ),
// SizedBox.fromSize(size: new Size(0, 10)),
// SizedBox.fromSize(
// size: Size(MediaQuery.of(context).size.width * 0.6, 56), // button width and height
// child: ClipRRect(
// borderRadius: BorderRadius.circular(10.0),
// child: Material(
// child: InkWell(
// overlayColor: MaterialStateColor.resolveWith(
// (states) => Colors.blueAccent
// ),
// onTap: close,
// child: Row(
// mainAxisAlignment: MainAxisAlignment.center,
// children: [
// Icon(Icons.check_sharp, color: Colors.blueAccent),
// SizedBox.fromSize(size: new Size(10, 0)),
// Text("OK",
// style: TextStyle(
// color: Colors.blueAccent
// )
// )
// ],
// )
// ),
// ),
// ),
// )
// ]
// )
// ),
// ),
// ),
// )
// );
// },
);
},
),
);
},
),
onPlacePicked: (PickResult result) {
setState(() {
selectedPlace = result;
showGoogleMapInContainer = false;
});
})),
selectedPlace == null
? Container()
: Text(selectedPlace.formattedAddress ?? ""),
Expand Down
6 changes: 3 additions & 3 deletions lib/src/autocomplete_search.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -198,8 +198,6 @@ class AutoCompleteSearchState extends State<AutoCompleteSearch> {
_searchPlace(String searchTerm) {
this.provider.prevSearchTerm = searchTerm;

if (context == null) return;

_clearOverlay();

if (searchTerm.length < 1) return;
Expand All @@ -220,11 +218,13 @@ class AutoCompleteSearchState extends State<AutoCompleteSearch> {
_clearOverlay();

final RenderBox? appBarRenderBox = widget.appBarKey.currentContext!.findRenderObject() as RenderBox?;
final translation = appBarRenderBox?.getTransformTo(null).getTranslation();
final Offset offset = translation != null ? Offset(translation.x, translation.y) : Offset(0.0, 0.0);
final screenWidth = MediaQuery.of(context).size.width;

overlayEntry = OverlayEntry(
builder: (context) => Positioned(
top: appBarRenderBox!.size.height,
top: appBarRenderBox!.paintBounds.shift(offset).top + appBarRenderBox.size.height,
left: screenWidth * 0.025,
right: screenWidth * 0.025,
child: Material(
Expand Down

0 comments on commit a8829b9

Please sign in to comment.