• Chris Bracken's avatar
    Improved behaviour for text-editing widgets (#12273) · 85c425ac
    Chris Bracken authored
    This patch fixes a collection of issues with widgets involved in text
    editing:
    
      * Fire widget.onChanged on EditableText value change:
        The value of an EditableText is composed of the text value as well
        as other editing-related data such as selection-related information.
    
        Previously, widget.onChanged() was only called for updates via
        updateEditingValue(). For pastes via a TextSelectionOverlay, updates
        are signalled via _handleSelectionOverlayChanged(), which only ever
        triggered widget.onSelectionChanged(), but not widget.onChanged().
    
        Both updateEditingValue() and _handleSelectionOverlayChanged()
        perform the value update via _formatAndSetValue(), which is where
        this patch moves the widget.onChanged() call.
    
      * Correctly update TextFormField value on edits via controller:
        The textual value of a TextFormField exists in two locations:
          1. FormField.value, as with all FormFields and subclasses.
          2. TextEditingController.value associated with the TextField
             underlying the TextFormField.
    
        Previously, edits to the TextEditingController associated with a
        TextFormField resulted in updates to the rendered TextField widget,
        but did not update TextFormField.value. FormField.value is updated
        via FormField's onChanged function, which is called from the
        EditableText underlying the TextField underlying the TextFormField.
        EditableText only fires onChanged when it receives changes from the
        engine. It does not fire onChanged for changes made to the
        underlying TextController, since the owner of the TextController is
        the one making these changes and thus, already aware of them.
        FormField, however, *does* need to listen to these changes to update
        its value.
    
      * Adds an initialValue parameter to the TextFormField constructor:
        FormField's constructor already takes an initialValue parameter,
        which specifies the initial value in the field, which is also the
        value to which reset() returns the field.
    
        Previously, TextFormField took its initial value from the controller
        value (if a controller was passed in) or the empty string (if not).
        This had the undesirable effect that calling reset() always resets
        the value to the current value of the controller... i.e., does
        nothing.
    
        We now take an initial value explicitly.
    85c425ac
text_form_field.dart 5.22 KB
// Copyright 2015 The Chromium Authors. 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/services.dart';
import 'package:flutter/widgets.dart';

import 'input_decorator.dart';
import 'text_field.dart';

/// A [FormField] that contains a [TextField].
///
/// This is a convenience widget that wraps a [TextField] widget in a
/// [FormField].
///
/// A [Form] ancestor is not required. The [Form] simply makes it easier to
/// save, reset, or validate multiple fields at once. To use without a [Form],
/// pass a [GlobalKey] to the constructor and use [GlobalKey.currentState] to
/// save or reset the form field.
///
/// When a [controller] is specified, it can be used to control the text being
/// edited. Its content will be overwritten by [initialValue] (which defaults
/// to the empty string) on creation and when [reset] is called.
///
/// For a documentation about the various parameters, see [TextField].
///
/// See also:
///
///  * <https://material.google.com/components/text-fields.html>
///  * [TextField], which is the underlying text field without the [Form]
///    integration.
///  * [InputDecorator], which shows the labels and other visual elements that
///    surround the actual text editing widget.
class TextFormField extends FormField<String> {
  /// Creates a [FormField] that contains a [TextField].
  ///
  /// When a [controller] is specified, it can be used to control the text
  /// being edited. Its content will be overwritten by [initialValue] (which
  /// defaults to the empty string) on creation and when [reset] is called.
  ///
  /// For documentation about the various parameters, see the [TextField] class
  /// and [new TextField], the constructor.
  TextFormField({
    Key key,
    this.controller,
    String initialValue: '',
    FocusNode focusNode,
    InputDecoration decoration: const InputDecoration(),
    TextInputType keyboardType: TextInputType.text,
    TextStyle style,
    bool autofocus: false,
    bool obscureText: false,
    bool autocorrect: true,
    int maxLines: 1,
    FormFieldSetter<String> onSaved,
    FormFieldValidator<String> validator,
    List<TextInputFormatter> inputFormatters,
  }) : assert(initialValue != null),
       assert(keyboardType != null),
       assert(autofocus != null),
       assert(obscureText != null),
       assert(autocorrect != null),
       assert(maxLines == null || maxLines > 0),
       super(
    key: key,
    initialValue: initialValue,
    onSaved: onSaved,
    validator: validator,
    builder: (FormFieldState<String> field) {
      final _TextFormFieldState state = field;
      return new TextField(
        controller: state._effectiveController,
        focusNode: focusNode,
        decoration: decoration.copyWith(errorText: field.errorText),
        keyboardType: keyboardType,
        style: style,
        autofocus: autofocus,
        obscureText: obscureText,
        autocorrect: autocorrect,
        maxLines: maxLines,
        onChanged: field.onChanged,
        inputFormatters: inputFormatters,
      );
    },
  );

  /// Controls the text being edited.
  ///
  /// If null, this widget will create its own [TextEditingController].
  final TextEditingController controller;

  @override
  _TextFormFieldState createState() => new _TextFormFieldState();
}

class _TextFormFieldState extends FormFieldState<String> {
  TextEditingController _controller;

  TextEditingController get _effectiveController => widget.controller ?? _controller;

  @override
  TextFormField get widget => super.widget;

  @override
  void initState() {
    super.initState();
    if (widget.controller == null) {
      _controller = new TextEditingController(text: widget.initialValue);
    } else {
      widget.controller.text = widget.initialValue;
      widget.controller.addListener(_handleControllerChanged);
    }
  }

  @override
  void didUpdateWidget(TextFormField oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (widget.controller != oldWidget.controller) {
      oldWidget.controller?.removeListener(_handleControllerChanged);
      widget.controller?.addListener(_handleControllerChanged);

      if (oldWidget.controller != null && widget.controller == null)
        _controller = new TextEditingController.fromValue(oldWidget.controller.value);
      if (widget.controller != null) {
        setValue(widget.controller.text);
        if (oldWidget.controller == null)
          _controller = null;
      }
    }
  }

  @override
  void dispose() {
    widget.controller?.removeListener(_handleControllerChanged);
    super.dispose();
  }

  @override
  void reset() {
    super.reset();
    setState(() {
      _effectiveController.text = widget.initialValue;
    });
  }

  void _handleControllerChanged() {
    // Suppress changes that originated from within this class.
    //
    // In the case where a controller has been passed in to this widget, we
    // register this change listener. In these cases, we'll also receive change
    // notifications for changes originating from within this class -- for
    // example, the reset() method. In such cases, the FormField value will
    // already have been set.
    if (_effectiveController.text != value)
      onChanged(_effectiveController.text);
  }
}