in ,

Time Picker widget with a spinner instead of a material time picker

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.

time picker
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

propstypesdefaultValues
timeDateTimeCurrent Time [ DateTime.now() ]
minutesIntervalint1
secondsIntervalint1
is24HourModebooltrue
isShowSecondsboolfalse
isShowSecondsboolfalse
highlightedTextStyleTextStylefalse
normalTextStyleTextStylefalse
itemHeightdouble60.0
itemWidthdouble45.0
spacingdouble20.0
alignmentAlignmentGeometryAlignment.centerRight
isForce2Digitsboolfalse
onTimeChangeTimePickerCallback

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

Written by James

A simple Pomodoro timer is written in Flutter Web

A clock that changes in color based on the current time