flutter_combo_box 0.0.2+3 flutter_combo_box: ^0.0.2+3 copied to clipboard
This package help to use custom spinner with title, title with subtitle, title with icon.
flutter_combo_box #
This package help to use custom spinner with title, title with subtitle, title with icon.
Usage #
To use this plugin, add flutter_combo_box as a dependency in your pubspec.yaml file.
Hou to use this package #
dependencies:
flutter:
sdk: flutter
flutter_combo_box: ^0.0.2+3 # 👈🏼 add this line
- Import the package to your main file
import 'package:flutter_combo_box/flutter_combo_box.dart';
Combobox types #
- Combobox with Title
- ComboBox with Title and subtitle
- ComboBox with Icon and title
Title #
ComboBoxTitle({String title, Color accent = Colors.blue})
Title and subtitle #
ComboBoxTitleSubTitle({String title, String description, Color accent = Colors.purple})
Icon and title #
ComboBoxIconTitle({IconData icon, String title, Color background = Colors.indigo})
Example #
Container(
child: Center(
child: DropdownButtonFormField<String>(
decoration: InputDecoration(
contentPadding: EdgeInsets.symmetric(horizontal: 20, vertical: 0),
labelText: 'Gender',
hintText: 'Please select the gender here',
hintStyle: GoogleFonts.quicksand(color: Colors.grey, fontSize: 16, fontWeight: FontWeight.w800),
alignLabelWithHint: true,
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide(color: Colors.black26),
gapPadding: 16,
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide(color: Colors.black26),
gapPadding: 16,
),
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(8),
borderSide: BorderSide(color: Colors.black26),
gapPadding: 16,
),
),
items: genders.map((item) {
return DropdownMenuItem(
child: ComboBoxTitle(title: item, accent: Colors.red),
value: item,
);
}).toList(),
onChanged: (value) => setState(() => selectedGender = value),
value: selectedGender,
),
),
),
Screenshots #
Global view Expanded view
For help getting started with Combobox package, view our Gith repository