phone_util

This package helps you to build a phone input field with easy steps, you can change the country and separate the country box style as you want and the phone input field as you want. you can add empty space between the country and phone field.

installation

you can manually add phone_util into the dependencies section in your pubspec.yaml:

  dependencies:
    phone_util: ^replace-with-latest-version

Or you can use the command to add phone_util as a dependency with the latest stable version:

  dart pub phone_util 

Country box type

• Dialog

  countryBoxType : PhoneInputSelectorType.DIALOG, 

• Bottom sheet

  countryBoxType : PhoneInputSelectorType.BOTTOM_SHEET, 

Required Parameters

Parameter	Type	Description
onInputChanged	Function( PhoneNumber value )	To get every number input
countryDecoration	CountryBox	To add style to the country box

Example

import 'package:phone_util/view/phone_util.dart';

PhoneUtil(
  onInputChanged: (PhoneNumber value) {},
  countryBoxType: PhoneInputSelectorType.BOTTOM_SHEET,
  separatedWidth: 12,
  inputDecoration: InputDecoration(
    fillColor: Colors.white10,
    filled: true,
    enabledBorder: OutlineInputBorder(
      borderRadius: BorderRadius.circular(8),
      borderSide: const BorderSide(
        color: Colors.white,
      ),
    ),
    focusedBorder: OutlineInputBorder(
      borderRadius: BorderRadius.circular(8),
      borderSide: const BorderSide(
        color: Colors.white,
      ),
    ),
    errorBorder: OutlineInputBorder(
      borderRadius: BorderRadius.circular(8),
      borderSide: const BorderSide(
        color: Colors.red,
      ),
    ),
    contentPadding: const EdgeInsets.symmetric(
      horizontal: 12,
      vertical: 18,
    ),
  ),
  countryDecoration: CountryBox(),
)

Authors

• Github : @AbdAlftahSalem

• LinkedIn : Abd Alftah Salem