I want to have time picker where the user can't select time in the past like the show date picker where I can to select the first date which I want and the last date I want the same thing for the time. thanks

I try a different package but it's not work just one package which it is time_picker_widget which it accept to put a condition on the hour but when I put the condition on minute its disable all hour, I need to put the condition on minute because I want the select time to be not in the past and it after at less one hour from now.

CodePudding user response：

Try this

void selectDate() async {
    DateTime? pickedDate = await showDatePicker(
        context: Get.context!,
        initialDate: DateTime.now(),
        firstDate: DateTime.now(),
        //DateTime.now() - not to allow to choose before today.
        lastDate: DateTime(2030));

    if (pickedDate != null) {
      selectedDate.value = formatDate(date: pickedDate.toString());

    } else {}
  }

CodePudding user response：

you can try day_night_time_picker that allows you to set minMinutes or minHour

and here is an example how to use it:

                onPressed: () {
                    Navigator.of(context).push(
                      showPicker(
                        value: TimeOfDay.now(),
                        context: context,
                        onChange: (date) {},
                        minHour: TimeOfDay.now().hour.toDouble(),
                        minMinute: TimeOfDay.now().minute.toDouble(),
                      ),
                    );
                  },

CodePudding user response：

The package which you are using time_picker_widget (https://pub.dev/packages/time_picker_widget) has the option to disable certain minutes if you want.

First, create a list of int with contains the minutes which you want to display : -

final List<int> _availableMinutes = [0, 5, 10, 15, 30, 45, 50];

Then pass this list into the minute parameter of time_picker_widget : -

showCustomTimePicker(
                    context: context,
                    initialTime: TimeOfDay(
                        hour: _availableHours.first,
                        minute: _availableMinutes.first), // <-- minute parameter 
                        ....
                        ....

Full Code : -

import 'package:flutter/material.dart';
import 'package:time_picker_widget/time_picker_widget.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Show Custom Time Picker Demo',
      home: CustomTimePickerDemo(),
    );
  }
}

class CustomTimePickerDemo extends StatefulWidget {
  @override
  _CustomTimePickerDemoState createState() => _CustomTimePickerDemoState();
}

class _CustomTimePickerDemoState extends State<CustomTimePickerDemo> {
  String? selectedTime;

  final List<int> _availableHours = [1, 4, 6, 8, 12, 16, 18];
  final List<int> _availableMinutes = [
    0,
    10,
    30,
    45,
    50
  ]; // add or remove minutes from the list as per your need.

  @override
  Widget build(BuildContext context) => Scaffold(
        body: Center(
          child: InkWell(
            onTap: () => showCustomTimePicker(
                context: context,
                onFailValidation: (context) => null,
                initialTime: TimeOfDay(
                    hour: _availableHours.first,
                    minute: _availableMinutes
                        .first), // pass the list here to filter the minutes
                selectableTimePredicate: (time) =>
                    _availableHours.contains(time!.hour) &&
                    _availableMinutes.contains(time.minute)).then(
                (time) => setState(() => selectedTime = time?.format(context))),
            child: Text(
              selectedTime ?? 'Select Time',
              style: const TextStyle(fontSize: 55, fontWeight: FontWeight.bold),
            ),
          ),
        ),
      );
}

Output : -