diff --git a/veggieseasons/lib/screens/search.dart b/veggieseasons/lib/screens/search.dart index 64c78a571..5860cd65a 100644 --- a/veggieseasons/lib/screens/search.dart +++ b/veggieseasons/lib/screens/search.dart @@ -4,19 +4,86 @@ import 'package:flutter/cupertino.dart'; import 'package:flutter/widgets.dart'; +import 'package:scoped_model/scoped_model.dart'; +import 'package:veggieseasons/data/model.dart'; +import 'package:veggieseasons/data/veggie.dart'; import 'package:veggieseasons/styles.dart'; +import 'package:veggieseasons/widgets/search_bar.dart'; +import 'package:veggieseasons/widgets/veggie_headline.dart'; -class SearchScreen extends StatelessWidget { +class SearchScreen extends StatefulWidget { @override - Widget build(BuildContext context) { - return CupertinoPageScaffold( - navigationBar: CupertinoNavigationBar( - middle: Text('Search'), - ), - backgroundColor: Styles.scaffoldBackground, - child: Center( - child: Text('Not yet implemented.'), + _SearchScreenState createState() => _SearchScreenState(); +} + +class _SearchScreenState extends State { + final _controller = TextEditingController(); + final _focusNode = FocusNode(); + String _terms = ''; + + @override + void initState() { + super.initState(); + _controller.addListener(_onTextChanged); + } + + @override + void dispose() { + _focusNode.dispose(); + super.dispose(); + } + + void _onTextChanged() { + setState(() => _terms = _controller.text); + } + + Widget _createSearchBox() { + return Padding( + padding: const EdgeInsets.all(8.0), + child: SearchBar( + controller: _controller, + focusNode: _focusNode, ), ); } + + List _generateVeggieRows(List veggies) { + final cards = new List(); + + for (Veggie veggie in veggies) { + cards.add(Padding( + padding: EdgeInsets.only(left: 16.0, right: 16.0, bottom: 24.0), + child: VeggieHeadline(veggie), + )); + } + + return cards; + } + + @override + Widget build(BuildContext context) { + final model = ScopedModel.of(context, rebuildOnChange: true); + + return CupertinoTabView( + builder: (context) { + return DecoratedBox( + decoration: BoxDecoration( + color: Styles.scaffoldBackground, + ), + child: SafeArea( + child: Column( + children: [ + _createSearchBox(), + Expanded( + child: ListView( + children: _generateVeggieRows(model.searchVeggies(_terms)), + ), + ), + ], + ), + ), + ); + }, + ); + } } diff --git a/veggieseasons/lib/widgets/search_bar.dart b/veggieseasons/lib/widgets/search_bar.dart new file mode 100644 index 000000000..5eebe6d57 --- /dev/null +++ b/veggieseasons/lib/widgets/search_bar.dart @@ -0,0 +1,58 @@ +// Copyright 2018 The Flutter team. All rights reserved. +// Use of this source code is governed by a BSD-style license that can be +// found in the LICENSE file. + +import 'package:flutter/cupertino.dart'; +import 'package:flutter/widgets.dart'; +import 'package:veggieseasons/styles.dart'; + +class SearchBar extends StatelessWidget { + final TextEditingController controller; + final FocusNode focusNode; + + SearchBar({ + @required this.controller, + @required this.focusNode, + }); + + @override + Widget build(BuildContext context) { + return DecoratedBox( + decoration: BoxDecoration( + color: Styles.searchBackground, + borderRadius: BorderRadius.circular(10.0), + ), + child: Padding( + padding: const EdgeInsets.symmetric( + horizontal: 4.0, + vertical: 8.0, + ), + child: Row( + children: [ + Icon( + CupertinoIcons.search, + color: Styles.searchIconColor, + ), + Expanded( + child: EditableText( + controller: controller, + focusNode: focusNode, + style: Styles.searchText, + cursorColor: Styles.searchCursorColor, + ), + ), + GestureDetector( + onTap: () { + controller.clear(); + }, + child: Icon( + CupertinoIcons.clear_thick_circled, + color: Styles.searchIconColor, + ), + ), + ], + ), + ), + ); + } +}