Merge pull request #24 from Afulton11/fix/selection-dialog-performance

Improve SelectionDialog Performance

lib/country_code_picker.dart

@@ -14,6 +14,7 @@ class CountryCodePicker extends StatefulWidget {
   final TextStyle textStyle;
   final EdgeInsetsGeometry padding;
   final bool showCountryOnly;
+  final WidgetBuilder emptySearchBuilder;
 
   /// shows the name of the country instead of the dialcode
   final bool showOnlyCountryWhenClosed;
@@ -32,6 +33,7 @@ class CountryCodePicker extends StatefulWidget {
     this.textStyle,
     this.padding = const EdgeInsets.all(0.0),
     this.showCountryOnly = false,
+    this.emptySearchBuilder,
     this.showOnlyCountryWhenClosed = false,
     this.alignLeft = false,
   });
@@ -124,8 +126,13 @@ class _CountryCodePickerState extends State<CountryCodePicker> {
   void _showSelectionDialog() {
     showDialog(
       context: context,
-      builder: (_) => new SelectionDialog(elements, favoriteElements,
+      builder: (_) =>
-          showCountryOnly: widget.showCountryOnly),
+        SelectionDialog(
+          elements,
+          favoriteElements,
+          showCountryOnly: widget.showCountryOnly,
+          emptySearchBuilder: widget.emptySearchBuilder,
+        ),
     ).then((e) {
       if (e != null) {
         setState(() {

lib/selection_dialog.dart

@@ -5,58 +5,71 @@ import 'package:flutter/material.dart';
 class SelectionDialog extends StatefulWidget {
   final List<CountryCode> elements;
   final bool showCountryOnly;
+  final WidgetBuilder emptySearchBuilder;
 
   /// elements passed as favorite
   final List<CountryCode> favoriteElements;
 
-  SelectionDialog(this.elements, this.favoriteElements, {this.showCountryOnly});
+  SelectionDialog(this.elements, this.favoriteElements, {
+    Key key,
+    this.showCountryOnly,
+    this.emptySearchBuilder,
+  }) : super(key: key);
 
   @override
-  State<StatefulWidget> createState() => new _SelectionDialogState();
+  State<StatefulWidget> createState() => _SelectionDialogState();
 }
 
 class _SelectionDialogState extends State<SelectionDialog> {
   /// this is useful for filtering purpose
-  List<CountryCode> showedElements = [];
+  List<CountryCode> filteredElements;
 
   @override
-  Widget build(BuildContext context) => new SimpleDialog(
+  Widget build(BuildContext context) => SimpleDialog(
-      title: new Column(
+      title: Column(
         children: <Widget>[
-          new TextField(
+          TextField(
-            decoration: new InputDecoration(prefixIcon: new Icon(Icons.search)),
+            decoration: const InputDecoration(prefixIcon: Icon(Icons.search)),
             onChanged: _filterElements,
           ),
         ],
       ),
       children: [
-        widget.favoriteElements.isEmpty
+        Container(
-            ? new Container()
+          width: MediaQuery.of(context).size.width,
-            : new Column(
+          height: MediaQuery.of(context).size.height,
-                crossAxisAlignment: CrossAxisAlignment.start,
+          child: ListView(
-                children: <Widget>[]
+            children: [
-                  ..addAll(widget.favoriteElements
+              widget.favoriteElements.isEmpty
-                      .map(
+                  ? const DecoratedBox(decoration: BoxDecoration())
-                        (f) => new SimpleDialogOption(
+                  : Column(
-                              child: _buildOption(f),
+                      crossAxisAlignment: CrossAxisAlignment.start,
-                              onPressed: () {
+                      children: <Widget>[]
-                                _selectItem(f);
+                        ..addAll(widget.favoriteElements
-                              },
+                            .map(
-                            ),
+                              (f) => SimpleDialogOption(
-                      )
+                                    child: _buildOption(f),
-                      .toList())
+                                    onPressed: () {
-                  ..add(new Divider())),
+                                      _selectItem(f);
-      ]..addAll(showedElements
+                                    },
-          .map(
+                                  ),
-            (e) => new SimpleDialogOption(
+                            )
-                  key: Key(e.toLongString()),
+                            .toList())
-                  child: _buildOption(e),
+                        ..add(const Divider())),
-                  onPressed: () {
+            ]..addAll(filteredElements.isEmpty
-                    _selectItem(e);
+                ? [_buildEmptySearchWidget(context)]
-                  },
+                : filteredElements.map(
-                ),
+                    (e) => SimpleDialogOption(
-          )
+                      key: Key(e.toLongString()),
-          .toList()));
+                      child: _buildOption(e),
+                      onPressed: () {
+                        _selectItem(e);
+                      },
+                    )))
+            )
+          ),
+        ],
+      );
 
   Widget _buildOption(CountryCode e) {
     return Container(
@@ -88,16 +101,24 @@ class _SelectionDialogState extends State<SelectionDialog> {
     );
   }
 
+  Widget _buildEmptySearchWidget(BuildContext context) {
+    if (widget.emptySearchBuilder != null) {
+      return widget.emptySearchBuilder(context);
+    }
+
+    return Center(child: Text('No Country Found'));
+  }
+
   @override
   void initState() {
-    showedElements = widget.elements;
+    filteredElements = widget.elements;
     super.initState();
   }
 
   void _filterElements(String s) {
     s = s.toUpperCase();
     setState(() {
-      showedElements = widget.elements
+      filteredElements = widget.elements
           .where((e) =>
               e.code.contains(s) ||
               e.dialCode.contains(s) ||