Flutter右侧输入框自定义封装

Flutter自带的TextField组件，在设置为右对齐时，在文本右侧输入空格，会不显示，再次输入其他字符时会突然跳出之前输入的空格，操作体验较差，因此选择自定义封装一个右侧输入框。

以下是本人自定义封装的右侧输入框，后续会继续完善该封装。2024/02/26

更新一版优化后的代码。2024/02/29

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

import '../res/styles.dart';

class RightEditTextFieldWidget extends StatefulWidget {
  RightEditTextFieldWidget(
      {Key key,
      @required this.textFieldName,
      @required this.hintText,
      @required this.maxLength,
      @required this.alignWidth,
      @required this.isPassword,
      @required this.controller,
      this.inputFormatters})
      : super(key: key);

  String textFieldName;
  String hintText;
  int maxLength;
  double alignWidth;
  List<TextInputFormatter> inputFormatters;
  bool isPassword;
  TextEditingController controller;

  @override
  _RightEditTextFieldWidgetState createState() =>
      _RightEditTextFieldWidgetState(textFieldName, hintText, maxLength,
          inputFormatters, alignWidth, isPassword, controller);
}

class _RightEditTextFieldWidgetState extends State<RightEditTextFieldWidget> {
  // 外部变量
  String _textfieldName;
  String _hintText;
  int _maxLength;
  List<TextInputFormatter> _inputFormatters;
  double _alignWidth;
  bool _isPassword;
  bool _isTextVisable;
  TextEditingController _controller;

  // 内部变量
  FocusNode _focusNode;
  String _index;
  String _hintTextCopy;

  _RightEditTextFieldWidgetState(
      this._textfieldName,
      this._hintText,
      this._maxLength,
      this._inputFormatters,
      this._alignWidth,
      this._isPassword,
      this._controller);

  @override
  void initState() {
    super.initState();
    _hintTextCopy = _hintText;
    _isTextVisable = !_isPassword;
    _focusNode = FocusNode();
    // _controller = TextEditingController();
  }

  @override
  void dispose() {
    _focusNode.dispose();
    // _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return
        // GestureDetector(
        // // 点击聚焦到Textfield
        // onTap: () {
        //   FocusScope.of(context).requestFocus(_focusNode);
        //   SystemChannels.textInput.invokeMethod<void>('TextInput.show');
        // },
        // // child: Container(
        // //   alignment: Alignment.center,
        // //   // width: double.infinity,
        // //   // height: double.infinity,
        // child:
        Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        SizedBox(width: _alignWidth),
        Text(
          _textfieldName,
          style: TextStyles.text_b3_16,
        ),
        Expanded(
          child: GestureDetector(
            onTap: () {
              FocusScope.of(context).requestFocus(_focusNode);
              SystemChannels.textInput.invokeMethod<void>('TextInput.show');
            },
            child: Stack(
              alignment: Alignment.centerRight,
              children: <Widget>[
                Container(
                  // color: Colors.red,
                  // height: double.infinity,
                  // width: double.infinity,
                  child: Text(_hintText,
                      style: TextStyles.text_66_16,
                      // textDirection: TextDirection(
                      //   c
                      // )
                  ),
                ),
                IntrinsicWidth(
                  child: TextField(
                    style: TextStyles.text_b3_16,
                    focusNode: _focusNode,
                    // controller: _controller,
                    maxLength: _maxLength,
                    inputFormatters: _inputFormatters,
                    maxLines: 1,
                    readOnly: false,
                    autofocus: false,
                    obscureText: _isTextVisable,
                    decoration: InputDecoration(
                      // hintText: _hintText,
                      // hintStyle: TextStyles.text_66_16,
                      border: OutlineInputBorder(
                          // borderSide: BorderSide.none
                          ),
                      counterText: "",
                      contentPadding: EdgeInsets.all(0),
                    ),
                    onChanged: (v) {
                      setState(() {
                        _index = v;
                        if (v != null && v != "") {
                          _hintText = "";
                        } else {
                          _hintText = _hintTextCopy;
                        }
                      });
                    },
                  ),
                ),
              ],
            ),
          ),
        ),
        // Visibility(
        //     visible: _isPassword,
        //     child: SizedBox(
        //       width: 4,
        //     )),
        Visibility(
          visible: _isPassword,
          child: GestureDetector(
            onTap: () {
              setState(() {
                _isTextVisable = !_isTextVisable;
              });
            },
            child: Container(
                width: 24,
                height: 24,
                child: Image.asset(
                    _isTextVisable
                        ? "assets/images/comm/admin_pwd_no_see.png"
                        : "assets/images/comm/admin_pwd_see.png",
                    fit: BoxFit.fill)),
          ),
        ),
        SizedBox(width: _alignWidth),
      ],
    )
        // )
        ;
  }

  @override
  void didUpdateWidget(Widget oldWidget) {
    print("didUpdateWidget");
  }
}