jonaszbigda/menui_mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

+ Autocomplete (prototype)

Browse Source
This commit is contained in:
Jonasz Bigda
2020-10-12 19:51:53 +02:00
parent 4dfd1c5e4a
commit e025484cab
6 changed files with 160 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

149
lib/components.dart
View File

@@ -1,4 +1,7 @@
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
class RestaurantCard extends StatelessWidget {
RestaurantCard(
@@ -68,41 +71,125 @@ class MenuiSearchBar extends StatefulWidget {
class MenuiSearchBarState extends State<MenuiSearchBar> {
final _formKey = GlobalKey<FormState>();
var suggestions = <String>[];
bool suggestionsOpen = false;
final LayerLink layerLink = LayerLink();
OverlayEntry _overlayEntry;
Future<void> fetchAutocomplete(text) async {
final response = await http.get(
'https://menui.azurewebsites.net/search/autocomplete?string=$text');
final cities = jsonDecode(response.body)['cities'];
final restaurants = jsonDecode(response.body)['restaurants'];
final List<String> result = [...cities, ...restaurants];
setState(() {
suggestions = result;
});
if (!suggestionsOpen && result.isNotEmpty) {
setState(() {
suggestionsOpen = true;
});
_overlayEntry = _createOverlayEntry();
Overlay.of(context).insert(_overlayEntry);
}
print(suggestions);
}
void hideSuggestions() {
if (suggestionsOpen) {
_overlayEntry.remove();
setState(() {
suggestionsOpen = false;
});
}
}
OverlayEntry _createOverlayEntry() {
RenderBox renderBox = context.findRenderObject();
var size = renderBox.size;
return OverlayEntry(
builder: (context) => GestureDetector(
behavior: HitTestBehavior.translucent,
onTap: () {
hideSuggestions();
},
child: Align(
alignment: Alignment.topCenter,
child: Stack(
children: [
Positioned(
width: size.width,
child: CompositedTransformFollower(
offset: Offset(0.0, size.height + 5.0),
link: layerLink,
showWhenUnlinked: false,
child: Material(
color: Colors.grey[800],
elevation: 4.0,
child: ConstrainedBox(
constraints: new BoxConstraints(maxHeight: 200),
child: ListView.builder(
padding: EdgeInsets.zero,
shrinkWrap: true,
itemCount: suggestions.length,
itemBuilder: (context, index) {
return ListTile(
title: Text(
suggestions[index],
style: TextStyle(color: Colors.orange),
),
);
}),
),
),
),
)
],
))));
}
@override
Widget build(BuildContext context) {
return Form(
key: _formKey,
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(12),
child: TextFormField(
style: TextStyle(color: Colors.orange),
decoration: InputDecoration(
hintStyle: TextStyle(color: Colors.grey),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.grey, width: 1.0),
borderRadius: BorderRadius.circular(12)),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.orange, width: 2.0),
borderRadius: BorderRadius.circular(12)),
hintText: 'Wyszukaj miasto lub nazwę restauracji.',
suffixIcon: Icon(
Icons.search,
color: Colors.orange,
)),
validator: (value) {
if (value.isEmpty) {
return 'Wpisz coś w pole wyszukiwania.';
}
return null;
},
cursorColor: Colors.orange,
),
key: _formKey,
child: CompositedTransformTarget(
link: layerLink,
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.all(12),
child: TextFormField(
onChanged: (text) => fetchAutocomplete(text),
style: TextStyle(color: Colors.orange),
decoration: InputDecoration(
hintStyle: TextStyle(color: Colors.grey),
enabledBorder: OutlineInputBorder(
borderSide:
BorderSide(color: Colors.grey, width: 1.0),
borderRadius: BorderRadius.circular(12)),
focusedBorder: OutlineInputBorder(
borderSide:
BorderSide(color: Colors.orange, width: 2.0),
borderRadius: BorderRadius.circular(12)),
hintText: 'Wyszukaj miasto lub nazwę restauracji.',
suffixIcon: Icon(
Icons.search,
color: Colors.orange,
)),
validator: (value) {
if (value.isEmpty) {
return 'Wpisz coś w pole wyszukiwania.';
}
return null;
},
cursorColor: Colors.orange,
),
),
],
),
],
),
);
));
}
}

1
lib/dataTypes.dart Normal file
View File

@@ -0,0 +1 @@

29
lib/main.dart
View File

@@ -8,17 +8,24 @@ void main() {
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Menui',
theme: ThemeData(
primarySwatch: Colors.orange,
primaryColor: Colors.orange,
accentColor: Colors.grey,
backgroundColor: Colors.grey,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: HomePage(title: 'Menui - food guide'),
);
return GestureDetector(
onTap: () {
FocusScopeNode currentFocus = FocusScope.of(context);
if (!currentFocus.hasPrimaryFocus) {
currentFocus.focusedChild.unfocus();
}
},
child: MaterialApp(
title: 'Menui',
theme: ThemeData(
primarySwatch: Colors.orange,
primaryColor: Colors.orange,
accentColor: Colors.grey,
backgroundColor: Colors.grey,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: HomePage(title: 'Menui - food guide'),
));
}
}