Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dalyathan/time-duration-picker
A flutter package for picking duration of time
https://github.com/dalyathan/time-duration-picker
dart flutter
Last synced: about 2 months ago
JSON representation
A flutter package for picking duration of time
- Host: GitHub
- URL: https://github.com/dalyathan/time-duration-picker
- Owner: dalyathan
- License: mit
- Created: 2022-03-16T14:53:25.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-04-10T03:32:07.000Z (5 months ago)
- Last Synced: 2024-07-09T01:22:58.259Z (2 months ago)
- Topics: dart, flutter
- Language: Dart
- Homepage: https://pub.dev/packages/time_duration_picker
- Size: 2.67 MB
- Stars: 8
- Watchers: 1
- Forks: 6
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Time Duration Picker
A time picker for paired consecutive tasks. It lets you specify the icons for each of your actions and callbacks when the user rotates each icon. You can optionally give callback for the time duration, decorations for the knob, the knob background, the clock and also color for your icons. The time and duration values are not displayed by the TimeDurationPicker widget, instead they are passed to the callbacks provided.
```dart
TimeDurationPicker(
diameter: 300,
icon1Data: Icons.directions_car_outlined,
icon2Data: Icons.local_gas_station_outlined,
knobDecoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.bottomLeft,
end: Alignment.topRight,
colors: [
Color.fromRGBO(204, 43, 94, 1),
Color.fromRGBO(117, 58, 136, 1),
],
),
),
clockTextStyle: const TextStyle(
color: Colors.teal, fontWeight: FontWeight.bold),
onIcon1RotatedCallback: (value) {
setState(() {
goTime = value;
});
},
onIcon2RotatedCallback: (value) {
setState(() {
gasTime = value;
});
},),
```
```dart
TimeDurationPicker(
diameter: 305,
icon1Data: Icons.school,
icon2Data: Icons.home,
clockTextStyle: const TextStyle(
color: Colors.white, fontWeight: FontWeight.bold),
iconColor: Colors.black,
knobDecoration: const BoxDecoration(
gradient: LinearGradient(
colors: [
Color.fromRGBO(221, 214, 243, 1),
Color.fromRGBO(250, 172, 168, 1),
],
),
),
clockDecoration: const BoxDecoration(
gradient: LinearGradient(
colors: [
Color.fromRGBO(2, 170, 176, 1),
Color.fromRGBO(0, 205, 172, 1),
],
),
),
onIcon1RotatedCallback: (value) {
setState(() {
schoolTime = value;
});
},
onIcon2RotatedCallback: (value) {
setState(() {
homeTime = value;
});
},
setDurationCallback: (value) {
setState(() {
sleepDuration = value;
});
},
)
```
Inspired by [Iphone Alarm UI Design](https://dribbble.com/shots/17158885-Iphone-Alarm-UI-Design) by [Ghulam Rasool](https://dribbble.com/ghulaam-rasool)