Merge pull request #22 from autlunatic/master
Additional changes to showCountryOnly are made
This commit is contained in:
40
README.md
40
README.md
@@ -11,29 +11,35 @@ A flutter package for showing a country code selector.
|
||||
|
||||
Just put the component in your application setting the onChanged callback.
|
||||
|
||||
```dart
|
||||
```dart
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => new Scaffold(
|
||||
body: new Center(
|
||||
child: new CountryCodePicker(
|
||||
onChanged: print,
|
||||
// Initial selection and favorite can be one of code ('IT') OR dial_code('+39')
|
||||
initialSelection: 'IT',
|
||||
favorite: ['+39','FR'],
|
||||
// optional. Shows only country name and flag
|
||||
showCountryOnly: false,
|
||||
),
|
||||
),
|
||||
);
|
||||
@override
|
||||
Widget build(BuildContext context) => new Scaffold(
|
||||
body: new Center(
|
||||
child: new CountryCodePicker(
|
||||
onChanged: print,
|
||||
// Initial selection and favorite can be one of code ('IT') OR dial_code('+39')
|
||||
initialSelection: 'IT',
|
||||
favorite: ['+39','FR'],
|
||||
// optional. Shows only country name and flag
|
||||
showCountryOnly: false,
|
||||
// optional. Shows only country name and flag when popup is closed.
|
||||
showOnlyCountryCodeWhenClosed: false,
|
||||
// optional. aligns the flag and the Text left
|
||||
alignLeft: false,
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
```
|
||||
|
||||
```
|
||||
Note: Your onChanged function can be any function of the type shown below:
|
||||
|
||||
```dart
|
||||
(CountryCode)->dynamic
|
||||
|
||||
```
|
||||
|
||||
Example:
|
||||
|
||||
```dart
|
||||
@@ -42,9 +48,9 @@ void _onCountryChange(CountryCode countryCode) {
|
||||
//Todo : manipulate the selected country code here
|
||||
print("New Country selected: " + countryCode.toString());
|
||||
}
|
||||
|
||||
|
||||
```
|
||||
|
||||
|
||||
## Contributions
|
||||
|
||||
Contributions of any kind are more than welcome! Feel free to fork and improve country_code_picker in any way you want, make a pull request, or open an issue.
|
||||
|
||||
@@ -21,13 +21,44 @@ class _MyAppState extends State<MyApp> {
|
||||
appBar: new AppBar(
|
||||
title: const Text('CountryPicker Example'),
|
||||
),
|
||||
body: new Center(
|
||||
child: new CountryCodePicker(
|
||||
onChanged: print,
|
||||
// Initial selection and favorite can be one of code ('IT') OR dial_code('+39')
|
||||
initialSelection: 'IT',
|
||||
showCountryOnly: true,
|
||||
favorite: ['+39', 'FR']),
|
||||
body: Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
children: <Widget>[
|
||||
CountryCodePicker(
|
||||
onChanged: print,
|
||||
// Initial selection and favorite can be one of code ('IT') OR dial_code('+39')
|
||||
initialSelection: 'IT',
|
||||
favorite: ['+39', 'FR']),
|
||||
SizedBox(
|
||||
width: 400,
|
||||
height: 60,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: CountryCodePicker(
|
||||
onChanged: print,
|
||||
initialSelection: 'TF',
|
||||
showCountryOnly: true,
|
||||
showOnlyCountryWhenClosed: true,
|
||||
alignLeft: true,
|
||||
),
|
||||
),
|
||||
),
|
||||
SizedBox(
|
||||
width: 400,
|
||||
height: 60,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(8.0),
|
||||
child: CountryCodePicker(
|
||||
onChanged: print,
|
||||
initialSelection: 'TF',
|
||||
showCountryOnly: true,
|
||||
showOnlyCountryWhenClosed: true,
|
||||
favorite: ['+39', 'FR']),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
)));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -15,6 +15,16 @@ class CountryCodePicker extends StatefulWidget {
|
||||
final EdgeInsetsGeometry padding;
|
||||
final bool showCountryOnly;
|
||||
|
||||
/// shows the name of the country instead of the dialcode
|
||||
final bool showOnlyCountryWhenClosed;
|
||||
|
||||
/// aligns the flag and the Text left
|
||||
///
|
||||
/// additionally this option also fills the available space of the widget.
|
||||
/// this is especially usefull in combination with [showOnlyCountryWhenClosed],
|
||||
/// because longer countrynames are displayed in one line
|
||||
final bool alignLeft;
|
||||
|
||||
CountryCodePicker({
|
||||
this.onChanged,
|
||||
this.initialSelection,
|
||||
@@ -22,6 +32,8 @@ class CountryCodePicker extends StatefulWidget {
|
||||
this.textStyle,
|
||||
this.padding = const EdgeInsets.all(0.0),
|
||||
this.showCountryOnly = false,
|
||||
this.showOnlyCountryWhenClosed = false,
|
||||
this.alignLeft = false,
|
||||
});
|
||||
|
||||
@override
|
||||
@@ -55,8 +67,12 @@ class _CountryCodePickerState extends State<CountryCodePicker> {
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: <Widget>[
|
||||
Flexible(
|
||||
flex: widget.alignLeft ? 0 : 1,
|
||||
fit: widget.alignLeft ? FlexFit.tight : FlexFit.loose,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(right: 16.0),
|
||||
padding: widget.alignLeft
|
||||
? const EdgeInsets.only(right: 16.0, left: 8.0)
|
||||
: const EdgeInsets.only(right: 16.0),
|
||||
child: Image.asset(
|
||||
selectedItem.flagUri,
|
||||
package: 'country_code_picker',
|
||||
@@ -65,8 +81,9 @@ class _CountryCodePickerState extends State<CountryCodePicker> {
|
||||
),
|
||||
),
|
||||
Flexible(
|
||||
fit: widget.alignLeft ? FlexFit.tight : FlexFit.loose,
|
||||
child: Text(
|
||||
widget.showCountryOnly
|
||||
widget.showOnlyCountryWhenClosed
|
||||
? selectedItem.toCountryStringOnly()
|
||||
: selectedItem.toString(),
|
||||
style: widget.textStyle ?? Theme.of(context).textTheme.button,
|
||||
|
||||
Reference in New Issue
Block a user