[simple_browser] NavigationBar focused state color
Change-Id: Ice5ae5e8a0e9288c985d1d8f24a00d43f669ff80
diff --git a/bin/simple_browser/lib/src/widgets/navigation_bar.dart b/bin/simple_browser/lib/src/widgets/navigation_bar.dart
index 27b7733..5f10548 100644
--- a/bin/simple_browser/lib/src/widgets/navigation_bar.dart
+++ b/bin/simple_browser/lib/src/widgets/navigation_bar.dart
@@ -8,6 +8,12 @@
import '../blocs/browser_bloc.dart';
import '../models/browse_action.dart';
+const _kBackgroundColor = Colors.black;
+const _kBackgroundFocusedColor = Color(0xFFFF8BCB);
+
+const _kTextColor = Colors.white;
+const _kTextFocusedColor = Colors.black;
+
class NavigationBar extends StatefulWidget {
final BrowserBloc bloc;
@@ -18,11 +24,13 @@
}
class _NavigationBarState extends State<NavigationBar> {
+ FocusNode _focusNode;
TextEditingController _controller;
StreamSubscription _urlListener;
@override
void initState() {
+ _focusNode = FocusNode();
_controller = TextEditingController();
_urlListener = widget.bloc.url.listen((url) {
_controller.text = url;
@@ -32,6 +40,7 @@
@override
void dispose() {
+ _focusNode.dispose();
_controller.dispose();
_urlListener.cancel();
super.dispose();
@@ -39,55 +48,87 @@
@override
Widget build(BuildContext context) {
- return Padding(
- padding: EdgeInsets.all(8.0),
- child: Row(
- children: [
- Padding(
- padding: EdgeInsets.only(right: 8.0),
- child: StreamBuilder<bool>(
- stream: widget.bloc.backState,
- initialData: false,
- builder: (context, snapshot) => RaisedButton(
- padding: EdgeInsets.all(4),
- child: Text('BCK'),
- color: Colors.grey[350],
- disabledColor: Colors.grey[700],
- onPressed: snapshot.data
- ? () => widget.bloc.request.add(GoBackAction())
- : null,
- ),
+ return AnimatedBuilder(
+ animation: _focusNode,
+ builder: (_, child) {
+ final focused = _focusNode.hasFocus;
+ final textColor = focused ? _kTextFocusedColor : _kTextColor;
+ final bgColor = focused ? _kBackgroundFocusedColor : _kBackgroundColor;
+ return AnimatedTheme(
+ duration: Duration(milliseconds: 100),
+ data: ThemeData(
+ canvasColor: bgColor,
+ inputDecorationTheme: InputDecorationTheme(
+ hintStyle: TextStyle(
+ color: textColor,
),
),
- Padding(
- padding: EdgeInsets.only(right: 8.0),
- child: StreamBuilder<bool>(
- stream: widget.bloc.forwardState,
- initialData: false,
- builder: (context, snapshot) => RaisedButton(
- padding: EdgeInsets.all(4),
- child: Text('FWD'),
- color: Colors.grey[350],
- disabledColor: Colors.grey[700],
- onPressed: snapshot.data
- ? () => widget.bloc.request.add(GoForwardAction())
- : null,
- ),
+ textTheme: TextTheme(
+ subhead: TextStyle(
+ color: textColor,
),
),
- _buildNavigationField(),
- ],
- ));
+ ),
+ child: child,
+ );
+ },
+ child: Material(
+ child: Padding(
+ padding: EdgeInsets.all(8.0),
+ child: _buildWidgets(),
+ ),
+ ),
+ );
+ }
+
+ Widget _buildWidgets() {
+ return Row(
+ children: [
+ Padding(
+ padding: EdgeInsets.only(right: 8.0),
+ child: StreamBuilder<bool>(
+ stream: widget.bloc.backState,
+ initialData: false,
+ builder: (context, snapshot) => RaisedButton(
+ padding: EdgeInsets.all(4),
+ child: Text('BCK'),
+ color: Colors.grey[350],
+ disabledColor: Colors.grey[700],
+ onPressed: snapshot.data
+ ? () => widget.bloc.request.add(GoBackAction())
+ : null,
+ ),
+ ),
+ ),
+ Padding(
+ padding: EdgeInsets.only(right: 8.0),
+ child: StreamBuilder<bool>(
+ stream: widget.bloc.forwardState,
+ initialData: false,
+ builder: (context, snapshot) => RaisedButton(
+ padding: EdgeInsets.all(4),
+ child: Text('FWD'),
+ color: Colors.grey[350],
+ disabledColor: Colors.grey[700],
+ onPressed: snapshot.data
+ ? () => widget.bloc.request.add(GoForwardAction())
+ : null,
+ ),
+ ),
+ ),
+ _buildNavigationField(),
+ ],
+ );
}
Widget _buildNavigationField() {
return Expanded(
child: TextField(
+ focusNode: _focusNode,
controller: _controller,
decoration: InputDecoration(
- filled: true,
border: InputBorder.none,
- fillColor: Colors.white,
+ filled: false,
hintText: 'Enter an address...',
),
onSubmitted: (value) =>