app-starlock/lib/tools/tf_loginInput.dart

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:star_lock/app_settings/app_colors.dart';
import 'package:star_lock/flavors.dart';

/*
* 登录注册页面 input
* */

typedef BlockStrCallback = void Function(dynamic textStr);
typedef BlockClickCallback = void Function();

class LoginInput extends StatefulWidget {
  TextEditingController? controller;
  List<TextInputFormatter>? inputFormatters;
  TextInputType? keyboardType;
  FocusNode? focusNode;
  Color? background;
  String? hintText;
  bool? isHaveLeftWidget;
  Widget? leftWidget;
  String? label;
  bool? isPwd;
  bool? isSuffixIcon;
  Widget? rightSlot;
  BlockStrCallback? onchangeAction;
  BlockStrCallback? onSubmitted;
  BlockClickCallback? onTapAction;
  bool? isLogin;// 是否是登录之前，因为登录之前的密码框文字显示缩在左上角 默认是false

  LoginInput({
    Key? key,
    required this.controller,
    this.rightSlot,
    this.focusNode,
    this.label,
    this.isPwd,
    this.isSuffixIcon,
    this.inputFormatters,
    this.keyboardType,
    this.background,
    this.hintText,
    this.isHaveLeftWidget = true,
    this.leftWidget,
    this.onchangeAction,
    this.onTapAction,
    this.onSubmitted,
    this.isLogin = false,
  }) : super(key: key);

  @override
  State<LoginInput> createState() => _LoginInputState();
}

class _LoginInputState extends State<LoginInput> {
  @override
  Widget build(BuildContext context) {
    return GetPlatform.isAndroid ? androidView() : iosView();
  }

  Widget androidView() {
    bool isPwd = widget.isPwd ?? false;
    String pwd = (widget.controller?.text ?? '').replaceAll(RegExp(r'.'), '●');
    return Container(
      decoration: BoxDecoration(
        border: Border(bottom: BorderSide(width: 0.5.h, color: Colors.grey)),
      ),
      child: Row(
        children: <Widget>[
          if (widget.isHaveLeftWidget == true)
            widget.leftWidget ?? const SizedBox()
          else
            SizedBox(
              width: 20.w,
              height: 40.w,
            ),
          Expanded(
            child: Stack(
              children: [
                TextField(
                  //输入框一行
                  maxLines: 1,
                  controller: widget.controller,
                  focusNode: widget.focusNode,
                  onChanged: (String text) {
                    if (widget.onchangeAction != null) {
                      widget.onchangeAction!(text);
                    }
                    setState(() {});
                  },
                  onTap: widget.onTapAction,
                  autofocus: false,
                  inputFormatters: widget.inputFormatters,
                  textInputAction: TextInputAction.next,
                  keyboardType: isPwd ? TextInputType.emailAddress : null,
                  style: isPwd
                      ? TextStyle(
                          fontSize: 22.sp,
                          color: Colors.transparent,
                          letterSpacing: 2.5,
                          fontFamily: 'Monospace',
                        )
                      : null,
                  decoration: InputDecoration(
                    //输入里面输入文字内边距设置
                    contentPadding: const EdgeInsets.only(
                        top: 8.0, right: -10.0, bottom: 8.0),
                    labelText: widget.label,
                    labelStyle: TextStyle(
                        fontSize: 22.sp, color: AppColors.darkGrayTextColor),
                    hintStyle: TextStyle(fontSize: 22.sp),
                    hintText: widget.hintText,
                    //不需要输入框下划线
                    border: InputBorder.none,
                    suffixIcon: (widget.isSuffixIcon ?? false)
                        ? IconButton(
                            icon: const Icon(Icons.clear),
                            onPressed: widget.controller!.clear,
                          )
                        : null,
                  ),
                ),
                if (isPwd)
                  Padding(
                    padding: EdgeInsets.only(
                        top: F.sw(skyCall: () => 27.h, xhjCall: () => widget.isLogin! ? 27.h : 39.h)),
                    child: Text(
                      pwd,
                      style: TextStyle(
                        fontSize: 22.sp,
                        color: AppColors.darkGrayTextColor,
                        letterSpacing: 2.0,
                        fontFamily: 'Monospace',
                      ),
                    ),
                  ),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget iosView() {
    return Column(
      children: [
        TextField(
          //输入框一行
          maxLines: 1,
          controller: widget.controller,
          focusNode: widget.focusNode,
          onChanged: widget.onchangeAction,
          onTap: widget.onTapAction,
          autofocus: false,
          inputFormatters: widget.inputFormatters,
          textInputAction: TextInputAction.next,
          decoration: InputDecoration(
            //输入里面输入文字内边距设置
            contentPadding: const EdgeInsets.only(
                top: 8.0, left: -10.0, right: -10.0, bottom: 8.0),
            labelText: widget.label,
            labelStyle:
                TextStyle(fontSize: 22.sp, color: AppColors.darkGrayTextColor),
            hintStyle: TextStyle(fontSize: 22.sp),
            hintText: widget.hintText,
            //不需要输入框下划线
            border: InputBorder.none,
            suffixIcon: (widget.isSuffixIcon ?? false)
                ? IconButton(
                    icon: const Icon(Icons.clear),
                    onPressed: widget.controller!.clear,
                  )
                : null,
            //左边图标设置
            icon: widget.isHaveLeftWidget == true
                ? widget.leftWidget
                : SizedBox(
                    width: 20.w,
                    height: 40.w,
                  ),
          ),
          obscureText: widget.isPwd ?? false,
        ),
        Container(
          height: 0.5.h,
          color: Colors.grey,
        ),
      ],
    );
  }
}