switch to a dialog for desktop support

This commit is contained in:
kechankrisna
2021-03-09 03:05:55 +07:00
parent 15cb858bbb
commit ded48ce249
2 changed files with 89 additions and 43 deletions

View File

@@ -1,5 +1,7 @@
library country_code_picker; library country_code_picker;
import 'dart:io';
import 'package:collection/collection.dart' show IterableExtension; import 'package:collection/collection.dart' show IterableExtension;
import 'package:country_code_picker/country_code.dart'; import 'package:country_code_picker/country_code.dart';
import 'package:country_code_picker/country_codes.dart'; import 'package:country_code_picker/country_codes.dart';
@@ -114,8 +116,9 @@ class CountryCodePicker extends StatefulWidget {
State<StatefulWidget> createState() { State<StatefulWidget> createState() {
List<Map> jsonList = codes; List<Map> jsonList = codes;
List<CountryCode> elements = List<CountryCode> elements = jsonList
jsonList.map((json) => CountryCode.fromJson(json as Map<String, dynamic>)).toList(); .map((json) => CountryCode.fromJson(json as Map<String, dynamic>))
.toList();
if (comparator != null) { if (comparator != null) {
elements.sort(comparator); elements.sort(comparator);
@@ -227,7 +230,8 @@ class CountryCodePickerState extends State<CountryCodePicker> {
(e.code!.toUpperCase() == (e.code!.toUpperCase() ==
widget.initialSelection!.toUpperCase()) || widget.initialSelection!.toUpperCase()) ||
(e.dialCode == widget.initialSelection) || (e.dialCode == widget.initialSelection) ||
(e.name!.toUpperCase() == widget.initialSelection!.toUpperCase()), (e.name!.toUpperCase() ==
widget.initialSelection!.toUpperCase()),
orElse: () => elements[0]); orElse: () => elements[0]);
} else { } else {
selectedItem = elements[0]; selectedItem = elements[0];
@@ -243,7 +247,8 @@ class CountryCodePickerState extends State<CountryCodePicker> {
if (widget.initialSelection != null) { if (widget.initialSelection != null) {
selectedItem = elements.firstWhere( selectedItem = elements.firstWhere(
(e) => (e) =>
(e.code!.toUpperCase() == widget.initialSelection!.toUpperCase()) || (e.code!.toUpperCase() ==
widget.initialSelection!.toUpperCase()) ||
(e.dialCode == widget.initialSelection) || (e.dialCode == widget.initialSelection) ||
(e.name!.toUpperCase() == widget.initialSelection!.toUpperCase()), (e.name!.toUpperCase() == widget.initialSelection!.toUpperCase()),
orElse: () => elements[0]); orElse: () => elements[0]);
@@ -253,50 +258,91 @@ class CountryCodePickerState extends State<CountryCodePicker> {
favoriteElements = elements favoriteElements = elements
.where((e) => .where((e) =>
widget.favorite.firstWhereOrNull( widget.favorite.firstWhereOrNull((f) =>
(f) => e.code!.toUpperCase() == f.toUpperCase() ||
e.code!.toUpperCase() == f.toUpperCase() || e.dialCode == f ||
e.dialCode == f || e.name!.toUpperCase() == f.toUpperCase()) !=
e.name!.toUpperCase() == f.toUpperCase()) !=
null) null)
.toList(); .toList();
} }
void showCountryCodePickerDialog() { void showCountryCodePickerDialog() {
showMaterialModalBottomSheet( if (Platform.isIOS || Platform.isAndroid) {
barrierColor: widget.barrierColor ?? Colors.grey.withOpacity(0.5), showMaterialModalBottomSheet(
backgroundColor: widget.backgroundColor ?? Colors.transparent, barrierColor: widget.barrierColor ?? Colors.grey.withOpacity(0.5),
context: context, backgroundColor: widget.backgroundColor ?? Colors.transparent,
builder: (context) => Center( context: context,
child: SelectionDialog( builder: (context) => Center(
elements, child: SelectionDialog(
favoriteElements, elements,
showCountryOnly: widget.showCountryOnly, favoriteElements,
emptySearchBuilder: widget.emptySearchBuilder, showCountryOnly: widget.showCountryOnly,
searchDecoration: widget.searchDecoration, emptySearchBuilder: widget.emptySearchBuilder,
searchStyle: widget.searchStyle, searchDecoration: widget.searchDecoration,
textStyle: widget.dialogTextStyle, searchStyle: widget.searchStyle,
boxDecoration: widget.boxDecoration, textStyle: widget.dialogTextStyle,
showFlag: widget.showFlagDialog != null boxDecoration: widget.boxDecoration,
? widget.showFlagDialog showFlag: widget.showFlagDialog != null
: widget.showFlag, ? widget.showFlagDialog
flagWidth: widget.flagWidth, : widget.showFlag,
size: widget.dialogSize, flagWidth: widget.flagWidth,
backgroundColor: widget.dialogBackgroundColor, size: widget.dialogSize,
barrierColor: widget.barrierColor, backgroundColor: widget.dialogBackgroundColor,
hideSearch: widget.hideSearch, barrierColor: widget.barrierColor,
closeIcon: widget.closeIcon, hideSearch: widget.hideSearch,
closeIcon: widget.closeIcon,
),
), ),
), ).then((e) {
).then((e) { if (e != null) {
if (e != null) { setState(() {
setState(() { selectedItem = e;
selectedItem = e; });
});
_publishSelection(e); _publishSelection(e);
} }
}); });
} else {
showDialog(
barrierColor: widget.barrierColor ?? Colors.grey.withOpacity(0.5),
// backgroundColor: widget.backgroundColor ?? Colors.transparent,
context: context,
builder: (context) => Center(
child: Container(
constraints: BoxConstraints(maxHeight: 500, maxWidth: 400),
child: Dialog(
child: SelectionDialog(
elements,
favoriteElements,
showCountryOnly: widget.showCountryOnly,
emptySearchBuilder: widget.emptySearchBuilder,
searchDecoration: widget.searchDecoration,
searchStyle: widget.searchStyle,
textStyle: widget.dialogTextStyle,
boxDecoration: widget.boxDecoration,
showFlag: widget.showFlagDialog != null
? widget.showFlagDialog
: widget.showFlag,
flagWidth: widget.flagWidth,
size: widget.dialogSize,
backgroundColor: widget.dialogBackgroundColor,
barrierColor: widget.barrierColor,
hideSearch: widget.hideSearch,
closeIcon: widget.closeIcon,
),
),
),
),
).then((e) {
if (e != null) {
setState(() {
selectedItem = e;
});
_publishSelection(e);
}
});
}
} }
void _publishSelection(CountryCode e) { void _publishSelection(CountryCode e) {

View File

@@ -58,7 +58,7 @@ class _SelectionDialogState extends State<SelectionDialog> {
@override @override
Widget build(BuildContext context) => Padding( Widget build(BuildContext context) => Padding(
padding: const EdgeInsets.all(16.0), padding: const EdgeInsets.all(0.0),
child: Container( child: Container(
clipBehavior: Clip.hardEdge, clipBehavior: Clip.hardEdge,
width: widget.size?.width ?? MediaQuery.of(context).size.width, width: widget.size?.width ?? MediaQuery.of(context).size.width,
@@ -67,7 +67,7 @@ class _SelectionDialogState extends State<SelectionDialog> {
decoration: widget.boxDecoration ?? decoration: widget.boxDecoration ??
BoxDecoration( BoxDecoration(
color: widget.backgroundColor ?? Colors.white, color: widget.backgroundColor ?? Colors.white,
borderRadius: BorderRadius.all(Radius.circular(25.0)), borderRadius: BorderRadius.all(Radius.circular(8.0)),
boxShadow: [ boxShadow: [
BoxShadow( BoxShadow(
color: widget.barrierColor ?? Colors.grey.withOpacity(1), color: widget.barrierColor ?? Colors.grey.withOpacity(1),