language_picker 0.3.0+1

Language picker dropdown and dialog.

language_picker

Provides a dropdown and dialog to select a language.

Originally made by @gomgom at https://pub.dev/packages/language_pickers. As of May 2021, this project has had no activity for more than a year and does not compile anymore. So I am shamelessly republishing it. :) I've also improved the API and fixed a few issues along the way.

Getting Started

Minimal example

This will use the default builder and default list of languages.

LanguagePickerDropdown(
  onValuePicked: (Language language) {
    print(language.name);
  })

Preselect a value

Use the language's ISO name.

LanguagePickerDropdown(
  initialValue: 'ko',
  onValuePicked: (Language language) {
    print(language.name);
  })

Customize rendering

If you don't want to see the ISO code:

LanguagePickerDropdown(
  itemBuilder: languageBuilder,
  onValuePicked: (Language language) {
    print(language.name);
  })

...

// Just render the name.
final languageBuilder = (language) => Text(language.name);

Customize the list of languages

LanguagePickerDropdown(
  languages: supportedLanguages,
  onValuePicked: (Language language) {
    print(language.name);
  })

...

final supportedLanguages = [
  LanguagePickerUtils.getLanguageByIsoCode('en'),
  LanguagePickerUtils.getLanguageByIsoCode('fr'),
  LanguagePickerUtils.getLanguageByIsoCode('ja'),
  LanguagePickerUtils.getLanguageByIsoCode('ko'),
];

LanguagePickerDropdown example

import 'package:language_picker/language.dart';
import 'package:language_picker/language_picker.dart';

Language _selectedDropdownLanguage =
      LanguagePickerUtils.getLanguageByIsoCode('ko');

// It's sample code of Dropdown Item.
Widget _buildDropdownItem(Language language) {
  return Row(
    children: <Widget>[
      SizedBox(
        width: 8.0,
      ),
      Text("${language.name} (${language.isoCode})"),
    ],
  );
}


// Builder
LanguagePickerDropdown(
                    initialValue: 'ko',
                    itemBuilder: _buildDropdownItem,
                    onValuePicked: (Language language) {
                      _selectedDropdownLanguage = language;
                      print(_selectedDropdownLanguage.name);
                      print(_selectedDropdownLanguage.isoCode);
                    },
                  ),

LanguagePickerDialog example

import 'package:language_picker/language.dart';
import 'package:language_picker/language_picker.dart';

Language _selectedDialogLanguage =
      LanguagePickerUtils.getLanguageByIsoCode('ko');

// It's sample code of Dialog Item.
Widget _buildDialogItem(Language language) => Row(
    children: <Widget>[
      Text(language.name),
      SizedBox(width: 8.0),
      Flexible(child: Text("(${language.isoCode})"))
    ],
  );

void _openLanguagePickerDialog() => showDialog(
    context: context,
    builder: (context) => Theme(
        data: Theme.of(context).copyWith(primaryColor: Colors.pink),
        child: LanguagePickerDialog(
            titlePadding: EdgeInsets.all(8.0),
            searchCursorColor: Colors.pinkAccent,
            searchInputDecoration: InputDecoration(hintText: 'Search...'),
            isSearchable: true,
            title: Text('Select your language'),
            onValuePicked: (Language language) => setState(() {
                  _selectedDialogLanguage = language;
                  print(_selectedDialogLanguage.name);
                  print(_selectedDialogLanguage.isoCode);
                }),
            itemBuilder: _buildDialogItem)),
  );

LanguagePickerCupertino example

import 'package:language_picker/language.dart';
import 'package:language_picker/language_picker.dart';

Language _selectedCupertinoLanguage =
  LanguagePickerUtils.getLanguageByIsoCode('ko');

// It's sample code of Cupertino Item.
void _openCupertinoLanguagePicker() => showCupertinoModalPopup<void>(
  context: context,
  builder: (BuildContext context) {
    return LanguagePickerCupertino(
      pickerSheetHeight: 200.0,
      onValuePicked: (Language language) => setState(() {
            _selectedCupertinoLanguage = language;
            print(_selectedCupertinoLanguage.name);
            print(_selectedCupertinoLanguage.isoCode);
          }),
    );
  });

Widget _buildCupertinoItem(Language language) => Row(
    children: <Widget>[
      Text("+${language.name}"),
      SizedBox(width: 8.0),
      Flexible(child: Text(language.name))
    ],
  );