flutter_country_state
A customizable Flutter package for all platforms that displays all countries with there respective states.
Example
Please run the app in the Example folder
Installation
- add the dependency to your pubspec.yaml file.
dependencies:
flutter:
sdk: flutter
flutter_country_state:
|
|
You can also change the style of the text of list of the country and states
-searchHint
-substringBackground
-subStringStyle
-style
-searchStyle
selectedCountryBackgroundColor
notSelectedCountryBackgroundColor
selectedStateBackgroundColor
notSelectedStateBackgroundColor
onSelectCountry
onSelectedState
countryHeaderStyle
stateHeaderStyle
Use It
This will display the list of countries in the world
showModalBottomSheet(
isScrollControlled: true,
context: context,
isDismissible: false,
builder: (context) => SizedBox(
height: MediaQuery.of(context).size.height * 0.7,
child: ShowMyDialog(
searchHint: 'Search for a country',
substringBackground: Colors.black,
style: const TextStyle(color: Colors.black,fontWeight: FontWeight.w500),
searchStyle: const TextStyle(color: Colors.black),
subStringStyle: const TextStyle(color: Colors.white),
selectedCountryBackgroundColor: Colors.pink,
notSelectedCountryBackgroundColor: Colors.white,
onSelectCountry: (){setState(() {
selectedCountry = Variables.country;
});},
),
),
);This will display the states of the country selected
showModalBottomSheet(
isScrollControlled: true,
context: context,
isDismissible: false,
builder: (context) => SizedBox(
height: MediaQuery.of(context).size.height * 0.7,
child: StateDialog(
style: const TextStyle(color: Colors.black,fontWeight: FontWeight.w500),
subStringStyle: const TextStyle(color: Colors.white),
substringBackground: Colors.black,
selectedStateBackgroundColor: Colors.orange,
notSelectedStateBackgroundColor: Colors.white,
onSelectedState: (){
setState(() {
selectedState = Variables.state;
});
},
),
),
);Next goal
- [ x ] Add countries flag
- [ x ] Add countries code
- [ x ] Add cities of each state
