Flutter'da Intl Phone Number Input

Intl Phone Number Input, telefon numaralarının uluslararası şekilde girilmesini sağlayan ve Google'ın libphonenumber kullanan basit ve özelleştirilebilir bir Flutter paketidir.


Görsel Referansı


Özellikler

  • Web desteği.

  • RTL dilleri için dil desteği (sağdan sola yazma).

  • Açılır menü, alt sayfa ve iletişim kutusu.

  • Uluslararası biçime göre biçimlendirebilme.

  • PhoneNumber.getRegionInfoFromPhoneNumber ile bölge bilgisi alma.

  • PhoneNumber.getParsableNumber(String phoneNumber, String isoCode) veya PhoneNumber Reference.parseNumber() ile PhoneNumber'ın biçimlendirilebilmesi.

  • Ülkelerin özelleştirilebilir şekilde listelenebilmesi. ör. ['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


Yenilikler

  • country_list.dart'ta Dominik Cumhuriyeti'nin arama kodu düzeltildi.

  • initialValue widget'ta ayarlanırken gerçekleşen ülke değişikliği hatası düzeltildi.

  • PhoneNumberUtil.getNumberType hem mobil hem de web'de düzeltildi.

  • Türkçe ve Rumence için çeviriler eklendi.

  • Tayvan ülke adı güncellendi.

  • Stil yapılandırması eklendi.

  • prefixIcon modundaki yok sayma ve metin alanı aralığı düzeltildi.

  • formatInput false olduğunda sabit başlangıç değerinin biçimlendirilmeme hatası düzeltildi.


Web Desteği


Uygulama dizinine aşağıdaki kod satırlarını eklemek için web/index.html dosyasını düzenleyebilir veya GitHub'daki /example dosyasını ziyaret edebilirsiniz.

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <script src="assets/packages/libphonenumber_plugin/js/libphonenumber.js"></script>
    <script src="assets/packages/libphonenumber_plugin/js/stringbuffer.js"></script>
        <script src="main.dart.js" type="application/javascript"></script>
     </body>
</html>

Kullanılabilir Parametreler

InternationalPhoneNumberInput({
    Key key,this.selectorConfig = const SelectorConfig(),
      @required this.onInputChanged,
      this.onInputValidated,
      this.onSubmit,
      this.onFieldSubmitted,
      this.validator,
      this.onSaved,
      this.textFieldController,
      this.keyboardAction,
      this.keyboardType = TextInputType.phone,
      this.initialValue,
      this.hintText = 'Phone number',
      this.errorMessage = 'Invalid phone number',
      this.selectorButtonOnErrorPadding = 24,
      this.spaceBetweenSelectorAndTextField = 12,
      this.maxLength = 15,
      this.isEnabled = true,
      this.formatInput = true,
      this.autoFocus = false,
      this.autoFocusSearch = false,
      this.autoValidateMode = AutovalidateMode.disabled,
      this.ignoreBlank = false,
      this.countrySelectorScrollControlled = true,
      this.locale,
      this.textStyle,
      this.selectorTextStyle,
      this.inputBorder,
      this.inputDecoration,
      this.searchBoxDecoration,
      this.textAlign = TextAlign.start,
      this.textAlignVertical = TextAlignVertical.center,
      this.scrollPadding = const EdgeInsets.all(20.0),
      this.focusNode,
      this.cursorColor,
      this.autofillHints,
      this.countries
    });
    SelectorConfig({
    this.selectorType = PhoneInputSelectorType.DROPDOWN,
    this.showFlags = true,
    this.useEmoji = false,
    this.backgroundColor,
    this.countryComparator,
    this.setSelectorButtonAsPrefixIcon = false,
});

Kaynak: https://pub.dev/packages/intl_phone_number_input


#cross #flutter #phonenumberinput

0 yorum

Son Paylaşımlar

Hepsini Gör