international_phone_input

international_phone_input

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:

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.