Phone Country Picker

A flutter package for showing a phone country selector. In addition it gives the possibility to select a list of favorites countries, as well as to search using a simple searchbox and it's supports i18n for 2 languages are english and vietnamese.


Platform Pub Package Build Status
Latest compatibility result for Stable channel Latest compatibility result for Beta channel Latest compatibility result for Dev channel


Table of contents

Installing

1. Depend on it

Add this to your package's pubspec.yaml file:

dependencies:
    phone_country_picker: ^1.0.2

2. Install it

You can install packages from the command line:

with pub:

$ pub get

with Flutter:

$ flutter pub get

3. Import it

Now in your Dart code, you can use:

import 'package:phone_country_picker/country_code_picker.dart';

Usage


@override
 Widget build(BuildContext context) => new Scaffold(
     body: Center(
       child: CountryCodePicker(
         onChanged: print,
         // Initial selection and favorite can be one of code ('IT') OR dial_code('+39')
         initialSelection: 'IT',
         favorite: ['+39','FR'],
         // optional. Shows only country name and flag
         showCountryOnly: false,
         // optional. Shows only country name and flag when popup is closed.
         showOnlyCountryWhenClosed: false,
         // optional. aligns the flag and the Text left
         alignLeft: false,
       ),
     ),
 );

Example:


void _onCountryChange(CountryCode countryCode) {
    //TODO : manipulate the selected phone country here
    print("New Country selected: " + countryCode.toString());
  }

i18n

Just add the CountryLocalizations.delegate in the list of your app delegates

 return new MaterialApp(
      supportedLocales: [
        Locale("en"),
        Locale("vi"),
      ],
      localizationsDelegates: [
        CountryLocalizations.delegate,
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
      ],

Customization

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

NameTypeDescription
onChangedValueChangedcallback invoked when the selection changes
onInitValueChangedcallback invoked during initialization of the widget
initialSelectionStringused to set the initial selected value
favoriteListused to populate the favorite country list
textStyleTextStyleTextStyle applied to the widget button
paddingEdgeInsetsGeometrythe padding applied to the button
showCountryOnlybooltrue if you want to see only the countries in the selection dialog
searchDecorationInputDecorationdecoration applied to the TextField search widget
searchStyleTextStylestyle applied to the TextField search widget text
emptySearchBuilderWidgetBuilderuse this to customize the widget used when the search returns 0 elements
builderFunction(CountryCode)use this to build a custom widget instead of the default FlatButton
enabledboolset to false to disable the widget
textOverflowTextOverflowthe button text overflow behaviour
dialogSizeSizethe size of the selection dialog
countryFilterListuses a list of strings to filter a sublist of countries
showOnlyCountryWhenClosedboolif true it'll show only the country
alignLeftboolaligns the flag and the Text to the left
showFlagboolshows the flag everywhere
showFlagMainboolshows the flag only when closed
showFlagDialogboolshows the flag only in dialog
flagWidthdoublethe width of the flags
flagDecorationDecorationused for styling the flags
comparatorComparatoruse this to sort the countries in the selection dialog
hideSearchboolif true the search feature will be disabled

Contributions

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

Libraries

country_code
country_codes
country_localizations
phone_country_picker
selection_dialog