“我需要解决以下问题:仅当pinput的值与指定值匹配时才启用“验证”按钮;否则,保持禁用按钮。我们如何才能做到这一点?“
期望:在其他条件下禁用按钮,我们怎么做?在isOTP有效假禁用“验证”按钮。
我正在使用包pinput为OTP,这是我的代码:
class OTPForm extends StatefulWidget {
final Function toggleForm;
OTPForm(this.toggleForm);
@override
State<OTPForm> createState() => _OTPFormState();
}
class _OTPFormState extends State<OTPForm> {
bool isOTPValid = false;
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Pinput(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
length: 4,
defaultPinTheme: defaultPinTheme,
focusedPinTheme: defaultPinTheme.copyWith(
decoration: defaultPinTheme.decoration!.copyWith(
border: Border.all(color: primaryColor),
),
),
errorPinTheme: defaultPinTheme.copyBorderWith(
border: Border.all(color: dangerColor),
),
validator: (value) {
// return value == '1155' ? null : 'Pin is incorrect';
isOTPValid = value == '1155';
return isOTPValid ? null : 'Pin is incorrect';
},
hapticFeedbackType: HapticFeedbackType.lightImpact,
onCompleted: (pin) {
debugPrint('onCompleted: $pin');
// widget.toggleForm();
},
onChanged: (value) {
debugPrint('onChanged: $value');
},
autofocus: true,
),
const SizedBox(height: mdVerticalSpacing),
Container(
height: buttonHeight,
width: double.infinity,
child: PrimaryButton(
text: 'Verify',
onPressed: () {
if (isOTPValid) {
widget.toggleForm();
}
},
),
),
],
),
);
}
}
1条答案
按热度按时间sczxawaw1#
如果您没有使用任何类似bloc的软件包,最简单的方法是调用
setState
来设置isOTPValid
值。由于PrimaryButton
需要onPressed
参数,您可以通过AbsorbPointer告诉用户按钮的状态,例如: