aman-satu-flutter/lib/widgets/fields/input_field.dart

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:satu/shared/app_colors.dart';
import 'package:satu/shared/shared_styles.dart';
import 'package:satu/shared/ui_helpers.dart';

import 'note_text.dart';

class InputField extends StatefulWidget {

  InputField(
      {required this.controller,
      this.placeholder,
      this.enterPressed,
      this.fieldFocusNode,
      this.nextFocusNode,
      this.additionalNote,
      this.onChanged,
      this.suffixText,
      this.formatter,
      this.initialValue,
      this.validationMessage,
      this.textInputAction = TextInputAction.next,
      this.textInputType = TextInputType.text,
      this.password = false,
      this.search = false,
      this.isReadOnly = false,
      this.multiline = false,
      this.smallVersion = false,
      this.labelText});
  final TextEditingController controller;
  final TextInputType textInputType;
  final bool password;
  final bool search;
  final bool isReadOnly;
  final String? placeholder;
  final String? validationMessage;
  final Function? enterPressed;
  final bool smallVersion;
  final FocusNode? fieldFocusNode;
  final FocusNode? nextFocusNode;
  final TextInputAction textInputAction;
  final bool multiline;
  final String? additionalNote;
  final Function(String)? onChanged;
  final TextInputFormatter? formatter;
  final String? initialValue;
  final String? labelText;
  final String? suffixText;

  @override
  _InputFieldState createState() => _InputFieldState();
}

class _InputFieldState extends State<InputField> {
  late bool isPassword;
  late bool isSearch;
  double fieldHeight = 40;

  @override
  void initState() {
    super.initState();
    isPassword = widget.password;
    isSearch = widget.search;
    if (widget.search == true) {
      widget.fieldFocusNode!.addListener(() {
        if (widget.fieldFocusNode!.hasFocus) {
          setState(() {
            isSearch = !isSearch;
          });
        }
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        if (widget.labelText != null)
          Padding(
            padding:
                const EdgeInsets.symmetric(horizontal: 14.0, vertical: 5.0),
            child: NoteText(widget.labelText ?? ''),
          ),
        Container(
          //height: widget.smallVersion ? 40 : fieldHeight,
          constraints: BoxConstraints(
              minHeight: widget.smallVersion ? 40.h : fieldHeight),
          alignment: Alignment.centerLeft,
          padding: fieldPadding,
          decoration:
              widget.isReadOnly ? disabledFieldDecoration : fieldDecoration,
          child: Row(
            children: <Widget>[
              GestureDetector(
                onTap: () {
                  if (isSearch) {
                    widget.fieldFocusNode!.requestFocus();
                  } else {
                    setState(() {
                      isSearch = !isSearch;
                    });
                    FocusScope.of(context)
                        .requestFocus(FocusNode()); //remove focus
                    WidgetsBinding.instance.addPostFrameCallback(
                        (_) => widget.controller.clear()); // clear content
                  }
                },
                child: widget.search
                    ? Container(
                        width: fieldHeight,
                        height: fieldHeight,
                        alignment: Alignment.center,
                        child: Icon(isSearch ? Icons.search : Icons.search_off,
                            color: placeholderColor))
                    : Container(),
              ),
              Expanded(
                child: TextFormField(
                  style: TextStyle(
                      color: textColor,
                      fontSize: widget.smallVersion ? 12 : 14),
                  controller: widget.controller,
                  keyboardType: widget.textInputType,
                  focusNode: widget.fieldFocusNode,
                  textInputAction: widget.textInputAction,
                  maxLines: widget.multiline ? null : 1,
                  onChanged: widget.onChanged,
                  initialValue: widget.initialValue,
                  inputFormatters:
                      widget.formatter != null ? [widget.formatter!] : null,
                  onEditingComplete: () {
                    if (widget.enterPressed != null) {
                      FocusScope.of(context).requestFocus(FocusNode());
                      widget.enterPressed!();
                    }
                  },
                  onFieldSubmitted: (value) {
                    if (widget.nextFocusNode != null) {
                      widget.nextFocusNode!.requestFocus();
                    }
                  },
                  obscureText: isPassword,
                  readOnly: widget.isReadOnly,
                  decoration: InputDecoration(
                      hintText: widget.placeholder,
                      filled: true,
                      suffixText: widget.suffixText,
                      suffixStyle: const TextStyle(color: textColor),
                      fillColor: widget.isReadOnly ? disableColor : whiteColor,
                      border: InputBorder.none,
                      hintStyle: TextStyle(
                          fontSize: widget.smallVersion
                              ? ScreenUtil().setSp(12)
                              : ScreenUtil().setSp(14),
                          color: placeholderColor)),
                ),
              ),
              GestureDetector(
                onTap: () => setState(() {
                  isPassword = !isPassword;
                }),
                child: widget.password
                    ? Container(
                        width: fieldHeight,
                        height: fieldHeight,
                        alignment: Alignment.center,
                        child: Icon(
                            isPassword
                                ? Icons.visibility
                                : Icons.visibility_off,
                            color: textColor))
                    : Container(),
              ),
            ],
          ),
        ),
        if (widget.validationMessage != null)
          NoteText(
            widget.validationMessage ?? '',
            color: dangerColor,
          ),
        if (widget.additionalNote != null) verticalSpace(5),
        if (widget.additionalNote != null)
          NoteText(widget.additionalNote ?? ''),
        verticalSpaceSmall
      ],
    );
  }
}