flutter_country_extensions 1.0.3
flutter_country_extensions: ^1.0.3 copied to clipboard
A comprehensive Flutter toolkit featuring country & city pickers, custom UI widgets, responsive utilities, and daily developer extensions.
example/lib/main.dart
import 'package:flutter/material.dart';
import 'package:flutter_country_extensions/flutter_country_extensions.dart';
void main() {
runApp(const ExampleApp());
}
class ExampleApp extends StatelessWidget {
const ExampleApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'flutter_country_extensions Example',
debugShowCheckedModeBanner: false,
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(
seedColor: const Color(0xFF6C63FF),
brightness: Brightness.light,
),
useMaterial3: true,
),
home: const ExampleHomeScreen(),
);
}
}
class ExampleHomeScreen extends StatefulWidget {
const ExampleHomeScreen({super.key});
@override
State<ExampleHomeScreen> createState() => _ExampleHomeScreenState();
}
class _ExampleHomeScreenState extends State<ExampleHomeScreen> {
Country? _selectedCountry;
String? _selectedCity;
String _phoneNumber = '';
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Country & City Extensions Demo'),
centerTitle: true,
elevation: 1,
),
body: SingleChildScrollView(
padding: const EdgeInsets.all(20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Section 1: Country Dropdown
const Text(
'1. Select Country',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
),
10.h,
CountryDropdown(
selectedCountry: _selectedCountry,
showPrefixIcon: false,
onChanged: (country) {
setState(() {
_selectedCountry = country;
_selectedCity = null; // Reset city on country change
});
},
),
20.h,
// Section 2: City Dropdown (Filtered by Country)
const Text(
'2. Select City (Filtered by selected country)',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
),
10.h,
CityDropdown(
country: _selectedCountry,
selectedCity: _selectedCity,
showPrefixIcon: false,
onChanged: (city) {
setState(() => _selectedCity = city);
},
),
20.h,
// Section 3: Country Phone Field
const Text(
'3. Country Phone Field',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
),
10.h,
CountryPhoneField(
selectedCountry: _selectedCountry,
onPhoneChanged: (fullPhone, rawNumber, dialCode) {
setState(() => _phoneNumber = fullPhone);
},
),
30.h,
// Section 4: Live Info Card
if (_selectedCountry != null || _selectedCity != null) ...[
Container(
width: double.infinity,
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.blue.withValues(alpha: 0.08),
borderRadius: BorderRadius.circular(12),
border: Border.all(color: Colors.blue.withValues(alpha: 0.2)),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const Text(
'Selection Details:',
style:
TextStyle(fontWeight: FontWeight.bold, fontSize: 15),
),
8.h,
if (_selectedCountry != null)
Text(
'Country: ${_selectedCountry!.flag} ${_selectedCountry!.name} (${_selectedCountry!.dialCode})'),
if (_selectedCity != null) Text('City: $_selectedCity'),
if (_phoneNumber.isNotEmpty) Text('Phone: $_phoneNumber'),
8.h,
// Extension Demo
if (_selectedCity != null)
Text(
'Is "$_selectedCity" in Pakistan? ${_selectedCity!.isCityOf('PK')}',
style: const TextStyle(
fontStyle: FontStyle.italic, color: Colors.indigo),
),
],
),
),
],
30.h,
// Section 5: Composite All-in-One Picker
const Text(
'4. Composite All-in-One Picker',
style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
),
10.h,
CountryCityPhonePicker(
showCountry: true,
showCity: true,
showPhone: true,
onChanged: (country, city, phone) {
// Handle composite form changes
},
),
],
),
),
);
}
}