| OLD | NEW |
|---|
| (Empty) |
| 1 // Copyright 2015 The Chromium Authors. All rights reserved. | |
| 2 // Use of this source code is governed by a BSD-style license that can be | |
| 3 // found in the LICENSE file. | |
| 4 | |
| 5 import '../editing/editable_string.dart'; | |
| 6 import '../editing/editable_text.dart'; | |
| 7 import '../editing/keyboard.dart'; | |
| 8 import '../fn.dart'; | |
| 9 import '../layout.dart'; | |
| 10 import '../theme/colors.dart'; | |
| 11 import '../theme/typography.dart' as typography; | |
| 12 import 'dart:sky' as sky; | |
| 13 | |
| 14 typedef void ValueChanged(value); | |
| 15 | |
| 16 class Input extends Component { | |
| 17 static final Style _style = new Style(''' | |
| 18 transform: translateX(0); | |
| 19 margin: 8px; | |
| 20 padding: 8px; | |
| 21 border-bottom: 1px solid ${Grey[200]}; | |
| 22 align-self: center; | |
| 23 height: 1.2em; | |
| 24 white-space: pre; | |
| 25 overflow: hidden;''' | |
| 26 ); | |
| 27 | |
| 28 static final Style _placeholderStyle = new Style(''' | |
| 29 top: 8px; | |
| 30 left: 8px; | |
| 31 position: absolute; | |
| 32 ${typography.black.caption};''' | |
| 33 ); | |
| 34 | |
| 35 static final String _focusedInlineStyle = ''' | |
| 36 padding: 7px; | |
| 37 border-bottom: 2px solid ${Blue[500]};'''; | |
| 38 | |
| 39 ValueChanged onChanged; | |
| 40 String placeholder; | |
| 41 bool focused = false; | |
| 42 | |
| 43 String _value = ''; | |
| 44 bool _isAttachedToKeyboard = false; | |
| 45 EditableString _editableValue; | |
| 46 | |
| 47 Input({Object key, | |
| 48 this.placeholder, | |
| 49 this.onChanged, | |
| 50 this.focused}) | |
| 51 : super(key: key, stateful: true) { | |
| 52 _editableValue = new EditableString(text: _value, | |
| 53 onUpdated: _handleTextUpdated); | |
| 54 onDidUnmount(() { | |
| 55 if (_isAttachedToKeyboard) | |
| 56 keyboard.hide(); | |
| 57 }); | |
| 58 } | |
| 59 | |
| 60 void _handleTextUpdated() { | |
| 61 scheduleBuild(); | |
| 62 if (_value != _editableValue.text) { | |
| 63 _value = _editableValue.text; | |
| 64 if (onChanged != null) | |
| 65 onChanged(_value); | |
| 66 } | |
| 67 } | |
| 68 | |
| 69 UINode build() { | |
| 70 if (focused && !_isAttachedToKeyboard) { | |
| 71 keyboard.show(_editableValue.stub); | |
| 72 _isAttachedToKeyboard = true; | |
| 73 } | |
| 74 | |
| 75 List<UINode> children = []; | |
| 76 | |
| 77 if (placeholder != null && _value.isEmpty) { | |
| 78 children.add(new Container( | |
| 79 style: _placeholderStyle, | |
| 80 children: [new Text(placeholder)] | |
| 81 )); | |
| 82 } | |
| 83 | |
| 84 children.add(new EditableText(value: _editableValue, focused: focused)); | |
| 85 | |
| 86 return new EventListenerNode( | |
| 87 new FlexContainer( | |
| 88 direction: FlexDirection.Column, | |
| 89 style: _style, | |
| 90 inlineStyle: focused ? _focusedInlineStyle : null, | |
| 91 children: children | |
| 92 ), | |
| 93 onPointerDown: (sky.Event e) => keyboard.showByRequest() | |
| 94 ); | |
| 95 } | |
| 96 } | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1132063007:
Rationalize Dart mojo and sky package structure (Closed)
Base URL: https://github.com/domokit/mojo.git@master