mirror of
https://github.com/flutter/samples.git
synced 2025-11-08 13:58:47 +00:00
Adds search screen to veggieseasons. (#17)
This commit is contained in:
@@ -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<SearchScreen> {
|
||||
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<Widget> _generateVeggieRows(List<Veggie> veggies) {
|
||||
final cards = new List<Widget>();
|
||||
|
||||
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<AppState>(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)),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
58
veggieseasons/lib/widgets/search_bar.dart
Normal file
58
veggieseasons/lib/widgets/search_bar.dart
Normal file
@@ -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,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user