搜索插件、代码仓与 APP 分类

form_model 封面
插件详情v1.0.2+2

form_model

一个功能强大且灵活的 Flutter 应用表单验证包。

AndroidiOSWebmacOSWindowsLinux
近 30 天下载
11
喜欢数
8
Pub 分数
160

安装插件

flutter pub add form_model

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

form_model 是一个强大的 Flutter 包,旨在简化表单创建、验证和状态管理。它提供了一个灵活的框架,用于构建动态表单,并内置了实时验证、自动格式化和掩码支持。开发者可以轻松定义表单字段,应用验证器,并以最少的样板代码响应更改。该包可无缝集成到所有主要平台,非常适合需要一致表单行为的跨平台应用程序。

适合场景

  • 动态表单生成
  • 实时输入验证
  • 自动格式化用户输入
  • 跨平台表单一致性
  • 复杂表单状态管理

主要特点

  • 内置验证规则
  • 自动格式化和掩码
  • 响应式表单状态更新
  • 可扩展字段类型
  • 最小化样板设置

适合对象

  • 开发复杂表单的开发者
  • 需要严格输入验证的应用程序
  • 跨平台 Flutter 项目
  • 注重可维护表单代码的团队

使用建议

  • 需要理解响应式编程
  • 高级功能的学习曲线
  • 与流行的替代方案相比,文档有限

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

form_model

A powerful and flexible form validation package for Flutter applications.

flutter platform pub package BSD-2-Clause

Features

  • 🚀 Easy-to-use form validation
  • 🎯 Single-responsibility validators for clear, maintainable code
  • 🌐 Built-in internationalization support with fallback locales
  • 🧩 Extensible with custom validators and translations
  • 🔄 Immutable state management
  • 🔗 Integrates seamlessly with Flutter widgets
  • 🎛️ Advanced form controls (date pickers, multi-select, etc.)
  • 🧬 Works great with state management solutions like BLoC
  • 🧪 Comprehensive test coverage

Screenshots

Here are some screenshots of form_model in action:

Screenshot 1 Screenshot 2 Screenshot 3 Screenshot 4 Screenshot 5 Screenshot 6 Screenshot 7

Installation

Add form_model to your pubspec.yaml file:

dependencies:
  form_model: ^1.0.2+2

Then run:

flutter pub get

Basic Usage

Here's a simple example of how to use form_model:

import 'package:form_model/form_model.dart';

// Create a FormModel for an email field
final emailModel = FormModel<String>(
  validators: [RequiredValidator(), EmailValidator()],
);

// Set a value and validate
final validatedModel = emailModel.setValue('user@example.com').validate();

if (validatedModel.isValid) {
  print('Email is valid: ${validatedModel.value}');
} else {
  print('Validation error: ${validatedModel.error?.translatedMessage}');
}

Note: Each validator is responsible for checking one specific aspect of the input and returns only one type of error. This principle should be followed when creating custom validators for your application.

Advanced Usage

For more complex forms, you can combine multiple FormModel instances. Here's an example with a password confirmation field:

class RegistrationForm {
  final FormModel<String> username;
  final FormModel<String> email;
  final FormModel<String> password;
  late final FormModel<String> confirmPassword;

  RegistrationForm({
    required this.username,
    required this.email,
    required this.password,
  }) {
    confirmPassword = FormModel<String>(
      validators: [
        RequiredValidator(),
        StringConfirmPasswordMatchValidator(matchingValue: password.value),
      ],
    );
  }

  bool get isValid => 
    username.isValid && 
    email.isValid && 
    password.isValid && 
    confirmPassword.isValid;

  void validate() {
    username.validate();
    email.validate();
    password.validate();
    confirmPassword = confirmPassword
      .replaceValidator(
        predicate: (validator) => validator is StringConfirmPasswordMatchValidator,
        newValidator: StringConfirmPasswordMatchValidator(matchingValue: password.value),
      )
      .validate();
  }

  void updatePassword(String newPassword) {
    password.setValue(newPassword);
    // Update confirm password validator
    confirmPassword = confirmPassword
      .replaceValidator(
        predicate: (validator) => validator is StringConfirmPasswordMatchValidator,
        newValidator: StringConfirmPasswordMatchValidator(matchingValue: newPassword),
      );
  }
}

This example demonstrates how to properly set up and update a password match validator.

Validators

form_model includes a wide range of built-in validators, each responsible for a single aspect of validation:

  • RequiredValidator
  • EmailValidator
  • StringMinLengthValidator
  • StringMaxLengthValidator
  • PasswordLengthValidator
  • PasswordUppercaseValidator
  • PasswordLowercaseValidator
  • PasswordNumberValidator
  • PasswordSpecialCharValidator
  • DateTimeValidator
  • StringDateTimeAgeMinValidator
  • StringDateTimeAgeMaxValidator
  • StringPhoneNumberValidator
  • StringNumbersOnlyValidator
  • StringTextOnlyValidator
  • StringUrlValidator
  • StringWordsCountMinValidator
  • StringWordsCountMaxValidator
  • StringCreditCardValidator
  • CustomEqualValidator
  • StringCustomPatternValidator
  • IpAddressValidator
  • Ipv6AddressValidator
  • StringNumMinValidator
  • StringNumMaxValidator
  • StringContainsValidator
  • StringNotContainsValidator
  • FileTypeValidator
  • FileSizeValidator
  • BoolTrueValidator
  • BoolFalseValidator
  • BoolAgreeToTermsAndConditionsValidator

Each validator focuses on a single validation rule, adhering to the single-responsibility principle.

Internationalization

form_model supports multiple languages out of the box:

// Set the current locale
FormModelLocalizations().setCurrentLocale(const Locale('es'));

// Get a translated error message
final errorMessage = emailModel.error?.translatedMessage;
Supported Languages

form_model supports the following languages:

  • English (en)
  • Spanish (es)
  • French (fr)
  • German (de)
  • Arabic (ar)
  • Chinese (Simplified) (zh_CN)
  • Hindi (hi)
  • Italian (it)
  • Japanese (ja)
  • Korean (ko)
  • Dutch (nl)
  • Portuguese (pt)
  • Russian (ru)
  • Turkish (tr)
  • Ukrainian (uk)
  • Vietnamese (vi)
  • Polish (pl)
  • Swedish (sv)

Integration with BLoC and Freezed

form_model integrates seamlessly with the BLoC pattern. Here's an example of a Flutter BLoC state using Freezed:

@freezed
class RegistrationState with _$RegistrationState {
  const factory RegistrationState({
    @Default(FormModel<String>(validators: [RequiredValidator()]))
    FormModel<String> username,
    
    @Default(FormModel<String>(validators: [RequiredValidator(), EmailValidator()]))
    FormModel<String> email,
    
    @Default(FormModel<String>(validators: [
      RequiredValidator(),
      PasswordLengthValidator(minLength: 8),
      PasswordUppercaseValidator(),
      PasswordLowercaseValidator(),
      PasswordNumberValidator(),
      PasswordSpecialCharValidator(),
    ]))
    FormModel<String> password,
    
    @Default(false) bool isSubmitting,
    @Default(false) bool isSuccess,
    String? errorMessage,
  }) = _RegistrationState;
}

Custom Validators

Custom validators allow you to create specific validation rules not covered by built-in validators. Here's a simple example of a custom validator that checks if a string starts with a specific prefix:

String? validatePrefix(String? value) {
  const requiredPrefix = 'USER_';
  if (value == null || !value.startsWith(requiredPrefix)) {
    return 'Value must start with $requiredPrefix';
  }
  return null;
}

final userIdModel = FormModel<String>(
  validators: [
    RequiredValidator(),
    CustomValidator(validator: validatePrefix),
  ],
);

// Usage
void validateUserId(String userId) {
  final validatedModel = userIdModel.setValue(userId).validate();
  if (validatedModel.isValid) {
    print('Valid User ID: ${validatedModel.value}');
  } else {
    print('Invalid User ID: ${validatedModel.error?.translatedMessage}');
  }
}

// Example
validateUserId('USER_123'); // Valid
validateUserId('ADMIN_456'); // Invalid

This custom validator checks if the input string starts with the prefix 'USER_'. It demonstrates how you can easily create application-specific validation logic using custom validators.

Custom validation functions should return a string with an error message if validation fails, or null if it passes. This approach allows you to extend form_model's capabilities to suit your specific needs while maintaining clean and modular code.

Working with Custom Objects

form_model can handle complex custom objects as well. Here's an example using an Address class:

class Address {
  final String street;
  final String city;

  Address({required this.street, required this.city});
}

String? validateStreet(Address? value) {
  if (value == null || value.street.isEmpty) return 'Street is required';
  return null;
}

String? validateCity(Address? value) {
  if (value == null || value.city.isEmpty) return 'City is required';
  return null;
}

final addressModel = FormModel<Address>(
  validators: [
    CustomValidator(validator: validateStreet),
    CustomValidator(validator: validateCity),
  ],
);

// Usage
void updateAddress(String street, String city) {
  final newAddress = Address(street: street, city: city);
  addressModel.setValue(newAddress).validate();
}

This approach allows you to validate complex objects while keeping individual validation rules separate and focused.

Custom Translations

You can set custom translations for both custom and predefined error messages:

void setCustomTranslations() {
  // Set custom translation for a custom error
  FormModelLocalizations().setCustomErrorTranslations(
    'en',
    const CustomFormErrorKey('password_no_exclamation'),
    'Password must contain an exclamation mark',
  );

  // Override translation for a predefined error
  FormModelLocalizations().setCustomErrorTranslations(
    'en',
    const PredefinedFormErrorKey(PredefinedFormErrorType.required),
    'This field cannot be left empty',
  );

  // Set translations for other languages
  FormModelLocalizations().setCustomErrorTranslations(
    'es',
    const CustomFormErrorKey('password_no_exclamation'),
    'La contraseña debe contener un signo de exclamación',
  );

  FormModelLocalizations().setCustomErrorTranslations(
    'es',
    const PredefinedFormErrorKey(PredefinedFormErrorType.required),
    'Este campo no puede estar vacío',
  );
}

Call this function early in your app's lifecycle to set up custom translations.

Contributing

Contributions are welcome! Please read our contributing guidelines to get started. The package already has comprehensive test coverage, but additional tests for new features are always appreciated.

License

This project is licensed under the 3-Clause BSD License - see the LICENSE file for details.

所属分类

源码仓库

使用此插件的项目

暂无相关数据。