A custom widget designed for choosing an integer or decimal number
Flutter Number
Flutter Number Picker is a custom widget designed for choosing an integer or decimal number by using add and minus buttons.
Getting Started
- Head to
/pubspec.yaml
and add below dependencies like this:
dependencies:
flutter:
sdk: flutter
flutter_number_picker: <latest_version>
OR
dependencies:
flutter:
sdk: flutter
flutter_number_picker:
git: https://github.com/phuongtinhbien/flutter_number_picker.git
- Run
flutter packages get
or use the GUI equivalent - Now in your code
import 'package:flutter_number_picker/flutter_number_picker.dart';
- You're ready to go!
Creating FlutterNumberPicker Widget
CustomNumberPicker(
initialValue: 10000,
maxValue: 1000000,
minValue: 0,
step: 10000,
onValue: (value) {
print(value.toString());
},
)
Attribute
minValue
[required] is the minimum value of the ButtonPicker.maxValue
[required] is the maximum value of the ButtonPicker.initialValue
[required] is the value displayed on load.onValue
[required] returns the current value.step
defines how much the value should increase or decrease on tap.default
= 1.valueTextStyle
is theTextStyle
of the value.shape
is theShapeBorder
of the picker.customAddButton
is theWidget
.customAddButton
is theWidget
.
Usage examples
See examples directory for full examples.
Standalone widget
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
void initState() {
super.initState();
}
// Platform messages are asynchronous, so we initialize in an async method.
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Plutter number picker'),
),
body: Center(
child: Container(
child: CustomNumberPicker(
initialValue: 10000,
maxValue: 1000000,
minValue: 0,
step: 10000,
onValue: (value) {
print(value.toString());
},
),
),
),
),
);
}
}