“`dart 如何清除Flutter中的第一个文本控制器 “`

huangapple
go评论174阅读模式
英文:

How to clear first text controller flutter

问题

以下是翻译好的部分：

  1. 我想将此屏幕下方的文本更改为黑色。

  2. 其次，当我输入数字时，下方的文本显示“输入的PIN不匹配。”，而不是在我完成输入不匹配的PIN后显示。

  3. 用户设置他们的卡的PIN码，然后在同一屏幕上，我使用相同的控制器来确认他们的PIN码。问题在于设置PIN码的PIN控制器不清晰。我在同一屏幕上使用相同的屏幕，不将用户导航到新屏幕上。请看一下并解决这个问题。

  4. 这是我的代码

class _SetPinTestscreenState extends State<SetPinTestscreen> {
  TextEditingController setPinController = TextEditingController();
  PinValidationProvider pinValidationProvider;
  @override
  void initState() {
    Provider.of<PinValidationProvider>(context, listen: false).isPinSet = false;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MainTemplate(
      child: Padding(
        padding: const EdgeInsets.all(15.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Align(
              alignment: Alignment.centerLeft,
              child: Consumer<PinValidationProvider>(
                builder: (context, pinProvider, child) {
                  return Text(
                    pinProvider.isPinSet
                        ? '重新输入您的PIN码以确认'
                        : '设置PIN码以激活您的Finance House卡，以XXXX结尾',
                    style: TextStyle(fontWeight: FontWeight.w700, fontSize: 30),
                  );
                },
              ),
            ),
            SizedBox(height: 20),
            Center(
              child: PinFieldAutoFill(
                decoration: UnderlineDecoration(
                  textStyle: Theme.of(context).textTheme.subtitle1.copyWith(
                        fontWeight: FontWeight.bold,
                        fontSize: 15,
                      ),
                  gapSpace: 8,
                  lineHeight: 1.2,
                  colorBuilder:
                      PinListenColorBuilder(Colors.black, Colors.grey.shade400),
                ),
                onCodeChanged: (value) {
                  Provider.of<PinValidationProvider>(context, listen: false)
                      .validatePin(value, setPinController);
                },
                codeLength: 4,
                cursor: Cursor(color: Colors.black, enabled: true),
                controller: setPinController,
                keyboardType: TextInputType.number,
              ),
            ),
            SizedBox(height: 20),
            Consumer<PinValidationProvider>(
              builder: (context, provider, child) {
                final textColor =
                    provider.isInvalidPin || !provider.isPinMatched
                        ? Colors.red
                        : Colors.black;

                if (!provider.isPinMatched &&
                    provider.isPinSet &&
                    setPinController.text.isNotEmpty) {
                  return Text(
                    '输入的PIN码不匹配。',
                    style: TextStyle(
                      color: Colors.red,
                    ),
                  );
                } else {
                  return Text(
                    'PIN码必须至少为4位数字。不可为单个数字，如1111或数字顺序，如1234。',
                    style: TextStyle(
                      color: textColor,
                    ),
                  );
                }
              },
            ),
          ],
        ),
      ),
    );
  }
}
  1. 还有我的提供者类
class PinValidationProvider extends ChangeNotifier {
  bool _isInvalidPin = false;

  bool get isInvalidPin => _isInvalidPin;
  bool isPinSet = false;
  String pin = '';
  String confirmedPin = '';

  void validatePin(String pin) {
    if (pin.length != 4) {
      _isInvalidPin = false;
      pin = pin ?? '';
    } else {
      confirmedPin = pin ?? '';
      if (_isSimpleSequence(pin) || _isRepeatedDigit(pin)) {
        _isInvalidPin = true;
      } else {
        _isInvalidPin = false;
        if (!isPinSet) {
          isPinSet = true;
        }
      }
    }
    Future.microtask(() {
      notifyListeners();
    });
  }

  bool _isSimpleSequence(String pin) {
    for (int i = 0; i < pin.length - 1; i++) {
      int digit1 = int.parse(pin[i]);
      int digit2 = int.parse(pin[i + 1]);

      if (digit2 - digit1 == 1) {
        return true;
      }
    }
    return false;
  }

  bool _isRepeatedDigit(String pin) {
    for (int i = 0; i < pin.length - 1; i++) {
      if (pin[i] == pin[i + 1]) {
        return true;
      }
    }
    return false;
  }
}

希望这些翻译对您有所帮助。

英文:

UPDATED Question

I want to change this screen's below text in black

“`dart 如何清除Flutter中的第一个文本控制器 “`

and secondly when i type digit the below text shows that Entered PIN does not match. instead it shows after when i complete typed mis-match PIN.

“`dart 如何清除Flutter中的第一个文本控制器 “`

-------------------------------------------------------------------

The user sets their PIN for the card, and then on the same screen, I am using the same controller to confirm their PIN. The issue is that the PIN controller for setting the PIN is not clear. I am using same screen. I am not navigating user to new screen. Kindly take a look on it and resolve it.

“`dart 如何清除Flutter中的第一个文本控制器 “`

Here is my code

    class _SetPinTestscreenState extends State&lt;SetPinTestscreen&gt; {
TextEditingController setPinController = TextEditingController();
PinValidationProvider pinValidationProvider;
@override
void initState() {
Provider.of&lt;PinValidationProvider&gt;(context, listen: false).isPinSet = false;
super.initState();
}
@override
Widget build(BuildContext context) {
return MainTemplate(
child: Padding(
padding: const EdgeInsets.all(15.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Align(
alignment: Alignment.centerLeft,
child: Consumer&lt;PinValidationProvider&gt;(
builder: (context, pinProvider, child) {
return Text(
pinProvider.isPinSet
? &#39;Re-enter your PIN code to Confirm&#39;
: &#39;Set PIN to Activate your Finance House Card Ending With XXXX&#39;,
style: TextStyle(fontWeight: FontWeight.w700, fontSize: 30),
);
},
),
),
SizedBox(height: 20),
Center(
child: PinFieldAutoFill(
decoration: UnderlineDecoration(
textStyle: Theme.of(context).textTheme.subtitle1.copyWith(
fontWeight: FontWeight.bold,
fontSize: 15,
),
gapSpace: 8,
lineHeight: 1.2,
colorBuilder:
PinListenColorBuilder(Colors.black, Colors.grey.shade400),
),
onCodeChanged: (value) {
Provider.of&lt;PinValidationProvider&gt;(context, listen: false)
.validatePin(value, setPinController);
},
codeLength: 4,
cursor: Cursor(color: Colors.black, enabled: true),
controller: setPinController,
keyboardType: TextInputType.number,
),
),
SizedBox(height: 20),
Consumer&lt;PinValidationProvider&gt;(
builder: (context, provider, child) {
final textColor =
provider.isInvalidPin || !provider.isPinMatched
? Colors.red
: Colors.black;
if (!provider.isPinMatched &amp;&amp;
provider.isPinSet &amp;&amp;
setPinController.text.isNotEmpty) {
return Text(
&#39;Entered PIN does not match.&#39;,
style: TextStyle(
color: Colors.red,
),
);
} else {
return Text(
&#39;Pin must be at least 4 digits. It must not be single digits like&#39;
&#39; 1111 or digits in numerical order such as 1234&#39;,
style: TextStyle(
color: textColor,
),
);
}
},
),
],
),
),
);
}
}

Also here is my provider class

class PinValidationProvider extends ChangeNotifier {
bool _isInvalidPin = false;
bool get isInvalidPin =&gt; _isInvalidPin;
bool isPinSet = false;
String pin = &#39;&#39;;
String confirmedPin = &#39;&#39;;
void validatePin(String pin) {
if (pin.length != 4) {
_isInvalidPin = false;
pin = pin ?? &#39;&#39;;
} else {
confirmedPin = pin ?? &#39;&#39;;
if (_isSimpleSequence(pin) || _isRepeatedDigit(pin)) {
_isInvalidPin = true;
} else {
_isInvalidPin = false;
if (!isPinSet) {
isPinSet = true;
}
}
}
Future.microtask(() {
notifyListeners();
});
}
bool _isSimpleSequence(String pin) {
for (int i = 0; i &lt; pin.length - 1; i++) {
int digit1 = int.parse(pin[i]);
int digit2 = int.parse(pin[i + 1]);
if (digit2 - digit1 == 1) {
return true;
}
}
return false;
}
bool _isRepeatedDigit(String pin) {
for (int i = 0; i &lt; pin.length - 1; i++) {
if (pin[i] == pin[i + 1]) {
return true;
}
}
return false;
}
}

答案1

得分: 1

你可以调用setPinController.clear()来清除它的文本，在这种情况下，你可以将setPinController作为validatePin方法的参数添加，然后在方法内部调用clear()。

英文:

you can call setPinController.clear() to clear it's text, in this case, you can add setPinController as a parameter in validatePin method, then call clear() inside of the method.

  void validatePin(String pin, TextEditingController controller) {
if (pin.length != 4) {
_isInvalidPin = false;
} else {
if (_isSimpleSequence(pin) || _isRepeatedDigit(pin)) {
_isInvalidPin = true;
} else {
_isInvalidPin = false;
if (!isPinSet) {
isPinSet = true;
this.pin = pin;
} else {
confirmedPin = pin;
}
}
if (confirmedPin != this.pin) {
controller.clear();
}
}
Future.microtask(() {
notifyListeners();
});
}

huangapple
  • 本文由 发表于 2023年8月11日 04:04:41
  • 转载请务必保留本文链接：https://go.coder-hub.com/76878982.html
  • flutter
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定