Flutter表单验证插件auto_validate的使用

Auto Validate简介

Auto Validate Package是一个独特且易于使用的解决方案，它通过正则表达式自动验证各种数据类型。该插件由Mahmoud El Shenawy创建，提供了多种验证功能，简化了开发过程中的输入验证工作。

• Pub Package
• Build Status
• Unit Test
• Creator
• Buy Me A Coffee

重要性

这个包简化了验证过程，使你可以轻松地实现验证而无需自己编写代码。通过使用此包，可以节省宝贵的时间并确保输入的数据符合所需的标准。

使用方法

String Validation Extension (新特性)

该包提供了一个对String?的扩展，利用AutoValidate类提供了方便的方法来验证各种输入格式。这使得Dart应用程序中的验证过程更加易读和流畅。

功能特点

• 验证用户名、密码、电子邮件地址、电话号码、信用卡号等。
• 检查有效的格式，如ISBN、MAC地址、十六进制代码、JSON Web Tokens (JWT)等。
• 简化验证检查，直接在String?实例上使用流利的方法。
• 改善代码的可读性和可维护性，使用扩展方法进行验证。

示例代码

以下是如何使用Auto Validate包的一个简单例子：

import 'package:auto_validate/auto_validate.dart';

void validation() {
  var email = 'Dev.M.ElShenawy@Icloud.com';
  var name = 'Mahmud El Shenawy';
  var password = '@MahmoudElShenawy2021';
  var phone = '+201098415860';

  // 使用AutoValidate类进行验证
  AutoValidate.email(email.toString())
      ? print('Email is Valid')
      : print('Email is Invalid');

  AutoValidate.userName(name.toString())
      ? print('User Name is Valid')
      : print('User Name is Invalid');

  AutoValidate.password(password.toString())
      ? print('Password is Valid')
      : print('Password is Invalid');

  AutoValidate.phone(phone.toString())
      ? print('Phone is Valid')
      : print('Phone is Invalid');

  // 使用扩展方法进行验证
  email.isValidEmail
      ? print('Email is Valid')
      : print('Email is Invalid');

  name.isValidUsername
      ? print('User Name is Valid')
      : print('User Name is Invalid');

  password.isValidPassword
      ? print('Password is Valid')
      : print('Password is Invalid');

  phone.isValidPhone
      ? print('Phone is Valid')
      : print('Phone is Invalid');
}

表单验证示例

下面是一个简单的表单验证示例，展示了如何在Flutter中使用FormValidator来进行表单字段的验证：

import 'package:auto_validate/auto_validate.dart';
import 'package:flutter/material.dart';

/// 创建一个主应用类
class AutoValidateApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Auto Validate Package',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text("Auto Validate"),
        ),
        body: AutoValidateHome(),
      ),
    );
  }
}

/// 主页面类，包含表单验证逻辑
class AutoValidateHome extends StatelessWidget {
  final TextEditingController emailController = TextEditingController();
  final TextEditingController passwordController = TextEditingController();
  final TextEditingController strongPasswordController = TextEditingController();
  final TextEditingController phoneController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: [
        Padding(
          padding: const EdgeInsets.symmetric(vertical: 15.0, horizontal: 12.5),
          child: Column(
            children: [
              Flexible(
                flex: 5,
                child: FlutterLogo(size: 200),
              ),
              Flexible(
                flex: 7,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    _buildTextField(
                      controller: emailController,
                      hintText: "Email",
                      validator: FormValidator.email(
                        errorMessage: 'Please Enter Valid Email',
                      ),
                    ),
                    _buildTextField(
                      controller: passwordController,
                      hintText: "Password",
                      validator: FormValidator.password(
                        errorMessage: 'Please Enter Valid Password',
                      ),
                    ),
                    _buildTextField(
                      controller: strongPasswordController,
                      hintText: "Strong Password",
                      validator: FormValidator.passwordStrong(
                        errorMessage: 'Please Enter Valid Strong Password',
                      ),
                    ),
                    _buildTextField(
                      controller: phoneController,
                      hintText: "Phone",
                      validator: FormValidator.phone(
                        errorMessage: 'Please Enter Valid Phone',
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }

  /// 构建带有验证功能的文本框
  Widget _buildTextField({
    required TextEditingController controller,
    required String hintText,
    required String? Function(String?)? validator,
  }) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 5.0, horizontal: 2.0),
      child: TextFormField(
        controller: controller,
        decoration: InputDecoration(
          hintText: hintText,
          border: OutlineInputBorder(
            borderSide: BorderSide(),
          ),
        ),
        validator: validator,
      ),
    );
  }
}

复杂验证组合

你还可以结合多个验证器来满足更复杂的验证需求：

TextFormField(
  controller: passwordController,
  decoration: InputDecoration(
    hintText: "Password",
    border: OutlineInputBorder(
      borderSide: BorderSide(),
    ),
  ),
  validator: FormValidator.combination(
    validators: [
      FormValidator.maxLength(maxLength: 15, errorMessage: 'Password Enter Valid Password With Max Length 15'),
      FormValidator.minLength(minLength: 5, errorMessage: 'Password Enter Valid Password At Least Min Length 5'),
      FormValidator.passwordStrong(errorMessage: 'Please Enter Valid Strong Password')
    ]
  ),
);

更多细节

Auto Validate不仅支持常见的验证规则（如邮箱、手机号、密码强度等），还支持许多其他类型的验证，包括但不限于：

• 阿拉伯文输入
• 用户名（包含字母数字、下划线和连字符，长度为3到16个字符）
• 强密码（包含至少一个小写字母、大写字母、数字、特殊字符，并且长度为8个字符以上）

注意事项

• Auto Validate用于检查任何你想要的值。
• Form Validator具有相同的功能，但带有错误消息，适用于TextFormField的validator属性。
• 可以组合多个验证器以实现更复杂的验证逻辑。

报告问题

如果你遇到任何问题、漏洞或有改进建议，请在GitHub Issues页面报告。报告时请提供详细信息，以便更好地帮助解决问题。

结语

希望这篇文章能帮助你更好地理解和使用auto_validate插件，提高Flutter项目中的表单验证效率。如果你有任何疑问或需要进一步的帮助，欢迎随时提问！