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

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

class TFInputHaveBorder extends StatelessWidget {
  TFInputHaveBorder(
      {required this.controller, Key? key,
      this.rightSlot,
      this.label,
      this.isPwd,
      this.inputFormatters,
      this.keyboardType,
      this.background,
      this.hintText,
      this.onChangeAction,
      this.leftImg})
      : super(key: key);
  TextEditingController? controller;
  List<TextInputFormatter>? inputFormatters;
  TextInputType? keyboardType;
  Color? background;
  String? hintText;
  String? leftImg;
  String? label;
  bool? isPwd;
  Widget? rightSlot;
  Function()? onChangeAction;

  @override
  Widget build(BuildContext context) {
    return Stack(
      alignment: Alignment.centerRight,
      children: [
        TextField(
          maxLines: 1,
          keyboardType: TextInputType.text,
          // inputFormatters: inputFormatterstters??[],
          controller: controller,
          autofocus: false,
          textAlign: TextAlign.start,
          style: TextStyle(
              height: 1.1,
              fontSize: 24.sp,
              fontWeight: FontWeight.w400,
              color: const Color(0xFF333333)),
          decoration: InputDecoration(
            hintText: label,
            hintStyle: TextStyle(
                height: 1.1,
                fontSize: 24.sp,
                fontWeight: FontWeight.w400,
                color: const Color(0xFF999999)),
            // labelText:"label",
            labelStyle: const TextStyle(color: Color(0xFF999999)),
            border: const OutlineInputBorder(
              ///设置边框四个角的弧度
              borderRadius: BorderRadius.all(Radius.circular(10)),

              ///用来配置边框的样式
              borderSide: BorderSide(
                ///设置边框的颜色
                color: Color(0xffD3D3D3),

                ///设置边框的粗细
                width: 1,
              ),
            ),

            ///设置输入框可编辑时的边框样式
            enabledBorder: const OutlineInputBorder(
              ///设置边框四个角的弧度
              borderRadius: BorderRadius.all(Radius.circular(10)),

              ///用来配置边框的样式
              borderSide: BorderSide(
                ///设置边框的颜色
                color: Color(0xffD3D3D3),

                ///设置边框的粗细
                width: 1,
              ),
            ),
            disabledBorder: const OutlineInputBorder(
              ///设置边框四个角的弧度
              borderRadius: BorderRadius.all(Radius.circular(10)),

              ///用来配置边框的样式
              borderSide: BorderSide(
                ///设置边框的颜色
                color: Color(0xffD3D3D3),

                ///设置边框的粗细
                width: 1,
              ),
            ),

            ///用来配置输入框获取焦点时的颜色
            focusedBorder: const OutlineInputBorder(
              ///设置边框四个角的弧度
              borderRadius: BorderRadius.all(Radius.circular(10)),

              ///用来配置边框的样式
              borderSide: BorderSide(
                ///设置边框的颜色
                color: Color(0xffD3D3D3),

                ///设置边框的粗细
                width: 1,
              ),
            ),
          ),
          obscureText: false,
          onChanged: (String value) {
            if (onChangeAction != null) {
              onChangeAction!();
            }
          },
        ),
        rightSlot ?? const SizedBox(width: 0, height: 0)
      ],
    );
  }
}