Skip to content

ThickLine/pick_country_picker

Repository files navigation

CountryPickerModal

A highly customizable modal widget for Flutter that allows users to pick a country from a list. This package is designed for ease of use and extensive customization, supporting both Material and Cupertino modal styles, custom list items, search functionality, and more.

Features

  • Customization: Override the default list of countries, prioritize countries, and use custom widgets for search fields, country list items, and selection icons.
  • Material and Cupertino Support: Choose between Material or Cupertino modal styles to match your app's design.
  • Search Functionality: Includes a search bar to quickly find countries by name.
  • Custom List Items: Customize the appearance of country list items with a builder function.
  • Selection Feedback: Display a custom icon next to the selected country.

Installation

  1. Depend on it Add this to your package's pubspec.yaml file:
 pick_country_picker: ^3.0.0
  1. Install it You can install packages from the command line:

with pub:

$ pub get with Flutter:

$ flutter pub get
  1. Import it Now in your Dart code, you can use:
import 'package:pick_country_picker/pick_country_picker.dart';

Usage

To show the country picker modal, create a CountryPickerModal widget:

import 'package:flutter/material.dart';
import 'package:pick_country_picker/pick_country_picker.dart';

void _showCountryPicker(BuildContext context) {
  showModalBottomSheet(
    context: context,
    builder: (BuildContext context) {
      return CountryPickerModal(
        onCountryChanged: (Country country) {
          // Handle country selection
          print("Selected country: ${country.countryName}");
        },
      );
    },
  );
}

Customization

Customize the country picker modal by setting its properties:

CountryPickerModal(
  onCountryChanged: (Country country) {},
  selectedCountryCode: 'US',
  title: 'Select Your Country',
  priorityCountryCodes: ['US', 'CA'],
  countryListItemBuilder: (Country country) {
    return ListTile(
      title: Text(country.countryName),
      leading: Image.asset(country.flagUri),
    );
  },
  selectedIcon: Icon(Icons.check_circle, color: Colors.green),
  overrideCountryCodes: ['US', 'CA', 'GB'],
  excludedCountryCodes: ['AX', 'USA', 'MX'],
  hideSearch: false,
  hideCloseIcon: false,
  backButton: Icon(Icons.arrow_back),
  borderRadius: BorderRadius.only(
    topLeft: Radius.circular(20),
    topRight: Radius.circular(20),
  ),
   borderBuilder: (Country country) {
            return Border.all(
              color: Colors.grey[400]!,
              width: 0.5,
     );
 },
  useCupertinoModal: false,
)

Get Country

To programmatically retrieve country information, you can utilize the following helper function:

Get Country by ISO Code

To retrieve a country programmatically based on its ISO code, you can use the getCountryByIsoCode function. This function searches through a list of country objects and returns the one that matches the given ISO code. If no match is found, it returns null.

 Country? getCountryByIsoCode(String isoCode);

Fetch a Country by Its Country Code

For retrieving a country using its country code, the getCountryByCountryCode function is provided. Similar to getCountryByIsoCode, this function scans a list of country objects, finding and returning the one that matches the given country code. In cases where no country is found with the specified code, null is returned.

Country? getCountryByCountryCode(String countryCode)

Fetch a Country by Its Name

To find a country based on its name, you can use the getCountryByName function. This function searches through a list of country objects, returning the one whose countryName matches the provided name. If the search yields no results, the function returns null.

Country? getCountryByName(String countryName)

Usage Example:

final _pickCountryLookupService = PickCountryLookupService();

Country? c= _pickCountryLookupService.getCountryByIsoCode("uk");

Example

Picker-usage.mp4

With search:

Picker-with-search Medium

Without search:

Picker-without-search Medium

Build your own:

Picker-build-your-own Medium

An example application demonstrating the usage of CountryPickerModal is included in the example directory of the package.

For more information and additional customization options, please refer to the package documentation.

About

Flutter Package for Country Code Selection

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages