Skip to content

Phone number Flutter widget that supports validation, contact picker and country code

License

Notifications You must be signed in to change notification settings

WahidNasri/extended_phone_number_input

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

A Highly customizable Phone input Flutter widget that supports country code, validation and contact picker.

Features

  • Phone number with international validation
  • Include only specific countries
  • Exclude specific countries
  • Set a phone number using a controller (Selected country will be updated automatically)
  • Pick a phone number from contacts list

Getting started

Install the package extended_phone_number_input:

flutter pub add extended_phone_number_input

If you target Android 11+ (API 30+) and want to use the build-in contact picker you need to add the android.permission.READ_CONTACTS permission on the AndroidManifest.xml as this permission will be requested automatically.

Usage

A full and rich example can be found in /example folder.

Simple usage

 PhoneNumberInput(initialCountry: 'SA', locale: 'ar')

Show countries as dialog (default is bottom sheet)

 const PhoneNumberInput(
    initialCountry: 'US',
    locale: 'en',
    countryListMode: CountryListMode.dialog,
    contactsPickerPosition: ContactsPickerPosition.suffix,
    )

Custom borders

 PhoneNumberInput(
    initialCountry: 'TN',
    locale: 'fr',
    countryListMode: CountryListMode.dialog,
    contactsPickerPosition: ContactsPickerPosition.suffix,
    enabledBorder: OutlineInputBorder(
    borderRadius: BorderRadius.circular(10),
    borderSide: const BorderSide(color: Colors.purple)),
    focusedBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(10),
        borderSide: const BorderSide(color: Colors.purple))
    )

Select Phone number programmatically

To be able to select a phone number programmatically, we first need to define a PhoneInputController :

PhoneInputController _controller = PhoneInputController(context);
 PhoneNumberInput(
     controller: _controller
    ...

Select the desired phone number:

_controller.phoneNumber = '+1-....'

Note:

If you want to set the phone number from contact, The widget already support this feature without the need to use the controller.

About

Phone number Flutter widget that supports validation, contact picker and country code

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published