diff --git a/packages/flutter/lib/src/fn3.dart b/packages/flutter/lib/src/fn3.dart index d6a14431be..b844d9f170 100644 --- a/packages/flutter/lib/src/fn3.dart +++ b/packages/flutter/lib/src/fn3.dart @@ -18,6 +18,7 @@ export 'fn3/drawer.dart'; export 'fn3/drawer_divider.dart'; export 'fn3/drawer_header.dart'; export 'fn3/drawer_item.dart'; +export 'fn3/editable_text.dart'; export 'fn3/flat_button.dart'; export 'fn3/floating_action_button.dart'; export 'fn3/focus.dart'; @@ -27,6 +28,7 @@ export 'fn3/homogeneous_viewport.dart'; export 'fn3/icon.dart'; export 'fn3/icon_button.dart'; export 'fn3/ink_well.dart'; +export 'fn3/input.dart'; export 'fn3/material.dart'; export 'fn3/material_button.dart'; export 'fn3/mixed_viewport.dart'; diff --git a/packages/flutter/lib/src/fn3/editable_text.dart b/packages/flutter/lib/src/fn3/editable_text.dart index 8b3ff14e86..ed5d57390f 100644 --- a/packages/flutter/lib/src/fn3/editable_text.dart +++ b/packages/flutter/lib/src/fn3/editable_text.dart @@ -7,8 +7,8 @@ import 'dart:sky' as sky; import 'package:mojo_services/keyboard/keyboard.mojom.dart'; import 'package:sky/painting.dart'; -import 'package:sky/src/widgets/basic.dart'; -import 'package:sky/src/widgets/framework.dart'; +import 'package:sky/src/fn3/basic.dart'; +import 'package:sky/src/fn3/framework.dart'; const _kCursorBlinkPeriod = 500; // milliseconds const _kCursorGap = 1.0; @@ -133,7 +133,6 @@ class EditableString implements KeyboardClient { } class EditableText extends StatefulComponent { - EditableText({ Key key, this.value, @@ -141,18 +140,15 @@ class EditableText extends StatefulComponent { this.style, this.cursorColor}) : super(key: key); - EditableString value; - bool focused; - TextStyle style; - Color cursorColor; + final EditableString value; + final bool focused; + final TextStyle style; + final Color cursorColor; - void syncConstructorArguments(EditableText source) { - value = source.value; - focused = source.focused; - style = source.style; - cursorColor = source.cursorColor; - } + EditableTextState createState() => new EditableTextState(); +} +class EditableTextState extends State { Timer _cursorTimer; bool _showCursor = false; @@ -175,10 +171,10 @@ class EditableText extends StatefulComponent { new Duration(milliseconds: _kCursorBlinkPeriod), _cursorTick); } - void didUnmount() { + void dispose() { if (_cursorTimer != null) _stopCursorTimer(); - super.didUnmount(); + super.dispose(); } void _stopCursorTimer() { @@ -191,26 +187,29 @@ class EditableText extends StatefulComponent { if (!_showCursor) return; - double cursorHeight = style.fontSize + 2.0 * _kCursorHeightOffset; + double cursorHeight = config.style.fontSize + 2.0 * _kCursorHeightOffset; Rect cursorRect = new Rect.fromLTWH( _kCursorGap, (size.height - cursorHeight) / 2.0, _kCursorWidth, cursorHeight ); - canvas.drawRect(cursorRect, new Paint()..color = cursorColor); + canvas.drawRect(cursorRect, new Paint()..color = config.cursorColor); } - Widget build() { - assert(style != null); - assert(focused != null); - assert(cursorColor != null); + Widget build(BuildContext context) { + assert(config.style != null); + assert(config.focused != null); + assert(config.cursorColor != null); - if (focused && _cursorTimer == null) + if (config.focused && _cursorTimer == null) _startCursorTimer(); - else if (!focused && _cursorTimer != null) + else if (!config.focused && _cursorTimer != null) _stopCursorTimer(); + final EditableString value = config.value; + final TextStyle style = config.style; + Widget text; if (value.composing.isValid) { TextStyle composingStyle = style.merge(const TextStyle(decoration: underline)); diff --git a/packages/flutter/lib/src/fn3/input.dart b/packages/flutter/lib/src/fn3/input.dart index 67d4581d1a..05fe77ec72 100644 --- a/packages/flutter/lib/src/fn3/input.dart +++ b/packages/flutter/lib/src/fn3/input.dart @@ -4,11 +4,11 @@ import 'package:sky/services.dart'; import 'package:sky/painting.dart'; -import 'package:sky/src/widgets/basic.dart'; -import 'package:sky/src/widgets/editable_text.dart'; -import 'package:sky/src/widgets/focus.dart'; -import 'package:sky/src/widgets/framework.dart'; -import 'package:sky/src/widgets/theme.dart'; +import 'package:sky/src/fn3/basic.dart'; +import 'package:sky/src/fn3/editable_text.dart'; +import 'package:sky/src/fn3/focus.dart'; +import 'package:sky/src/fn3/framework.dart'; +import 'package:sky/src/fn3/theme.dart'; export 'package:sky/services.dart' show KeyboardType; @@ -19,35 +19,34 @@ typedef void StringValueChanged(String value); const EdgeDims _kTextfieldPadding = const EdgeDims.symmetric(vertical: 8.0); class Input extends StatefulComponent { - Input({ GlobalKey key, - String initialValue: '', + this.initialValue: '', this.placeholder, this.onChanged, - this.keyboardType : KeyboardType.TEXT - }): _value = initialValue, super(key: key); + this.keyboardType: KeyboardType.TEXT + }): super(key: key); - KeyboardType keyboardType; - String placeholder; - StringValueChanged onChanged; + final String initialValue; + final KeyboardType keyboardType; + final String placeholder; + final StringValueChanged onChanged; + InputState createState() => new InputState(); +} + +class InputState extends State { String _value; EditableString _editableValue; KeyboardHandle _keyboardHandle = KeyboardHandle.unattached; - void initState() { + void initState(BuildContext context) { + super.initState(context); + _value = config.initialValue; _editableValue = new EditableString( text: _value, onUpdated: _handleTextUpdated ); - super.initState(); - } - - void syncConstructorArguments(Input source) { - placeholder = source.placeholder; - onChanged = source.onChanged; - keyboardType = source.keyboardType; } void _handleTextUpdated() { @@ -55,17 +54,17 @@ class Input extends StatefulComponent { setState(() { _value = _editableValue.text; }); - if (onChanged != null) - onChanged(_value); + if (config.onChanged != null) + config.onChanged(_value); } } - Widget build() { - ThemeData themeData = Theme.of(this); - bool focused = Focus.at(this); + Widget build(BuildContext context) { + ThemeData themeData = Theme.of(context); + bool focused = FocusState.at(context, config); if (focused && !_keyboardHandle.attached) { - _keyboardHandle = keyboard.show(_editableValue.stub, keyboardType); + _keyboardHandle = keyboard.show(_editableValue.stub, config.keyboardType); } else if (!focused && _keyboardHandle.attached) { _keyboardHandle.release(); } @@ -73,10 +72,10 @@ class Input extends StatefulComponent { TextStyle textStyle = themeData.text.subhead; List textChildren = []; - if (placeholder != null && _value.isEmpty) { + if (config.placeholder != null && _value.isEmpty) { Widget child = new Opacity( key: const ValueKey('placeholder'), - child: new Text(placeholder, style: textStyle), + child: new Text(config.placeholder, style: textStyle), opacity: themeData.hintOpacity ); textChildren.add(child); @@ -109,23 +108,21 @@ class Input extends StatefulComponent { return new Listener( child: input, - onPointerDown: focus + onPointerDown: (_) { + if (FocusState.at(context, config)) { + assert(_keyboardHandle.attached); + _keyboardHandle.showByRequest(); + } else { + FocusState.moveTo(context, config); + // we'll get told to rebuild and we'll take care of the keyboard then + } + } ); } - void focus(_) { - if (Focus.at(this)) { - assert(_keyboardHandle.attached); - _keyboardHandle.showByRequest(); - } else { - Focus.moveTo(this); - // we'll get told to rebuild and we'll take care of the keyboard then - } - } - - void didUnmount() { + void dispose() { if (_keyboardHandle.attached) _keyboardHandle.release(); - super.didUnmount(); + super.dispose(); } }