international_phone_input

Visão geral do pacote

Orientação gerada a partir de informações públicas. Apenas para referência.

Um pacote Flutter para lidar com entrada de números de telefone internacionais com validação integrada usando a biblioteca libphonenumber. Ele fornece uma interface amigável para digitar e formatar números de telefone de acordo com os padrões específicos de cada país, garantindo coleta precisa de dados entre usuários globais. O pacote detecta automaticamente o país com base na entrada ou em um padrão selecionado, aplica formatação adequada e valida o número inserido em tempo real.

Casos de uso

Registro de usuário global
Formulários de contato internacionais
Fluxos de trabalho de verificação de número de telefone
Aplicações móveis multi-região
Processos de checkout de comércio eletrônico

Principais recursos

Validação em tempo real de número de telefone
Detecção automática de código do país
Entrada formatada com mascaramento
Suporta todos os principais países
Integração com libphonenumber

Indicado para

Aplicativos direcionados para públicos internacionais
Formulários que exigem números de telefone válidos
Desenvolvedores que precisam de validação de entrada robusta
Projetos usando internacionalização
Aplicações com necessidades de conformidade

Considerações

Requer internet para consulta completa do banco de dados de países
Pode aumentar o tamanho do aplicativo devido à dependência do libphonenumber
Personalização limitada de componentes da interface
Sem suporte a validação offline
Dependente de atualizações da biblioteca externa

README original

Snapshot do README original do repositório-fonte vinculado. Consulte o repositório para o conteúdo mais recente.

International Phone Number Input For Flutter

Usage

Just put the component in your application.

import 'package:international_phone_input/international_phone_input.dart';

String phoneNumber;
String phoneIsoCode;

void onPhoneNumberChange(String number, String internationalizedPhoneNumber, String isoCode) {
    setState(() {
       phoneNumber = number;
       phoneIsoCode = isoCode;
    });
}

// Default Widget with dropdown list
@override
 Widget build(BuildContext context) => Scaffold(
     body: Center(
       child: InternationalPhoneInput(
          onPhoneNumberChange: onPhoneNumberChange, 
          initialPhoneNumber: phoneNumber,
          initialSelection: phoneIsoCode,
          enabledCountries: ['+233', '+1']
       ),
     ),
 );

// Widget with text input only

 onValidPhoneNumber(
      String number, String internationalizedPhoneNumber, String isoCode) {
    setState(() {
      confirmedNumber = internationalizedPhoneNumber;
    });
  }

@override
 Widget build(BuildContext context) => Scaffold(
     body: Center(
       child:  InternationalPhoneInputText(
         onValidPhoneNumber: onValidPhoneNumber,
        ),
     ),
 );

// Widget with decoration
// Using decoration overwrites other styles such as hintStyle, hintText, etc.

@override
 Widget build(BuildContext context) => Scaffold(
     body: Center(
       child: InternationalPhoneInput(
          decoration: InputDecoration.collapsed(hintText: '(416) 123-4567'),
          onPhoneNumberChange: onPhoneNumberChange, 
          initialPhoneNumber: phoneNumber,
          initialSelection: phoneIsoCode,
          enabledCountries: ['+233', '+1'],
          showCountryCodes: false
       ),
     ),
 );

Customization

Here is a list of properties available to customize the widget:

Name	Type	Description
initialPhoneNumber	String	used to set initial phone number
initialSelection	String	used to set initial country code
errorText	String	use this to set an error message
hintText	String	sets hint
labelText	String	sets label
errorStyle	TextStyle	style applied to error message
hintStyle	TextStyle	style applied to hint
labelStyle	TextStyle	style applied to label
errorMaxLines	int	the maximum number of lines user can type
enabledCountries	List	the list of enabled countries to display
decoration	InputDecoration	decoration applied to the TextField widget
showCountryCodes	bool	shows the country code (default true)
showCountryFlags	bool	shows. the country flags (default true)
dropdownIcon	Widget	use this to customize dropdown icon

Contributions

Contributions of any kind are more than welcome! Feel free to fork and improve international_phone_input in any way you want, make a pull request, or open an issue.

Buscar pacotes, repositórios e categorias de apps