当输入内容报错后 TextFiled会自动展示红字报错,但是红字出来时会撑一下布局,修改方法TextFiled增加 errorText: “”,这里的意思是errorText提前占位,只不过内容是空字符,但是写上errorText时会发现红字时底线也变红,不想边线变红可以如下修改方法
focusedErrorBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: primaryColor,
width: 2,
),
borderRadius: BorderRadius.circular(2)),
errorBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: lineColor,
width: 2,
),
borderRadius: BorderRadius.circular(2)),
完整代码
typedef void OnValueChanged(String value);
typedef void VisibleClick();
class LoginTextFiled extends StatelessWidget {
final bool pswVisible;
final VisibleClick visibleClick;
final String hintText;
final TextEditingController controller;
final OnValueChanged onValueChanged;
final FocusNode focusNode;
final ShakeAnimationController animationController;
final Function onClear;
final TextInputAction textInputAction;
final TextInputType textInputType;
final bool isVisibleSuffixText;
final String leftText;
final bool isPhoneNumber;
final FormFieldValidator<String> validator;
final ValueChanged<String> onFieldSubmitted;
const LoginTextFiled(
{Key key,
this.controller,
this.onValueChanged,
this.pswVisible = true,
this.visibleClick,
this.hintText,
this.animationController,
this.focusNode,
this.onClear,
this.textInputAction,
this.textInputType,
this.isVisibleSuffixText = false,
this.leftText,
this.isPhoneNumber = false,
this.validator,
this.onFieldSubmitted})
: super(key: key);
@override
Widget build(BuildContext context) {
return Container(
child: ShakeAnimation(
TextFormField(
onFieldSubmitted: onFieldSubmitted,
validator: validator,
autovalidateMode: AutovalidateMode.onUserInteraction,
style: t14blackblod,
textInputAction: textInputAction,
keyboardType: isPhoneNumber
? TextInputType.number
: TextInputType.visiblePassword,
obscureText: pswVisible,
inputFormatters: isPhoneNumber
? [
LengthLimitingTextInputFormatter(11),
FilteringTextInputFormatter.allow(RegExp('[0-9]'))
]
: [
LengthLimitingTextInputFormatter(20),
],
controller: controller,
focusNode: focusNode ?? FocusNode(),
onChanged: (text) {
if (onValueChanged != null) {
onValueChanged(text);
}
},
decoration: InputDecoration(
prefixIcon: Visibility(
visible: isVisibleSuffixText,
child: Padding(
padding: EdgeInsets.only(right: 10, bottom: 3),
child: Text(
leftText ?? "",
style: t14blackSemiblod,
))),
prefixIconConstraints: BoxConstraints(),
suffixIcon: Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
controller.text == null || controller.text == ''
? Container()
: GestureDetector(
child: Container(
child: Image.asset(
'assets/images/clear_icon.png',
width: 14,
height: 14,
),
),
onTap: () {
controller.text = '';
onClear();
},
),
Visibility(
visible: !isPhoneNumber,
child: SizedBox(
width: 10,
)),
Visibility(
visible: !isPhoneNumber,
child: GestureDetector(
child: Container(
width: 15,
height: 15,
child: Image.asset(pswVisible
? 'assets/images/close_eye.png'
: 'assets/images/open_eye.png'),
),
onTap: () {
if (visibleClick != null) {
visibleClick();
}
},
)),
],
),
fillColor: Colors.white,
hintStyle: t14hintText,
enabledBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: lineColor,
width: 2,
),
borderRadius: BorderRadius.circular(2)),
focusedBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: primaryColor,
width: 2,
),
borderRadius: BorderRadius.circular(2)),
hintText: '${hintText ?? '${S.of(context).input_psw_tips}'}',
focusedErrorBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: primaryColor,
width: 2,
),
borderRadius: BorderRadius.circular(2)),
errorBorder: UnderlineInputBorder(
borderSide: BorderSide(
color: lineColor,
width: 2,
),
borderRadius: BorderRadius.circular(2)),
errorText: "",
errorStyle: t12ErrorRed,
filled: false,
counterText: '')),
animationController,
));
}
}
|