Flutter表单验证插件pvalidator的使用
Flutter表单验证插件pvalidator的使用
pvalidator 是一个用于在 Flutter 应用中进行输入验证的简单包。它提供了多种验证规则，如必填项验证、电子邮件验证等。
特性
以下是 pvalidator 支持的一些验证规则：
- 接受值：列表中接受的值
- 日期：使用
DateTime.tryParse进行测试 - 电子邮件：电子邮件验证
- 最大数值：检查最大数字
- 最大字符串：检查最大字符串长度
- 最小数值：检查最小数字
- 最小字符串：检查最小字符串长度
- 数值：检查值是否为数值
- 正则表达式：使用正则表达式进行验证
- 必填项：检查是否存在值
- 必填日期：检查是否存在值
- 必填条件：根据条件检查是否存在值
- 相同：值必须相同
- 字符串大小：检查值的大小
- 最小日期时间：解析字符串并检查日期是否在指定日期之后
- 最大日期时间：解析字符串并检查日期是否在指定日期之前
- 整数：检查值是否为整数
- 仅一项：检查是否只有一项被输入
使用方法
首先，在 pubspec.yaml 文件中添加 pvalidator 依赖：
dependencies:
pvalidator: ^最新版本号
然后，导入包并在你的代码中使用：
import 'package:pvalidator/pvalidator.dart';
基本用法
必填字段验证
TextFormField(
validator: (string) {
return PValidator([
PRuleRequired(string),
]).val();
},
)
这里，PValidator 是主类，PRuleRequired 是一个验证规则。你可以设置一个或多个规则来进行验证。
多个规则验证
TextFormField(
validator: (string) {
return PValidator([
PRuleRequired(string),
PRuleSizeString(string, 5),
]).val();
},
)
在这个例子中，我们同时设置了必填项和字符串长度不超过5的规则。
创建自定义规则
你也可以创建自己的验证规则：
import 'package:pvalidator/src/rules/rule.dart';
class MyCustomRule implements Rule {
String? _value;
String message;
MyCustomRule(this._value, {this.message = "Value must be equal test"});
[@override](/user/override)
String? validate() {
if (_value == null || _value?.trim().length == 0) {
return null;
} else if (_value != "test") {
return message;
} else {
return null;
}
}
}
完整示例
以下是一个完整的示例，展示了如何使用 pvalidator 包来验证表单字段：
import 'package:example/rules/my_custom_rule.dart';
import 'package:flutter/material.dart';
import 'package:pvalidator/pvalidator.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
[@override](/user/override)
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'PValidator Demo Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
[@override](/user/override)
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final _formKey = GlobalKey<FormState>();
TextEditingController acceptValuesController = TextEditingController();
TextEditingController dateController = TextEditingController();
TextEditingController emailController = TextEditingController();
TextEditingController maxNumericController = TextEditingController();
TextEditingController maxStringController = TextEditingController();
TextEditingController minNumericController = TextEditingController();
TextEditingController minStringController = TextEditingController();
TextEditingController numericController = TextEditingController();
TextEditingController regexpController = TextEditingController();
TextEditingController requiredController = TextEditingController();
TextEditingController requiredifController = TextEditingController();
TextEditingController sameController = TextEditingController();
TextEditingController sizeStringController = TextEditingController();
TextEditingController minDateTimeController = TextEditingController();
TextEditingController maxDateTimeController = TextEditingController();
TextEditingController integerController = TextEditingController();
TextEditingController cpfController = TextEditingController();
TextEditingController cnpjController = TextEditingController();
TextEditingController onlyOneFieldController = TextEditingController();
TextEditingController multipleController = TextEditingController();
TextEditingController customController = TextEditingController();
void _save() {
if (_formKey.currentState!.validate()) {}
}
[@override](/user/override)
void initState() {
acceptValuesController.text = 'C';
dateController.text = '12-12-2022';
emailController.text = 'invalid email@test.com';
maxNumericController.text = '100';
maxStringController.text = '123456';
minNumericController.text = '100';
minStringController.text = '1234';
numericController.text = 'invalid number';
regexpController.text = '12345';
requiredController.text = '';
requiredifController.text = '';
sameController.text = '123456';
sizeStringController.text = '123456';
minDateTimeController.text = '2000-01-01';
maxDateTimeController.text = '2020-01-01';
integerController.text = '2.2';
cpfController.text = '99988877766';
cnpjController.text = '99888777666655';
onlyOneFieldController.text = 'this field is present';
multipleController.text = '';
customController.text = 'other string';
super.initState();
}
[@override](/user/override)
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Form(
key: _formKey,
child: Container(
padding: const EdgeInsets.all(16),
child: SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text('acceptValues'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: acceptValuesController,
validator: (string) {
return PValidator([
PRuleAcceptValues(string, ['A', 'B']),
]).val();
},
),
),
const Text('date'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: dateController,
validator: (string) {
return PValidator([
PRuleDateTime(string),
]).val();
},
),
),
const Text('email'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: emailController,
validator: (string) {
return PValidator([
PRuleEmail(string),
]).val();
},
),
),
const Text('maxNumeric'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: maxNumericController,
validator: (string) {
return PValidator([
PRuleMaxNumeric(string, 50),
]).val();
},
),
),
const Text('maxString'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: maxStringController,
validator: (string) {
return PValidator([
PRuleMaxString(string, 5),
]).val();
},
),
),
const Text('minNumeric'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: minNumericController,
validator: (string) {
return PValidator([
PRuleMinNumeric(string, 200),
]).val();
},
),
),
const Text('minString'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: minStringController,
validator: (string) {
return PValidator([
PRuleMinString(string, 5),
]).val();
},
),
),
const Text('numeric'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: numericController,
validator: (string) {
return PValidator([
PRuleNumeric(string),
]).val();
},
),
),
const Text('regexp'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: regexpController,
validator: (string) {
return PValidator([
PRuleRegex(string, r"^[a-z]+"),
]).val();
},
),
),
const Text('required'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: requiredController,
validator: (string) {
return PValidator([
PRuleRequired(string),
]).val();
},
),
),
const Text('requiredif'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: requiredifController,
validator: (string) {
return PValidator([
PRuleRequiredIf(string, true),
]).val();
},
),
),
const Text('same'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: sameController,
validator: (string) {
return PValidator([
PRuleSame(string, "12345"),
]).val();
},
),
),
const Text('sizeString'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: sizeStringController,
validator: (string) {
return PValidator([
PRuleSizeString(string, 5),
]).val();
},
),
),
const Text('minimumDateTime'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: minDateTimeController,
validator: (string) {
return PValidator([
PRuleMinDateTimeString(string, DateTime.parse("2020-01-01")),
]).val();
},
),
),
const Text('maximumDateTime'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: maxDateTimeController,
validator: (string) {
return PValidator([
PRuleMaxDateTimeString(string, DateTime.parse("2000-01-01")),
]).val();
},
),
),
const Text('integer'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: integerController,
validator: (string) {
return PValidator([
PRuleInteger(string),
]).val();
},
),
),
const Text('CPF'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: cpfController,
validator: (string) {
return PValidator([
PRuleCpf(string),
]).val();
},
),
),
const Text('CNPJ'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: cnpjController,
validator: (string) {
return PValidator([
PRuleCnpj(string),
]).val();
},
),
),
const Text('Only one field'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: onlyOneFieldController,
validator: (string) {
return PValidator([
PRuleOnlyOneField([string, "other field"]),
]).val();
},
),
),
const Text('Multiple validator'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: multipleController,
validator: (string) {
return PValidator([
PRuleRequired(string),
PRuleSizeString(string, 5),
]).val();
},
),
),
const Text('Custom Rule'),
Padding(
padding: const EdgeInsets.only(bottom: 16),
child: TextFormField(
controller: customController,
validator: (string) {
return PValidator([
MyCustomRule(string),
]).val();
},
),
),
MaterialButton(
onPressed: () => _save(),
color: Colors.blue,
child: const Text("Validate"),
textColor: Colors.white,
minWidth: MediaQuery.of(context).size.width,
),
],
),
),
),
),
);
}
}
更多关于Flutter表单验证插件pvalidator的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html
1 回复
更多关于Flutter表单验证插件pvalidator的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html
当然，下面是一个关于如何在Flutter项目中使用pvalidator插件进行表单验证的代码示例。pvalidator是一个流行的Flutter插件，用于简化表单验证过程。不过需要注意的是，由于插件生态的不断变化，确保你已经安装了最新版本的pvalidator。
首先，你需要在pubspec.yaml文件中添加pvalidator依赖：
dependencies:
flutter:
sdk: flutter
pvalidator: ^x.y.z # 请替换为最新版本号
然后，运行flutter pub get来安装依赖。
接下来是一个简单的Flutter应用示例，展示如何使用pvalidator进行表单验证：
import 'package:flutter/material.dart';
import 'package:pvalidator/pvalidator.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Form Validation Example',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final _formKey = GlobalKey<FormState>();
String _email = '';
String _password = '';
bool _autoValidate = false;
void _validateAndSubmit() {
if (_formKey.currentState!.validate()) {
_formKey.currentState!.save();
// 在这里执行提交操作，例如发送到服务器
print('Email: $_email');
print('Password: $_password');
} else {
setState(() {
_autoValidate = true;
});
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Form Validation Example'),
),
body: Padding(
padding: const EdgeInsets.all(16.0),
child: Form(
key: _formKey,
autovalidateMode: _autoValidate ? AutovalidateMode.always : AutovalidateMode.disabled,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
TextFormField(
decoration: InputDecoration(labelText: 'Email'),
validator: (value) {
if (value == null || !PValidator.isEmail(value)) {
return 'Please enter a valid email address.';
}
return null;
},
onSaved: (value) {
_email = value!;
},
),
TextFormField(
decoration: InputDecoration(labelText: 'Password'),
obscureText: true,
validator: (value) {
if (value == null || value.length < 6) {
return 'Password must be at least 6 characters long.';
}
return null;
},
onSaved: (value) {
_password = value!;
},
),
SizedBox(height: 20),
ElevatedButton(
onPressed: _validateAndSubmit,
child: Text('Submit'),
),
],
),
),
),
);
}
}
在这个示例中，我们使用了PValidator.isEmail方法来验证电子邮件地址的有效性。虽然pvalidator提供了更多的验证方法（如isUrl, isPhone, isNumeric等），但在这个示例中我们只展示了电子邮件和密码的验证。
注意：
autovalidateMode属性用于控制表单的自动验证行为。当_autoValidate为true时，表单会在每次文本字段更改后立即验证。validator回调函数用于执行具体的验证逻辑，如果验证失败，返回一个错误消息字符串；否则返回null。onSaved回调函数用于保存表单字段的值。
确保在实际项目中根据需求调整和扩展验证逻辑。
