0

userName を取得するために、コンテナ内で text と textformfield を使用しています。テキスト フィールドの検証を行う必要があり、予想される結果の画像に示すように、エラー メッセージと赤色の境界ボックスが表示されます。現在の出力も含めました。他にもいくつかの方法を試しました。しかし、何も機能しませんでした。

電流出力

期待される出力

    decoration: BoxDecoration(
        borderRadius: BorderRadius.all(Radius.circular(10)),
        shape: BoxShape.rectangle,
        color: Color(0xFFF4F9FE),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.fromLTRB(10, 3, 0, 0),
            child: Text("Full Name",
              style: TextStyle(color: Color(0xFFA8C3EC)),
            ),
          ),
          Padding(
            padding: const EdgeInsets.fromLTRB(10, 0, 10, 0),
            child: TextFormField(
              decoration: new InputDecoration(
                hintText: "Enter Your Full Name",
                border: InputBorder.none,
                focusedBorder: InputBorder.none,
                enabledBorder: InputBorder.none,
                errorBorder: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(10.0),
                  borderSide: BorderSide(color:  Colors.red),
                ),
                disabledBorder: InputBorder.none,
                contentPadding: const EdgeInsets.symmetric(vertical: 1.0),
              ),
              validator: _validateName,
            ),
          ),
        ],
      ),
    );

String _validateName(String value) {
    return "Required field cannot be empty";
}
4

1 に答える 1

0

Flutter TextFormField はエラー テキスト自体を処理するため、変数 _validate を使用する必要はありません。条件を満たしているかどうかを実行時にチェックします。

final confirmPassword = TextFormField(
  controller: widget.confirmPasswordController,
  obscureText: true,
  decoration: InputDecoration(
    prefixIcon: Icon(Icons.lock_open, color: Colors.grey),
    hintText: 'Confirm Password',
    errorText: validatePassword(widget.confirmPasswordController.text),
    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
  ),
);

String validatePassword(String value) {
  if (!(value.length > 5) && value.isNotEmpty) {
    return "Password should contain more than 5 characters";
  }
  return null;
}

注: このエラー メッセージを表示するには、少なくとも 1 文字を追加する必要があります。より詳しい情報

于 2020-11-23T10:16:22.593 に答える