Styling

One of the key things that separate this library from the rest is the ability to customise this view to match your app style with easy.

Creating the style

It's very simple to create a style for the library it is the same as it would have been while writing styles for default android widgets. To create a style open the styles.xml and a new style to it which we will later be applied to the library. Currently, only a few attributes are accepted. Below is an example of the style.

  <style name="CountryPickerStyle">
    <item name="android:textColor">@android:color/white</item>
    <item name="android:textColorHint">@android:color/white</item>
    <item name="android:background">#424242</item>
    <item name="android:drawable">@drawable/ic_dummy_icon</item>
  </style>

• Android:textColor
  • This property will be used to set the primary colour of the text of the search EditText and the list items.
• android:textColorHint
  • This property will be used to set the hint colour of the EditText and the tint of the search icon.
• android:background
  • This property will be used to set the background colour of the Dialog or the BottomSheet.
• android:drawable
  • This property will be used to replace the default search icon with any custom icon of your choice.

Applying the style

To apply a custom style to the library all you need to do is call style() on the builder and pass the style defined in styles.xml. Below is a snippet of how to apply the style.

CountryPicker.Builder builder =
        new CountryPicker.Builder().with(Context)
            .listener(OnCountryPickerListener).style(R.style.CountryPickerStyle);