country_search 2.7.0 copy "country_search: ^2.7.0" to clipboard
country_search: ^2.7.0 copied to clipboard

The Fastest, Most Customizable Country Picker for Flutter.

country_search 🚀 #

The Fastest, Most Customizable Country Picker for Flutter

Pub License Flutter

🌐 Live Demo: View on GitHub Pages

Country Picker Demo

  • 🌍 252+ Countries - Complete ISO 3166-1 standard with flags, codes & phone numbers
  • ⚡ Blazing Fast - Search in 110Ξs, optimized for weak devices
  • ðŸŽĻ Fully Customizable - Colors, sizes, styles, themes - you name it!
  • 🌐 19 Languages - Automatic localization with fallback
  • ðŸ§Đ Zero Config - Works out of the box, just 1 line of code
  • ðŸ“ą Responsive - Perfect on mobile, tablet & desktop

🚀 Quick Start #

import 'package:country_search/country_search.dart';

CountryPicker(
  selectedCountry: selectedCountry,
  onCountrySelected: (Country country) {
    setState(() {
      selectedCountry = country;
    });
  },
)

That's it! Your country picker is ready to use. 🎉

📊 Performance Metrics #

Metric Value
Package Size ~113KB (19 languages)
Search Speed ~110 microseconds
Countries 252 (ISO 3166-1 compliant)
Languages 19 supported
Memory Optimized for weak devices

ðŸŽĻ Features #

🌍 Complete Country Coverage #

  • 252 countries with ISO 3166-1 compliance
  • Flag emojis for every country
  • Phone codes with international format
  • Country codes (US, DE, RU, etc.)
  • Fuzzy search - find countries even with typos
  • Multi-field search - by name, code, or phone
  • Instant results - 110Ξs per query
  • Real-time filtering - as you type

ðŸŽĻ Advanced Customization #

CountryPicker(
  // Colors
  backgroundColor: Colors.white,
  textColor: Colors.black87,
  accentColor: Colors.blue,
  
  // Sizes & Styles
  textStyle: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
  itemHeight: 72.0,
  flagSize: 28.0,
  
  // Visibility
  showFlags: true,
  showCountryCodes: true,
  showPhoneCodes: true,
)

🌓 Theme Support #

  • Dark theme - Beautiful default dark design
  • Light theme - Clean light appearance
  • Custom themes - Any color combination
  • Responsive - Adapts to any screen size

ðŸ“ą Screenshots #

Dark Theme Chinese Language

🛠ïļ Installation #

Add to your pubspec.yaml:

dependencies:
  country_search: ^2.6.6

ðŸ§Đ Usage Examples #

Basic Implementation #

CountryPicker(
  selectedCountry: selectedCountry,
  onCountrySelected: (Country country) {
    setState(() {
      selectedCountry = country;
    });
  },
)

Custom Labels #

CountryPicker(
  selectedCountry: selectedCountry,
  onCountrySelected: (Country country) {
    setState(() {
      selectedCountry = country;
    });
  },
  labelText: "Select your country",
  hintText: "Search countries...",
)

Display Country Name #

// Get localized country name
Text(country.getDisplayName(context))

Custom Theme #

CountryPicker(
  selectedCountry: selectedCountry,
  onCountrySelected: (Country country) {
    setState(() {
      selectedCountry = country;
    });
  },
  // Purple theme
  backgroundColor: Colors.purple.shade50,
  accentColor: Colors.purple,
  textStyle: const TextStyle(
    fontSize: 16,
    fontWeight: FontWeight.w600,
    color: Colors.purple,
  ),
  itemHeight: 72.0,
  flagSize: 28.0,
)

Minimal Theme #

CountryPicker(
  selectedCountry: selectedCountry,
  onCountrySelected: (Country country) {
    setState(() {
      selectedCountry = country;
    });
  },
  // Minimal design
  backgroundColor: Colors.grey.shade50,
  textColor: Colors.grey.shade800,
  textStyle: const TextStyle(fontSize: 12),
  itemHeight: 44.0,
  flagSize: 16.0,
  showCountryCodes: false,
)

🌐 Multi-language Support #

The widget automatically detects your app's language. Add localization delegates:

MaterialApp(
  locale: const Locale('de'), // Your app's language
  localizationsDelegates: [
    CountryLocalizations.delegate, // Our country picker localization
    GlobalMaterialLocalizations.delegate,
    GlobalWidgetsLocalizations.delegate,
    GlobalCupertinoLocalizations.delegate,
  ],
  supportedLocales: [
    const Locale('en'),
    const Locale('de'),
    const Locale('ru'),
    // Add your languages
  ],
)

Supported Languages: 🇚ðŸ‡ļ English, 🇷🇚 Russian, 🇊ðŸ‡ļ Spanish, ðŸ‡Ŧ🇷 French, ðŸ‡Đ🇊 German, ðŸ‡ŪðŸ‡đ Italian, ðŸ‡ŊðŸ‡ĩ Japanese, 🇰🇷 Korean, ðŸ‡ĩðŸ‡đ Portuguese, ðŸ‡ĻðŸ‡ģ Chinese, ðŸ‡ļðŸ‡Ķ Arabic, ðŸ‡ŪðŸ‡ģ Hindi, ðŸ‡ŪðŸ‡Đ Indonesian, ðŸ‡ĩðŸ‡ą Polish, ðŸ‡đ🇷 Turkish, 🇚ðŸ‡Ķ Ukrainian, ðŸ‡ŧðŸ‡ģ Vietnamese, ðŸ‡đ🇭 Thai, ðŸ‡ģðŸ‡ą Dutch

🔍 Fuzzy Search Examples #

Find countries even with typos:

  • "germny" → finds "Germany"
  • "japn" → finds "Japan"
  • "united sttes" → finds "United States"
  • "russi" → finds "Russia"

📚 API Reference #

The Builder API provides a fluent interface for easy customization:

// Basic usage with Builder API
CountryPicker.builder()
    .selectedCountry(selectedCountry)
    .onCountrySelected((country) => setState(() => selectedCountry = country))
    .build();

// With pre-built themes
CountryPicker.builder()
    .selectedCountry(selectedCountry)
    .onCountrySelected((country) => setState(() => selectedCountry = country))
    .darkTheme()  // or .lightTheme(), .purpleTheme(), .minimalTheme()
    .build();

// Custom configuration
CountryPicker.builder()
    .selectedCountry(selectedCountry)
    .onCountrySelected((country) => setState(() => selectedCountry = country))
    .lightTheme()
    .itemHeight(72.0)
    .flagSize(28.0)
    .textStyle(const TextStyle(fontSize: 16, fontWeight: FontWeight.w600))
    .showCountryCodes(false)
    .build();

Pre-built Themes

Theme Description
.darkTheme() Dark theme with green accent
.lightTheme() Light theme with blue accent
.purpleTheme() Purple theme with purple accent
.minimalTheme() Compact design with minimal styling

Builder Methods

Method Description
.selectedCountry(Country?) Set selected country
.onCountrySelected(Function) Set selection callback
.labelText(String?) Set custom label
.hintText(String?) Set custom hint
.showPhoneCodes(bool) Show/hide phone codes
.backgroundColor(Color?) Set background color
.headerColor(Color?) Set header color
.textColor(Color?) Set text color
.accentColor(Color?) Set accent color
.searchFieldColor(Color?) Set search field color
.searchFieldBorderColor(Color?) Set search field border
.cursorColor(Color?) Set cursor color
.hintTextColor(Color?) Set hint text color
.hoverColor(Color?) Set hover color
.borderRadius(double?) Set border radius
.textStyle(TextStyle?) Set text style
.itemHeight(double?) Set item height
.itemPadding(EdgeInsets?) Set item padding
.flagSize(double?) Set flag size
.showFlags(bool) Show/hide flags
.showCountryCodes(bool) Show/hide country codes

Traditional API #

CountryPicker Properties #

Property Type Default Description
selectedCountry Country? null Currently selected country
onCountrySelected Function(Country) Required Selection callback
labelText String? null Custom label text
hintText String? null Custom hint text
showPhoneCodes bool true Show phone codes
backgroundColor Color? Dark theme Modal background
headerColor Color? Dark theme Header background
textColor Color? Dark theme Text color
accentColor Color? Green Accent color
searchFieldColor Color? Dark theme Search field background
searchFieldBorderColor Color? Dark theme Search field border
cursorColor Color? White Text cursor color
hintTextColor Color? Dark theme Hint text color
hoverColor Color? Dark theme Hover color
borderRadius double? 8.0 Border radius
textStyle TextStyle? 14px Custom text style
itemHeight double? 56.0 Item height
itemPadding EdgeInsets? 12x8 Item padding (horizontal: 12, vertical: 8)
flagSize double? 20.0 Flag size
showFlags bool true Show flags
showCountryCodes bool true Show country codes

Country Object #

class Country {
  final String code;      // "US", "DE", "RU"
  final String flag;      // "🇚ðŸ‡ļ", "ðŸ‡Đ🇊", "🇷🇚"
  final String phoneCode; // "+1", "+49", "+7"
  
  String getDisplayName(BuildContext context); // Get localized name
}

🚀 Performance Tips #

Remove Unused Languages #

To reduce package size, remove language files you don't need:

rm lib/src/flutter_country_picker/localizations/country_localizations_es.dart

Then update the localization files accordingly.

Optimize for Weak Devices #

CountryPicker(
  // Use smaller sizes for better performance
  itemHeight: 44.0,
  flagSize: 16.0,
  textStyle: const TextStyle(fontSize: 12),
)

ðŸŽŊ Use Cases #

  • User Registration - Country selection for new users
  • Phone Number Input - Country code selection
  • Language Settings - Country-based language detection
  • Shipping Address - Country selection for delivery
  • Analytics - Track user countries
  • Localization - Country-specific content

ðŸĪ Contributing #

We welcome contributions! Please feel free to submit a Pull Request.

📄 License #

MIT License - see LICENSE for details.

ðŸ‘Ļ‍ðŸ’ŧ Author #

Stanislav Bozhko
Email: [email protected]
GitHub: @stanislavworldin

☕ Support #

If this package helps you, consider buying me a coffee! ☕

ko-fi


⭐ Star this repository if you find it useful!

1
likes
0
points
53
downloads

Publisher

verified publisherworldin.net

Weekly Downloads

The Fastest, Most Customizable Country Picker for Flutter.

Repository (GitHub)
View/report issues

Topics

#flags #country #picker #search #selector

Documentation

Documentation

License

unknown (license)

Dependencies

flutter, flutter_localizations

More

Packages that depend on country_search