Country Code Picker Library

Country Code Picker (CCP) <img src="release/color.png" width="80"> is an android library which provides an easy way to search and select country phone code for the telephone number.

Introduction

• CCP gives professional touch to your well designed form like login screen, sign up screen, edit profile screen. CCP removes confusion about how to add number and thus make view more understandable. Finally reduces mistakes in user input.

• Phone number screen without CCP

  • <img src="release/img_c.png" width="300">

• Above view can be transformed by using CCP

  • <img src="release/image_d.jpeg" width="300">

• Tapping on CCP will open a dialog to search and select country

  • <img src="release/dialog_color.png" width="300">

The most recommended usage for CCP is using the default setting so the library will auto check the all the value. To do that, you need to follow the following steps:

1. Add CCP view to layout
2. Add EditText view to layout
3. register the EditText using registerPhoneNumberTextView(editText) we can also use TextView instead of editText.
4. Let the magic happens ;)

Here the more details steps:

1. Add CCP to layout using the following:

   <com.rilixtech.widget.countrycodepicker.CountryCodePicker
         android:id="@+id/ccp"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content" />
   

2. Add EditText view to layout:

   <EditText
          android:id="@+id/phone_number_edt"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:hint="phone"
          android:inputType="phone"/>
   

3. register the EditText with code:

   CountryCodePicker ccp;
   AppCompatEditText edtPhoneNumber;
   
   ...
   
   ccp = (CountryCodePicker) findViewById(R.id.ccp);
   edtPhoneNumber = findViewById(R.id.phone_number_edt);
   
   ...
   
   ccp.registerPhoneNumberTextView(edtPhoneNumber);
   

4. Now look at the magic ;)

you can check validity of phone number using isValid() method.

How to add to your project

1. Add jitpack.io to your root build.gradle file:

   allprojects {
       repositories {
           jcenter()
           maven { url "https://jitpack.io" }
       }
   }
   

2. Add library to your app build.gradle file then sync

   dependencies {
       implementation 'com.github.joielechong:countrycodepicker:2.4.2'
   }
   

3. Add ccp view to xml layout

   <com.rilixtech.widget.countrycodepicker.CountryCodePicker
         android:id="@+id/ccp"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content" />
   

4. Add ccp object in Activity / Fragment

   CountryCodePicker ccp;
   

5. Bind ccp from layout

   ccp = (CountryCodePicker) findViewById(R.id.ccp);
   

6. That's it. Run the project and see the results.

For DexGuard users

If your project is obfuscated with DexGuard you may need to add the following line to the DexGuard configuration:

  -keepresourcefiles assets/io/michaelrocks/libphonenumber/android/**

This is because this library use libphonenumber-android

Attributes

Here the attributes that can be used in CountryCodePicker layout:

| Attribute | method | Description |---------------|---------------------------------|------------------------------- |ccp_defaultCode | setDefaultCountryUsingPhoneCodeAndApply(int defaultCode) | set selected Flag and phone in CCP by phone code. |ccp_showFullName| showFullName(boolean show) | Show full name of country in CCP. Default is false| |ccp_hideNameCode| hideNameCode(boolean hide) | Hide the country name code. Default is false| |ccp_hidePhoneCode| hidePhoneCode(boolean hide)| Hide the phone code. Default is false|

TBD.

Features

If you prefer experience along with only reads, an demo android app is available that demonstrates all the features of this library. Click below button to download from Playstore. <br/><a href="https://play.google.com/store/apps/details?id=com.rilixtech.countrycodepicker"><img src="http://www.android.com/images/brand/get_it_on_play_logo_large.png"/></a>

If you just want to read them, here you go:

1. Default country

• Default country is the country where most of your target audience belong.

• The default country can be set through xml layout and programmatically as well.

  A. Through xml

  Using country code name

  Add app:ccp_defaultNameCode="US" (replace "US" with your default country name code) to xml layout. Refer <a href="https://goo.gl/FQjUjA">List of countries</a> for name codes.

  <com.rilixtech.widget.countrycodepicker.CountryCodePicker
         android:id="@+id/ccp"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         app:ccp_defaultNameCode="US"  />
  

  Using phone code

  • add app:ccp_defaultCode="81" (replace 81 with your default country code) to xml layout.Refer <a href="https://goo.gl/FQjUjA">List of countries</a> for country codes.

  • Setting default country using phone code is not recommended. There are few cases where more than one countries have same phone code. Say US and Canada have +1. Putting '1' will result in Canada even if you were intended for US. Use app:cpp_defaultNameCode or app:cpp_countryPreference to overcome issue.

    <com.rilixtech.widget.countrycodepicker.CountryCodePicker
          android:id="@+id/ccp"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          app:ccp_defaultCode="81" />
    

    app:ccp_defaultNameCode has higher priority than app:ccp_defaultCode.

  B. Programmatically

  Using country name code

  Use setDefaultCountryUsingNameCode() method.

  Using phone code

  • To set default country programmatically, use setDefaultCountryUsingPhoneCode() method.

  • setDefaultCountryUsingNameCode() or setDefaultCountryUsingPhoneCode() will not set default country as selected country in CCP view. To set default country as selected country in CCP view, call resetToDefaultCountry() method.

  • resetToDefaultCountry() will set default country as selected country in CCP, it can be used at the time of form reset.

  • If you do not specify default country from xml, ID +91 (Indonesia) will be the default country until you update default country programmatically.

2. Choose and set country

Choosing and setting country will update selected country in CCP view.

Choose Country

1. In order to choose country, click on CCP view.
2. Then search country by country name or phone code or name code in dialog.
3. Click on county from list to choose

Set country programmatically

Using country code name
Country in CCP can be using setCountryForNameCode() method.

Using phone code

• Country in CCP can be using setCountryForCode() method.
• If specified country code / name code does not match with any country, default country will be set in to CCP.

How to listen change in selection? To get call back when country is changed, you need to add OnCountryChangeListener from code.

ccp.setOnCountryChangeListener(new CountryCodePicker.OnCountryChangeListener() {
 	 @Override
 	 public void onCountrySelected(Country selectedCountry) {
 	     Toast.makeText(getContext(), "Updated " + selectedCountry.getName(), Toast.LENGTH_SHORT).show();
      }
 });

3. Country preference

• Library has list of countries in alphabetical order. It searches for country in same order. But preferred country/countries have higher priority than rest.

• There are few cases where more than one countries have same code. For example, Canada, Puerto Rico and US have +1. When lilbrary will try to find country with +1, it will always pick Canada as it's alphabetically first in (1)Canada-(2)Puerto Rico-(3)US.

• If US is set in country preference, order for search will be (1)US-(2)Canada-(3)Puerto Rico, so it will pick US for +1.

• Countries of preference will be listed at top in selection dialog. It is helpful when target audience is from a set of countries.

• Any number of countries can be set in preference.

• Set through xml

  Add app:ccp_countryPreference="US,ID,NZ" (replace "US,ID,NZ" with your preference) to xml layout. Refer <a href="https://goo.gl/FQjUjA">List of countries</a> for name codes.

  <com.rilixtech.widget.countrycodepicker.CountryCodePicker
            android:id="@+id/ccp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:ccp_countryPreference="US,ID,NZ"  />
  

• Programmatically

  Use setCountryPreference() method.

4. Read selected country

Country's 3 properties (Country name, phone code and name code) can be read individually.

• Read selected country phone code

  • To get selected country code as String type and without prefix “+”, use getSelectedCountryCode(); method. => “91”
  • To get selected country code as String type and with prefix “+”, use getSelectedCountryCodeWithPlus(); method. => “+91”
  • To get selected country code as int (Integer) type, use ` getSel