Flutter国家电话验证插件country_phone_validator的使用

发布于 1周前 作者 yibo5220 来自 Flutter

Flutter国家电话验证插件country_phone_validator的使用

插件简介

Country Phone Validator 是一个Dart包,它提供了根据国家代码验证电话号码的功能。它包含了关于国家拨号代码、ISO代码和电话号码长度限制的信息。

功能特性

  • 国家信息:获取国家名称、ISO代码、拨号代码及电话号码长度限制等信息。
  • 电话号码验证:基于国家拨号代码和长度限制验证电话号码。
  • 可扩展性:可以轻松地用额外的国家信息或验证规则扩展此包。

安装方法

要在项目中使用这个包,在pubspec.yaml文件中添加依赖:

dependencies:
  country_phone_validator: ^0.0.1

然后在终端执行 flutter pub get 来安装依赖。

使用示例

验证电话号码

下面是一个完整的Flutter Demo来演示如何使用country_phone_validator插件进行电话号码验证。

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Phone Number Validation')),
        body: PhoneNumberValidator(),
      ),
    );
  }
}

class PhoneNumberValidator extends StatefulWidget {
  @override
  _PhoneNumberValidatorState createState() => _PhoneNumberValidatorState();
}

class _PhoneNumberValidatorState extends State<PhoneNumberValidator> {
  final TextEditingController _phoneNumberController = TextEditingController();
  final TextEditingController _dialCodeController = TextEditingController(text: '+20');
  String _validationResult = '';

  void _validatePhoneNumber() {
    String dialCode = _dialCodeController.text;
    String phoneNumber = _phoneNumberController.text;

    bool isValid = CountryUtils.validatePhoneNumber(phoneNumber, dialCode);

    setState(() {
      _validationResult = isValid ? "The phone number is valid." : "The phone number is invalid.";
    });
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(8.0),
      child: Column(
        children: [
          TextField(
            controller: _phoneNumberController,
            decoration: InputDecoration(labelText: 'Enter phone number'),
          ),
          TextField(
            controller: _dialCodeController,
            decoration: InputDecoration(labelText: 'Enter dial code (e.g., +20)'),
          ),
          SizedBox(height: 20),
          ElevatedButton(
            onPressed: _validatePhoneNumber,
            child: Text('Validate'),
          ),
          SizedBox(height: 20),
          Text(_validationResult),
        ],
      ),
    );
  }
}

获取国家信息

除了验证电话号码外,你还可以通过ISO代码或拨号代码来获取国家信息。例如:

// 根据ISO代码获取国家信息
Country? country = CountryUtils.getCountryByIsoCode("GB");
if (country != null) {
  print("Country: ${country.name}, Dial Code: ${country.dialCode}");
} else {
  print("Country not found.");
}

API参考

  • Country:表示带有相关信息(如国家名称、ISO代码、拨号代码、最小和最大电话号码长度)的国家。
  • CountryUtils:提供用于检索国家信息和验证电话号码的方法:
    • getCountryByDialCode(String dialCode):根据拨号代码检索国家。
    • getCountryByIsoCode(String isoCode):根据ISO代码检索国家。
    • validatePhoneNumber(String phoneNumber, String dialCode):根据国家的拨号代码验证电话号码。

贡献与许可

欢迎为该包贡献代码!请随时在GitHub仓库上提交问题或拉取请求。本包遵循MIT许可证发布。


更多关于Flutter国家电话验证插件country_phone_validator的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter国家电话验证插件country_phone_validator的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,以下是如何在Flutter项目中使用country_phone_validator插件进行国家电话验证的示例代码。

首先,确保你已经在pubspec.yaml文件中添加了country_phone_validator依赖:

dependencies:
  flutter:
    sdk: flutter
  country_phone_validator: ^0.0.10  # 请确保版本号是最新的

然后运行flutter pub get来安装依赖。

接下来,你可以在你的Flutter应用中使用country_phone_validator插件。以下是一个完整的示例,展示如何进行国家电话验证:

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Country Phone Validator Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: PhoneValidationScreen(),
    );
  }
}

class PhoneValidationScreen extends StatefulWidget {
  @override
  _PhoneValidationScreenState createState() => _PhoneValidationScreenState();
}

class _PhoneValidationScreenState extends State<PhoneValidationScreen> {
  final TextEditingController _phoneController = TextEditingController();
  final TextEditingController _countryCodeController = TextEditingController();
  String? _validationMessage;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Country Phone Validator Demo'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            TextFormField(
              controller: _countryCodeController,
              decoration: InputDecoration(
                labelText: 'Country Code (+)',
              ),
              keyboardType: TextInputType.numberWithOptions(signed: true, decimal: false),
              validator: (value) {
                if (value!.isEmpty) {
                  return 'Country code is required';
                }
                return null;
              },
            ),
            SizedBox(height: 16),
            TextFormField(
              controller: _phoneController,
              decoration: InputDecoration(
                labelText: 'Phone Number',
              ),
              keyboardType: TextInputType.phone,
              validator: (value) {
                if (value!.isEmpty) {
                  return 'Phone number is required';
                }
                return validatePhoneNumber(value, countryCode: _countryCodeController.text);
              },
            ),
            SizedBox(height: 16),
            Text(
              _validationMessage ?? '',
              style: TextStyle(color: Colors.red),
            ),
            SizedBox(height: 16),
            ElevatedButton(
              onPressed: () {
                if (_formIsValid()) {
                  // Perform further actions if the form is valid
                  print('Form is valid. Phone number: ${_phoneController.text}');
                }
              },
              child: Text('Submit'),
            ),
          ],
        ),
      ),
    );
  }

  bool _formIsValid() {
    final form = GlobalKey<FormState>().currentState;
    if (form!.validate()) {
      _validationMessage = validatePhoneNumber(_phoneController.text, countryCode: _countryCodeController.text);
      return _validationMessage == null;
    } else {
      _validationMessage = 'Please fix the errors in the form.';
      return false;
    }
  }

  String? validatePhoneNumber(String phoneNumber, {required String countryCode}) {
    final phoneUtil = PhoneNumberUtil();
    try {
      final phoneNumberObj = phoneUtil.parseAndFormatPhoneNumberFromE164(
        '+$countryCode$phoneNumber'.replaceAll(RegExp(r'\D'), ''),
      );
      if (phoneUtil.isValidNumber(phoneNumberObj)) {
        return null;
      } else {
        return 'Invalid phone number';
      }
    } catch (e) {
      return 'Error validating phone number: $e';
    }
  }
}

在这个示例中,我们创建了一个简单的表单,用于输入国家代码和电话号码。validatePhoneNumber函数用于验证电话号码是否有效。它使用PhoneNumberUtil来解析和格式化电话号码,并检查其有效性。

注意:

  1. 你需要确保输入的国家代码和电话号码是有效的,并且格式正确。
  2. 示例中的PhoneNumberUtilcountry_phone_validator插件提供的工具类,用于处理电话号码的解析和验证。

这个示例展示了如何在Flutter应用中使用country_phone_validator插件进行国家电话验证。你可以根据需要进行进一步的自定义和扩展。

回到顶部