Skip to content

Commit

Permalink
Input time in textFields using keyboard (#153)
Browse files Browse the repository at this point in the history
* add time using in text field using keyboard and readme updated

* Add Feature: Input Time in text fields using keayboard and readme updated
  • Loading branch information
SATVIKSH authored Nov 27, 2023
1 parent 06997c3 commit 14ceed6
Show file tree
Hide file tree
Showing 5 changed files with 258 additions and 44 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -256,7 +256,7 @@ The "Ultimate Alarm Clock" offers a user-friendly and versatile interface design

- The floating action button in the Home View allows you to create alarms, directing you to the Add or Update Alarm View.
- In this view, you can:
- Set the alarm time using a time picker.
- Set the alarm time using a time picker or manually entering time using keyboard.
- Configure alarm repetition.
- Set the snooze duration.
- Add a label to the alarm.
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:get/get.dart';
import 'package:ultimate_alarm_clock/app/modules/addOrUpdateAlarm/controllers/add_or_update_alarm_controller.dart';

class InputTimeController extends GetxController {
AddOrUpdateAlarmController addOrUpdateAlarmController =
Get.find<AddOrUpdateAlarmController>();
final isTimePicker = false.obs;
TextEditingController inputHrsController = TextEditingController();
TextEditingController inputMinutesController = TextEditingController();
final selectedDateTime = DateTime.now().obs;
@override
void onInit() {
isTimePicker.value = true;
selectedDateTime.value = addOrUpdateAlarmController.selectedTime.value;
isAM.value = addOrUpdateAlarmController.selectedTime.value.hour < 12;
super.onInit();
}

final isAM = true.obs;
changePeriod(String period) {
isAM.value = period == 'AM';
}

changeDatePicker() {
isTimePicker.value = !isTimePicker.value;
}

void setTime() {
int hour = int.parse(inputHrsController.text);
if (hour == 0 && inputHrsController.text.length == 2) {
inputHrsController.text = '12';
}

if (isAM.value) {
if (hour == 12) {
hour = hour - 12;
}
} else {
if (hour != 12) {
hour = hour + 12;
}
}
int minute = int.parse(inputMinutesController.text);
final time = TimeOfDay(hour: hour, minute: minute);
DateTime today = DateTime.now();
DateTime tomorrow = today.add(const Duration(days: 1));
bool isNextDay = (time.hour == today.hour && time.minute < today.minute) ||
(time.hour < today.hour);
bool isNextMonth = isNextDay && (today.day > tomorrow.day);
bool isNextYear = isNextMonth && (today.month > tomorrow.month);
int day = isNextDay ? tomorrow.day : today.day;
int month = isNextMonth ? tomorrow.month : today.month;
int year = isNextYear ? tomorrow.month : today.month;
selectedDateTime.value = DateTime(year, month, day, time.hour, time.minute);
addOrUpdateAlarmController.selectedTime.value = selectedDateTime.value;
}

@override
void onClose() {
inputHrsController.dispose();
inputMinutesController.dispose();
super.onClose();
}
}

class LimitRange extends TextInputFormatter {
LimitRange(
this.minRange,
this.maxRange,
) : assert(
minRange < maxRange,
);

final int minRange;
final int maxRange;

@override
TextEditingValue formatEditUpdate(
TextEditingValue oldValue, TextEditingValue newValue) {
var value = int.parse(newValue.text);
if (value < minRange) {
return TextEditingValue(text: minRange.toString());
} else if (value > maxRange) {
return TextEditingValue(text: maxRange.toString());
}
return newValue;
}
}
161 changes: 136 additions & 25 deletions lib/app/modules/addOrUpdateAlarm/views/add_or_update_alarm_view.dart
Original file line number Diff line number Diff line change
@@ -1,10 +1,12 @@
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_foreground_task/flutter_foreground_task.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:flutter_time_picker_spinner/flutter_time_picker_spinner.dart';

import 'package:get/get.dart';
import 'package:ultimate_alarm_clock/app/data/models/alarm_model.dart';
import 'package:ultimate_alarm_clock/app/modules/addOrUpdateAlarm/controllers/input_time_controller.dart';
import 'package:ultimate_alarm_clock/app/modules/addOrUpdateAlarm/views/alarm_id_tile.dart';
import 'package:ultimate_alarm_clock/app/modules/addOrUpdateAlarm/views/alarm_offset_tile.dart';
import 'package:ultimate_alarm_clock/app/modules/addOrUpdateAlarm/views/label_tile.dart';
Expand All @@ -28,6 +30,7 @@ class AddOrUpdateAlarmView extends GetView<AddOrUpdateAlarmController> {
AddOrUpdateAlarmView({Key? key}) : super(key: key);

ThemeController themeController = Get.find<ThemeController>();
InputTimeController inputTimeController = Get.put(InputTimeController());

@override
Widget build(BuildContext context) {
Expand Down Expand Up @@ -250,31 +253,139 @@ class AddOrUpdateAlarmView extends GetView<AddOrUpdateAlarmController> {
: ListView(
children: [
Container(
color: themeController.isLightMode.value
? kLightSecondaryBackgroundColor
: ksecondaryBackgroundColor,
height: height * 0.32,
width: width,
child: TimePickerSpinner(
time: controller.selectedTime.value,
isForce2Digits: true,
alignment: Alignment.center,
is24HourMode: false,
normalTextStyle:
Theme.of(context).textTheme.displayMedium!.copyWith(
fontWeight: FontWeight.normal,
color: themeController.isLightMode.value
? kLightPrimaryDisabledTextColor
: kprimaryDisabledTextColor,
),
highlightedTextStyle:
Theme.of(context).textTheme.displayMedium,
onTimeChange: (dateTime) {
Utils.hapticFeedback();
controller.selectedTime.value = dateTime;
},
),
),
color: themeController.isLightMode.value
? kLightSecondaryBackgroundColor
: ksecondaryBackgroundColor,
height: height * 0.32,
width: width,
child: Obx(() {
return InkWell(
onTap: () {
Utils.hapticFeedback();
inputTimeController.changeDatePicker();
},
child: inputTimeController.isTimePicker.value
? TimePickerSpinner(
time: controller.selectedTime.value,
isForce2Digits: true,
alignment: Alignment.center,
is24HourMode: false,
normalTextStyle: Theme.of(context)
.textTheme
.displayMedium!
.copyWith(
fontWeight: FontWeight.normal,
color: themeController
.isLightMode.value
? kLightPrimaryDisabledTextColor
: kprimaryDisabledTextColor,
),
highlightedTextStyle: Theme.of(context)
.textTheme
.displayMedium,
onTimeChange: (dateTime) {
Utils.hapticFeedback();
controller.selectedTime.value = dateTime;
inputTimeController.inputHrsController
.text = dateTime.hour ==
0
? 12.toString()
: (dateTime.hour > 12
? (dateTime.hour - 12).toString()
: dateTime.hour.toString());
inputTimeController.inputMinutesController
.text = dateTime.minute.toString();
inputTimeController.changePeriod(
dateTime.hour >= 12 ? 'PM' : 'AM');
},
)
: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SizedBox(
width: 80,
child: TextField(
onChanged: (_) {
inputTimeController.setTime();
},
decoration: const InputDecoration(
hintText: 'HH',
border: InputBorder.none),
textAlign: TextAlign.center,
controller: inputTimeController
.inputHrsController,
keyboardType: TextInputType.number,
inputFormatters: [
FilteringTextInputFormatter.allow(
RegExp(
'[1,2,3,4,5,6,7,8,9,0]')),
LengthLimitingTextInputFormatter(2),
LimitRange(0, 12)
],
),
),
SizedBox(
width: 16,
child: Text(
':',
textAlign: TextAlign.center,
style: Theme.of(context)
.textTheme
.titleMedium,
),
),
SizedBox(
width: 80,
child: TextField(
onChanged: (_) {
inputTimeController.setTime();
},
decoration: const InputDecoration(
hintText: 'MM',
border: InputBorder.none),
textAlign: TextAlign.center,
controller: inputTimeController
.inputMinutesController,
keyboardType: TextInputType.number,
inputFormatters: [
FilteringTextInputFormatter.allow(
RegExp(
'[1,2,3,4,5,6,7,8,9,0]')),
LengthLimitingTextInputFormatter(2),
LimitRange(00, 59)
],
),
),
const SizedBox(
width: 16,
),
DropdownButton(
underline: Container(),
value: inputTimeController.isAM.value
? 'AM'
: 'PM',
dropdownColor:
themeController.isLightMode.value
? kLightPrimaryBackgroundColor
: kprimaryBackgroundColor,
items:
['AM', 'PM'].map((String period) {
return DropdownMenuItem<String>(
value: period,
child: Text(period),
);
}).toList(),
onChanged: (getPeriod) {
inputTimeController
.changePeriod(getPeriod!);

inputTimeController.setTime();
},
)
],
),
);
})),
RepeatTile(
controller: controller,
themeController: themeController,
Expand Down
Loading

0 comments on commit 14ceed6

Please sign in to comment.