Skip to content

CountryCodePicker

K M Rejowan Ahmmed edited this page May 13, 2024 · 2 revisions

CountryCodePicker

This is the regular composable, it can be used in any places, can be also attached to a TextField. This can be customized to show small sizes, or full screen based on the requirement.

Basic Usage

      var country by remember {
            mutableStateOf(Country.Argentina)
        }

        CountryCodePicker(
            modifier = Modifier.align(Alignment.CenterHorizontally),
            selectedCountry = country,
            onCountrySelected = { country = it },
            viewCustomization = ViewCustomization(
                showFlag = true,
                showCountryIso = false,
                showCountryName = false,
                showCountryCode = true,
                clipToFull = false
            ),
            pickerCustomization = PickerCustomization(
                showFlag = false,
            ),
            showSheet = true,
        )

Demo

Shot1

Constructor

@Composable
fun CountryCodePicker(
    modifier: Modifier = Modifier,
    selectedCountry: Country = Country.Bangladesh,
    countryList: List<Country> = Country.getAllCountries(),
    onCountrySelected: (Country) -> Unit,
    viewCustomization: ViewCustomization = ViewCustomization(),
    pickerCustomization: PickerCustomization = PickerCustomization(),
    backgroundColor: Color = MaterialTheme.colorScheme.background,
    textStyle: TextStyle = TextStyle(),
    showSheet: Boolean = false,
    itemPadding: Int = 10,
)

Others

You can learn about the viewCustomization and pickerCustomization from the Utils