Last updated:
0 purchases
list picker
List Picker #
list_picker helps you to select an item from a list of items using dialog box without having to write a lot of code.
Features #
ListPickerField provides a text field which when tapped opens the dialog box to select item from the given list.
You can also customize showDialog and its builder method with ListPickerDialog widget.
Or you can call the showPickerDialog function on your custom widget.
Getting started #
Add to Dependencies
list_picker: ^1.2.0
copied to clipboard
Import the package
import 'package:list_picker/list_picker.dart';
copied to clipboard
Usage #
Using variable for the Widget to get values
class VariableDemo extends StatelessWidget {
VariableDemo({Key? key}) : super(key: key);
final listPickerField = ListPickerField(
label: "Fruit",
items: const ["Apple", "Banana", "Orange", "Pineapple"],
);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: listPickerField,
),
);
}
}
copied to clipboard
Using controller to get values
class ControllerDemo extends StatelessWidget {
ControllerDemo({Key? key}) : super(key: key);
final controller = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ListPickerField(
label: "Fruit",
items: const ["Apple", "Banana", "Orange", "Pineapple"],
controller: controller,
),
),
);
}
}
copied to clipboard
Using showPickerDialog function on custom widget
class DialogFunctionDemo extends StatelessWidget {
const DialogFunctionDemo({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ElevatedButton(
onPressed: () async {
String? fruit = await showPickerDialog(
context: context,
label: "Fruit",
items: const ["Apple", "Banana", "Orange", "Pineapple"],
);
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(fruit ?? "No fruit selected"),
),
);
},
child: const Text("Select Your Favourite fruit"),
),
),
);
}
}
copied to clipboard
Using ListPickerDialog Widget for custom use
class ListPickerDialogDemo extends StatelessWidget {
const ListPickerDialogDemo({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ElevatedButton(
onPressed: () async {
String? fruit = await showDialog(
context: context,
builder: (context) => Scaffold(
appBar: AppBar(
title: const Text('List Picker Dialog'),
),
body: const ListPickerDialog(
label: "Fruit",
items: ["Apple", "Banana", "Orange", "Pineapple"],
),
),
);
ScaffoldMessenger.of(context).showSnackBar(
SnackBar(
content: Text(fruit ?? "No fruit selected"),
),
);
},
child: const Text("Select Your Favourite fruit"),
),
),
);
}
}
copied to clipboard
ListPickerField Getter Methods #
value: returns the selected value
empty: returns true if no value is selected
If you liked the package, then please give it a Like 👍🏼 and Star ⭐ #
For personal and professional use. You cannot resell or redistribute these repositories in their original state.
There are no reviews.