refactored duration picker

This commit is contained in:
2025-02-11 12:06:02 +01:00
parent c8cc5861ad
commit 8872ec0889

View File

@@ -1,9 +1,16 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
class DurationPicker extends StatefulWidget { class DurationPicker extends StatefulWidget {
const DurationPicker({super.key, required this.onChangedCallback}); const DurationPicker({
super.key,
required this.onChangedCallback,
required this.width,
required this.height,
});
final void Function(Duration duration) onChangedCallback; final void Function(Duration duration) onChangedCallback;
final double width;
final double height;
@override @override
State<DurationPicker> createState() => _DurationPickerState(); State<DurationPicker> createState() => _DurationPickerState();
@@ -14,12 +21,13 @@ class _DurationPickerState extends State<DurationPicker> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return SizedBox( return Column(
width: 400,
child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
Row( SizedBox(
width: widget.width,
height: widget.height / 4,
child: Row(
mainAxisSize: MainAxisSize.max, mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center, mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end, crossAxisAlignment: CrossAxisAlignment.end,
@@ -47,66 +55,161 @@ class _DurationPickerState extends State<DurationPicker> {
), ),
], ],
), ),
),
Padding(padding: EdgeInsets.only(top: 10)), Padding(padding: EdgeInsets.only(top: 10)),
Expanded( Row(
child: GridView.count( mainAxisSize: MainAxisSize.max,
crossAxisSpacing: 10, mainAxisAlignment: MainAxisAlignment.center,
mainAxisSpacing: 10,
crossAxisCount: 3,
physics: NeverScrollableScrollPhysics(),
children: [ children: [
ElevatedButton( SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(7), onPressed: () => _addTime(7),
child: _getTextWidget('7'), child: _getTextWidget('7'),
), ),
ElevatedButton( ),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(8), onPressed: () => _addTime(8),
child: _getTextWidget('8'), child: _getTextWidget('8'),
), ),
ElevatedButton( ),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(9), onPressed: () => _addTime(9),
child: _getTextWidget('9'), child: _getTextWidget('9'),
), ),
ElevatedButton( ),
),
],
),
Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(4), onPressed: () => _addTime(4),
child: _getTextWidget('4'), child: _getTextWidget('4'),
), ),
ElevatedButton( ),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(5), onPressed: () => _addTime(5),
child: _getTextWidget('5'), child: _getTextWidget('5'),
), ),
ElevatedButton( ),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(6), onPressed: () => _addTime(6),
child: _getTextWidget('6'), child: _getTextWidget('6'),
), ),
ElevatedButton( ),
),
],
),
Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(1), onPressed: () => _addTime(1),
child: _getTextWidget('1'), child: _getTextWidget('1'),
), ),
ElevatedButton( ),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(2), onPressed: () => _addTime(2),
child: _getTextWidget('2'), child: _getTextWidget('2'),
), ),
ElevatedButton( ),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(3), onPressed: () => _addTime(3),
child: _getTextWidget('3'), child: _getTextWidget('3'),
), ),
Padding(padding: EdgeInsets.all(0)), ),
ElevatedButton( ),
],
),
Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(padding: EdgeInsets.all(0)),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: () => _addTime(0), onPressed: () => _addTime(0),
child: _getTextWidget('0'), child: _getTextWidget('0'),
), ),
ElevatedButton( ),
),
SizedBox(
width: widget.width / 3,
height: widget.height / 4,
child: Padding(
padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
child: ElevatedButton(
style: _buttonTheme, style: _buttonTheme,
onPressed: _removeTime, onPressed: _removeTime,
child: Icon( child: Icon(
@@ -114,11 +217,81 @@ class _DurationPickerState extends State<DurationPicker> {
size: 24, size: 24,
), ),
), ),
],
), ),
), ),
], ],
), ),
// Expanded(
// child: GridView.count(
// crossAxisSpacing: 10,
// mainAxisSpacing: 10,
// crossAxisCount: 3,
// shrinkWrap: true,
// physics: NeverScrollableScrollPhysics(),
// children: [
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(7),
// child: _getTextWidget('7'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(8),
// child: _getTextWidget('8'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(9),
// child: _getTextWidget('9'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(4),
// child: _getTextWidget('4'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(5),
// child: _getTextWidget('5'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(6),
// child: _getTextWidget('6'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(1),
// child: _getTextWidget('1'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(2),
// child: _getTextWidget('2'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(3),
// child: _getTextWidget('3'),
// ),
// Padding(padding: EdgeInsets.all(0)),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: () => _addTime(0),
// child: _getTextWidget('0'),
// ),
// ElevatedButton(
// style: _buttonTheme,
// onPressed: _removeTime,
// child: Icon(
// Icons.backspace,
// size: 24,
// ),
// ),
// ],
// ),
// ),
],
); );
} }