Start to implement search action
This commit is contained in:
parent
16e9f79e14
commit
57cbcd2096
|
@ -11,6 +11,10 @@ import 'package:path_provider/path_provider.dart';
|
||||||
|
|
||||||
class HomeProvider with ChangeNotifier {
|
class HomeProvider with ChangeNotifier {
|
||||||
int _currentIndex = 0;
|
int _currentIndex = 0;
|
||||||
|
bool isSearching;
|
||||||
|
Icon searchIcon = Icon(Icons.search);
|
||||||
|
final TextEditingController searchQuery = new TextEditingController();
|
||||||
|
Widget appBarTitle = Text('Ğecko', style: TextStyle(color: Colors.grey[850]));
|
||||||
|
|
||||||
get currentIndex => _currentIndex;
|
get currentIndex => _currentIndex;
|
||||||
|
|
||||||
|
@ -100,9 +104,31 @@ class HomeProvider with ChangeNotifier {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
searchAction() {
|
||||||
|
//TODO: OPEN SEARCH MODE !!
|
||||||
|
print('Search mode');
|
||||||
|
}
|
||||||
|
|
||||||
T getRandomElement<T>(List<T> list) {
|
T getRandomElement<T>(List<T> list) {
|
||||||
final random = new Random();
|
final random = Random();
|
||||||
var i = random.nextInt(list.length);
|
var i = random.nextInt(list.length);
|
||||||
return list[i];
|
return list[i];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
void handleSearchStart() {
|
||||||
|
isSearching = true;
|
||||||
|
notifyListeners();
|
||||||
|
}
|
||||||
|
|
||||||
|
void handleSearchEnd() {
|
||||||
|
searchIcon = Icon(
|
||||||
|
Icons.search,
|
||||||
|
color: Colors.grey[850],
|
||||||
|
);
|
||||||
|
appBarTitle = Text('Ğecko', style: TextStyle(color: Colors.grey[850]));
|
||||||
|
isSearching = false;
|
||||||
|
searchQuery.clear();
|
||||||
|
|
||||||
|
notifyListeners();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -65,12 +65,36 @@ class HomeScreen extends StatelessWidget {
|
||||||
icon: new Icon(Icons.menu, color: Colors.grey[850]),
|
icon: new Icon(Icons.menu, color: Colors.grey[850]),
|
||||||
onPressed: () => Scaffold.of(context).openDrawer(),
|
onPressed: () => Scaffold.of(context).openDrawer(),
|
||||||
)),
|
)),
|
||||||
title: Text('Ğecko', style: TextStyle(color: Colors.grey[850])),
|
title: _homeProvider.appBarTitle,
|
||||||
actions: [
|
actions: [
|
||||||
Padding(
|
Padding(
|
||||||
padding: EdgeInsets.symmetric(horizontal: 16),
|
padding: EdgeInsets.symmetric(horizontal: 16),
|
||||||
child: Icon(Icons.search, color: Colors.grey[850]),
|
child: IconButton(
|
||||||
),
|
icon: _homeProvider.searchIcon,
|
||||||
|
color: Colors.grey[850],
|
||||||
|
onPressed: () {
|
||||||
|
if (_homeProvider.searchIcon.icon == Icons.search) {
|
||||||
|
_homeProvider.searchIcon = Icon(
|
||||||
|
Icons.close,
|
||||||
|
color: Colors.grey[850],
|
||||||
|
);
|
||||||
|
TextField(
|
||||||
|
controller: _homeProvider.searchQuery,
|
||||||
|
style: new TextStyle(
|
||||||
|
color: Colors.white,
|
||||||
|
),
|
||||||
|
decoration: new InputDecoration(
|
||||||
|
prefixIcon:
|
||||||
|
new Icon(Icons.search, color: Colors.white),
|
||||||
|
hintText: "Search...",
|
||||||
|
hintStyle: new TextStyle(color: Colors.white)),
|
||||||
|
);
|
||||||
|
_homeProvider.handleSearchStart();
|
||||||
|
} else {
|
||||||
|
_homeProvider.handleSearchEnd();
|
||||||
|
}
|
||||||
|
_homeProvider.searchAction();
|
||||||
|
}))
|
||||||
],
|
],
|
||||||
backgroundColor: Color(0xffFFD58D),
|
backgroundColor: Color(0xffFFD58D),
|
||||||
),
|
),
|
||||||
|
|
|
@ -0,0 +1,152 @@
|
||||||
|
import 'package:flutter/material.dart';
|
||||||
|
|
||||||
|
class SearchList extends StatefulWidget {
|
||||||
|
SearchList({ Key key }) : super(key: key);
|
||||||
|
@override
|
||||||
|
_SearchListState createState() => new _SearchListState();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
class _SearchListState extends State<SearchList>
|
||||||
|
{
|
||||||
|
Widget appBarTitle = new Text("Search Sample", style: new TextStyle(color: Colors.white),);
|
||||||
|
Icon actionIcon = new Icon(Icons.search, color: Colors.white,);
|
||||||
|
final key = new GlobalKey<ScaffoldState>();
|
||||||
|
final TextEditingController _searchQuery = new TextEditingController();
|
||||||
|
List<String> _list;
|
||||||
|
bool _IsSearching;
|
||||||
|
String _searchText = "";
|
||||||
|
|
||||||
|
_SearchListState() {
|
||||||
|
_searchQuery.addListener(() {
|
||||||
|
if (_searchQuery.text.isEmpty) {
|
||||||
|
setState(() {
|
||||||
|
_IsSearching = false;
|
||||||
|
_searchText = "";
|
||||||
|
});
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
setState(() {
|
||||||
|
_IsSearching = true;
|
||||||
|
_searchText = _searchQuery.text;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
void initState() {
|
||||||
|
super.initState();
|
||||||
|
_IsSearching = false;
|
||||||
|
init();
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
void init() {
|
||||||
|
_list = List();
|
||||||
|
_list.add("Google");
|
||||||
|
_list.add("IOS");
|
||||||
|
_list.add("Andorid");
|
||||||
|
_list.add("Dart");
|
||||||
|
_list.add("Flutter");
|
||||||
|
_list.add("Python");
|
||||||
|
_list.add("React");
|
||||||
|
_list.add("Xamarin");
|
||||||
|
_list.add("Kotlin");
|
||||||
|
_list.add("Java");
|
||||||
|
_list.add("RxAndroid");
|
||||||
|
}
|
||||||
|
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return new Scaffold(
|
||||||
|
key: key,
|
||||||
|
appBar: buildBar(context),
|
||||||
|
body: new ListView(
|
||||||
|
padding: new EdgeInsets.symmetric(vertical: 8.0),
|
||||||
|
children: _IsSearching ? _buildSearchList() : _buildList(),
|
||||||
|
),
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
List<ChildItem> _buildList() {
|
||||||
|
return _list.map((contact) => new ChildItem(contact)).toList();
|
||||||
|
}
|
||||||
|
|
||||||
|
List<ChildItem> _buildSearchList() {
|
||||||
|
if (_searchText.isEmpty) {
|
||||||
|
return _list.map((contact) => new ChildItem(contact))
|
||||||
|
.toList();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
List<String> _searchList = List();
|
||||||
|
for (int i = 0; i < _list.length; i++) {
|
||||||
|
String name = _list.elementAt(i);
|
||||||
|
if (name.toLowerCase().contains(_searchText.toLowerCase())) {
|
||||||
|
_searchList.add(name);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return _searchList.map((contact) => new ChildItem(contact))
|
||||||
|
.toList();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Widget buildBar(BuildContext context) {
|
||||||
|
return new AppBar(
|
||||||
|
centerTitle: true,
|
||||||
|
title: appBarTitle,
|
||||||
|
actions: <Widget>[
|
||||||
|
new IconButton(icon: actionIcon, onPressed: () {
|
||||||
|
setState(() {
|
||||||
|
if (this.actionIcon.icon == Icons.search) {
|
||||||
|
this.actionIcon = new Icon(Icons.close, color: Colors.white,);
|
||||||
|
this.appBarTitle = new TextField(
|
||||||
|
controller: _searchQuery,
|
||||||
|
style: new TextStyle(
|
||||||
|
color: Colors.white,
|
||||||
|
|
||||||
|
),
|
||||||
|
decoration: new InputDecoration(
|
||||||
|
prefixIcon: new Icon(Icons.search, color: Colors.white),
|
||||||
|
hintText: "Search...",
|
||||||
|
hintStyle: new TextStyle(color: Colors.white)
|
||||||
|
),
|
||||||
|
);
|
||||||
|
_handleSearchStart();
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
_handleSearchEnd();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},),
|
||||||
|
]
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
void _handleSearchStart() {
|
||||||
|
setState(() {
|
||||||
|
_IsSearching = true;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
void _handleSearchEnd() {
|
||||||
|
setState(() {
|
||||||
|
this.actionIcon = new Icon(Icons.search, color: Colors.white,);
|
||||||
|
this.appBarTitle =
|
||||||
|
new Text("Search Sample", style: new TextStyle(color: Colors.white),);
|
||||||
|
_IsSearching = false;
|
||||||
|
_searchQuery.clear();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
class ChildItem extends StatelessWidget {
|
||||||
|
final String name;
|
||||||
|
ChildItem(this.name);
|
||||||
|
@override
|
||||||
|
Widget build(BuildContext context) {
|
||||||
|
return new ListTile(title: new Text(this.name));
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
Loading…
Reference in New Issue