flutter_time_picker_spinner
A Flutter widget that uses a spinner instead of material time picker to set the time. This Flutter widget is a user interface control for selecting the time in either 24-hour format or 12-hour format or even 24-hour format with the second. And it can have a custom interface. With its unique functions, it is used to ensure that users pick a valid time for the day in the application.
12H format
This is a 12-hour format and it is easy to use.

24H format
This is a 24-hour format

24H format with second
This is a format of 24-hour with second. Let

Custom style
It is designed extremely ingeniously and intelligently, with different colors and customizable styles.

Getting Started
This project serves as the foundation for a Dart
package,
a code library module that may be readily shared across many Flutter or Dart projects.
For help getting started with Flutter, view our
online documentation, which offers tutorials,
samples, guidance on mobile development, and a full API reference.
Props
props | types | defaultValues |
---|---|---|
time | DateTime | Current Time [ DateTime.now() ] |
minutesInterval | int | 1 |
secondsInterval | int | 1 |
is24HourMode | bool | true |
isShowSeconds | bool | false |
isShowSeconds | bool | false |
highlightedTextStyle | TextStyle | false |
normalTextStyle | TextStyle | false |
itemHeight | double | 60.0 |
itemWidth | double | 45.0 |
spacing | double | 20.0 |
alignment | AlignmentGeometry | Alignment.centerRight |
isForce2Digits | bool | false |
onTimeChange | TimePickerCallback |
Usage
import 'package:flutter_time_picker_spinner/flutter_time_picker_spinner.dart';
Widget widget() {
return new TimePickerSpinner(
is24HourMode: false,
normalTextStyle: TextStyle(
fontSize: 24,
color: Colors.deepOrange
),
highlightedTextStyle: TextStyle(
fontSize: 24,
color: Colors.yellow
),
spacing: 50,
itemHeight: 80,
isForce2Digits: true,
onTimeChange: (time) {
setState(() {
_dateTime = time;
});
},
);
}
GitHub
https://github.com/icemanbsi/flutter_time_picker_spinner