intl_phone_number_input 0.2.1

  • Readme
  • Changelog
  • Example
  • Installing
  • 95

Intl Phone Number Input #

A simple and customizable flutter package for international phone number input

What's new #

* As You Type Formatter: The Package now formats the input to it's selected national format
* You can now disable input formatting by setting inputFormat to false
* Replaced TextField with 
* AutoValidate
* TextStyle
* onInputChanged now returns a new PhoneNumber Model
* You can create a PhoneNumber object from PhoneNumber.getRegionInfoFromPhoneNumber(String phoneNumber, [String isoCode]); 
* You can now parse phoneNumber by calling   PhoneNumber.getParsableNumber(String phoneNumber, String isoCode) or `PhoneNumber Reference`.parseNumber()
* Custom list of countries e.g. ['NG', 'GH', 'BJ' 'TG', 'CI']

    String phoneNumber =  '+234 500 500 5005';
    PhoneNumber number = await PhoneNumber.getRegionInfoFromPhoneNumber(phoneNumber);
    String parsableNumber = number.parseNumber();
    `controller reference`.text = parsableNumber

Note #

    PhoneNumber.getRegionInfoFromPhoneNumber(String phoneNumber, [String isoCode])

Could throw an Exception if the phoneNumber isn't recognised its a good pattern to pass the country's isoCode or have '+' at the beginning of the string

Usage #

Constructors #

s/nConstructor
1InternationalPhoneNumberInput
2InternationalPhoneNumberInput.withCustomDecoration
3InternationalPhoneNumberInput.withCustomBorder

Available Parameters #

InternationalPhoneNumberInput({
    Key key,
    @required this.onInputChanged,
    this.onInputValidated,
    this.focusNode,
    this.textFieldController,
    this.onSubmit,
    this.keyboardAction,
    this.countries,
    this.textStyle,
    this.inputBorder,
    this.inputDecoration,
    this.initialCountry2LetterCode = 'NG',
    this.hintText = 'Phone Number',
    this.autoValidate = false,
    this.formatInput = true,
    this.errorMessage = 'Invalid phone number',
    });
ParameterDatatypeInitial ValueDefault [1]Decoration [2]CustomBorder [3]
onInputChangefunction(PhoneNumber)null✔️✔️✔️
onInputValidatedfunction(string)null✔️✔️✔️
focusNodeFocusNodenull✔️✔️✔️
textFieldControllerTextEditingControllerTextEditingController()✔️✔️✔️
onSubmitFunction()null✔️✔️✔️
keyboardActionTextInputActionnull✔️✔️✔️
countriesListnull✔️✔️✔️
textStyleTextStylenull✔️✔️✔️
inputBorderInputBordernull✔️✔️
inputDecorationInputDecorationnull✔️✔️
initialCountry2LetterCodeStringNG✔️✔️✔️
hintTextStringPhone Number✔️✔️
autoValidatebooleantrue✔️✔️✔️
formatInputbooleantrue✔️✔️✔️
errorMessageStringInvalid phone number✔️✔️

Contributions #

If you encounter any problem or the library is missing a feature feel free to open an issue. Feel free to fork, improve the package and make pull request.

Dependencies #

Credits #

A special thanks to niinyarko

[0.2.1]

  • Bug fixes
  • Improvement for reliability

[0.2.0]

  • As You Type Formatter: The Package now formats the input to it's selected national format
  • You can now disable input formatting by setting inputFormat to false
  • Replaced TextField with
  • AutoValidate
  • TextStyle

[0.1.3]

  • onInputChanged now returns a new PhoneNumber Model
  • You can create a PhoneNumber object from PhoneNumber.getRegionInfoFromPhoneNumber(String phoneNumber, [String isoCode]);
  • You can now parse phoneNumber by calling PhoneNumber.getParsableNumber(String phoneNumber, String isoCode) or PhoneNumber Reference.parseNumber()

[0.1.2+2]

  • Bug fixed

[0.1.2]

  • TextField now formats whenever TextEditingController Text is changed

[0.1.1]

  • Added TextEditingController
  • Added KeyboardActionType
  • Added callback that listens to keyboard action

[0.1.0]

  • Minor bug fixed
  • What's new #

    • Added focus node
    • Custom list of countries e.g. ['NG', 'GH', 'BJ' 'TG', 'CI']
    • Country Flag and Logo now formatted

[0.0.10]

  • Minor changes to the source file

[0.0.9]

  • Critical bug fixed caused by changing source files and packages

[0.0.8]

  • Minor changes to the source file
  • Added example
  • Updated README.md
  • Added examples to README.md

[0.0.7]

  • Critical bug fixed
  • Updated README.md

[0.0.6]

  • Updated README.md
  • Fixed issues with text input not validating
  • Fixed issues with text input not parsing

[0.0.5]

  • Critical bug fixed
  • Removed example
  • Fixed countries.json assets not loading

[0.0.4]

  • Critical bug fixed
  • Fixed image assets not loading

[0.0.3]

  • Critical bug fixed
  • Added examples
  • Fixed image assets not loading

[0.0.2]

  • Critical bug fixed
  • Updated README.md

[0.0.1]

Initial project release #
  • Updated README.md
  • Added support for custom input decoration
  • Added support for custom input border

example/README.md


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

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
          appBar: AppBar(title: Text('Demo')),
          body: MyHomePage()),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<FormState> formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
//    getPhoneNumber('234 708 228 6079');
    return Form(
      key: formKey,
      child: Container(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            InternationalPhoneNumberInput(
              onInputChanged: (PhoneNumber number) {
                print(number.phoneNumber);
              },
              isEnabled: true,
              autoValidate: true,
              formatInput: true,
            ),
            SizedBox(
              height: 20.0,
            ),
            InternationalPhoneNumberInput.withCustomBorder(
              onInputChanged: (PhoneNumber number) {
                print(number.phoneNumber);
              },
              isEnabled: true,
              autoValidate: true,
              formatInput: true,
              hintText: 'Invalid phone number',
              inputBorder: OutlineInputBorder(),
              onInputValidated: (bool value) {
                print(value);
              },
            ),
            SizedBox(
              height: 20.0,
            ),
            InternationalPhoneNumberInput.withCustomDecoration(
              onInputChanged: (PhoneNumber number) {
                print(number.phoneNumber);
              },
              isEnabled: true,
              autoValidate: true,
              formatInput: true,
              inputDecoration: InputDecoration(border: UnderlineInputBorder()),
              onInputValidated: (bool value) {
                print(value);
              },
            ),
            RaisedButton(
              onPressed: () {
                formKey.currentState.validate();
              },
              child: Text('Validate'),
            )
          ],
        ),
      ),
    );
  }

  void getPhoneNumber(String phoneNumber) async {
    PhoneNumber number =
        await PhoneNumber.getRegionInfoFromPhoneNumber(phoneNumber);
    String parsableNumber = number.parseNumber();

    print(parsableNumber);
  }
}

Use this package as a library

1. Depend on it

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


dependencies:
  intl_phone_number_input: ^0.2.1

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:intl_phone_number_input/intl_phone_number_input.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
90
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
95
Learn more about scoring.

We analyzed this package on Jan 21, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.0
  • pana: 0.13.4
  • Flutter: 1.12.13+hotfix.5

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
flutter 0.0.0
libphonenumber ^1.0.1 1.0.1
provider ^4.0.1 4.0.2
Transitive dependencies
built_collection 4.3.2
built_value 7.0.8
collection 1.14.11 1.14.12
fixnum 0.10.11
matcher 0.12.6
meta 1.1.8
nested 0.0.4
path 1.6.4
quiver 2.1.2+1
sky_engine 0.0.99
stack_trace 1.9.3
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test