Home > database >  flutter: How to disable past time in timepicker?
flutter: How to disable past time in timepicker?

Time:03-11

Here I want to disable past time in time picker.

First, if I am choosing current date after that I will go to choose time but here I want to show only remainig time from current time and past time should be disable.

This thing wants only for current date, so this is posible or not if posible then how to do this please help.

This is my registration page code.

import 'package:cwc/ApiManager/api_magager.dart';
import 'package:cwc/ApiManager/api_response.dart';
import 'package:cwc/ApiManager/preference.dart';
import 'package:cwc/constants/constants.dart';
import 'package:cwc/constants/error_dialog.dart';
import 'package:cwc/constants/loader.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:intl/intl.dart';

class HealthHeroRegistration extends StatefulWidget {
  final HHName;

  const HealthHeroRegistration({Key? key, this.HHName}) : super(key: key);

  @override
  _HealthHeroRegistrationState createState() => _HealthHeroRegistrationState();
}

class _HealthHeroRegistrationState extends State<HealthHeroRegistration> {
  TextEditingController timeController = TextEditingController();
  TextEditingController dateController = TextEditingController();
  TextEditingController sessionPurposeController = TextEditingController();
  TextEditingController otherProblemController = TextEditingController();
  var _formKey = GlobalKey<FormState>();
  int _value = 0;
  var valueAsString = '';
  var fullTime;
  var selectDate = '';
  var selectOnlyDate = '';
  var selectOnlyMonth = '';
  var selectOnlyYear = '';
  DateTime selectedDate = DateTime.now();
  TimeOfDay selectedTime = TimeOfDay.now();

  @override
  void initState() {
    _formKey = GlobalKey<FormState>();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xffffffff),
      appBar: AppBar(
        iconTheme: IconThemeData(color: Color(0xff444444)),
        automaticallyImplyLeading: true,
        backgroundColor: Colors.white,
        elevation: 0.5,
        leading: InkWell(
          onTap: () {
            Navigator.pop(context);
          },
          child: Padding(
            padding: const EdgeInsets.only(left: 20.0),
            child: Icon(
              Icons.arrow_back_ios,
              color: Color(0xff444444),
            ),
          ),
        ),
      ),
      body: SingleChildScrollView(
        child: Container(
          padding: EdgeInsets.all(20),
          child: Form(
            key: _formKey,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text("HEALTH HERO REGISTRATION",
                        style: GoogleFonts.poppins(
                            color: Colors.grey.shade600,
                            fontSize: 12,
                            letterSpacing: 2.0,
                            fontWeight: FontWeight.w400),
                        textAlign: TextAlign.center),
                  ],
                ),
                SizedBox(
                  height: 20,
                ),
                Padding(
                  padding: const EdgeInsets.all(1.0),
                  child: Text(
                    "SESSION DATE",
                    style: GoogleFonts.poppins(
                      fontSize: 14,
                      color: Colors.grey,
                    ),
                  ),
                ),
                SizedBox(
                  height: 3.7,
                ),
                Container(
                  decoration: BoxDecoration(
                      color: Colors.grey[200],
                      borderRadius: BorderRadius.circular(8)),
                  child: InkWell(
                    onTap: () {
                      FocusScope.of(context).unfocus();
                      selectDateFromCal(context);
                    },
                    child: TextFormField(
                      enabled: false,
                      controller: dateController,
                      textAlign: TextAlign.left,
                      keyboardType: TextInputType.text,
                      decoration:  InputDecoration(
                        fillColor: Colors.white,
                        hintText: 'DD-MM-YYYY',
                        hintStyle: TextStyle(fontSize: 16,color: Colors.grey[700]),
                        border: OutlineInputBorder(
                          borderRadius: BorderRadius.all(Radius.circular(8.0)),
                          borderSide: BorderSide.none,
                        ),
                        filled: false,
                        contentPadding: EdgeInsets.only(
                          left: 16,
                        ),
                        suffixIcon: const Icon(
                          Icons.calendar_today_rounded,
                          color: Colors.grey,
                        ),
                      ),
                    ),
                  ),
                ),
                SizedBox(
                  height: 16,
                ),
                Padding(
                  padding: const EdgeInsets.all(1.0),
                  child: Text(
                    "SESSION TIME",
                    style: GoogleFonts.poppins(
                      fontSize: 14,
                      color: Colors.grey,
                    ),
                  ),
                ),
                SizedBox(
                  height: 3.7,
                ),
                Container(
                  decoration: BoxDecoration(
                      color: Colors.grey[200],
                      borderRadius: BorderRadius.circular(8)),
                  child: InkWell(
                    onTap: () {
                      _selectTime(context);
                    },
                    child: TextFormField(
                      enabled: false,
                      controller: timeController,
                      textAlign: TextAlign.left,
                      keyboardType: TextInputType.text,
                      decoration:  InputDecoration(
                        fillColor: Colors.white,
                        hintText: '00:00',
                        hintStyle: TextStyle(fontSize: 16,color: Colors.grey[700]),
                        border: OutlineInputBorder(
                          borderRadius: BorderRadius.all(Radius.circular(8.0)),
                          borderSide: BorderSide.none,
                        ),
                        filled: false,
                        contentPadding: EdgeInsets.only(
                          left: 16,
                        ),
                        suffixIcon: const Icon(
                          Icons.watch_later_outlined,
                          color: Colors.grey,
                        ),
                      ),
                    ),
                  ),
                ),
                SizedBox(
                  height: 16,
                ),
                Padding(
                  padding: const EdgeInsets.all(1.0),
                  child: Text(
                    "SESSION PURPOSE",
                    style: GoogleFonts.poppins(
                      fontSize: 14,
                      color: Colors.grey,
                    ),
                  ),
                ),
                SizedBox(
                  height: 3.7,
                ),
                Container(
                  decoration: BoxDecoration(
                      color: Colors.grey[200],
                      borderRadius: BorderRadius.circular(8)),
                  child: TextFormField(
                    controller: sessionPurposeController,
                    textAlign: TextAlign.left,
                    keyboardType: TextInputType.text,
                    decoration: const InputDecoration(
                      fillColor: Colors.white,
                      hintText: 'Your Session Purpose',
                      hintStyle: TextStyle(fontSize: 16),
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.all(Radius.circular(8.0)),
                        borderSide: BorderSide.none,
                      ),
                      filled: false,
                      contentPadding: EdgeInsets.only(
                        left: 16,
                      ),
                    ),
                  ),
                ),
                SizedBox(
                  height: 16,
                ),
                Padding(
                  padding: const EdgeInsets.all(1.0),
                  child: Text(
                    "OTHER PROBLEMS",
                    style: GoogleFonts.poppins(
                      fontSize: 14,
                      color: Colors.grey,
                    ),
                  ),
                ),
                SizedBox(
                  height: 3.7,
                ),
                Container(
                  decoration: BoxDecoration(
                      color: Colors.grey[200],
                      borderRadius: BorderRadius.circular(8)),
                  child: TextFormField(
                    maxLines: 4,
                    controller: otherProblemController,
                    textAlign: TextAlign.left,
                    keyboardType: TextInputType.text,
                    decoration: const InputDecoration(
                      fillColor: Colors.white,
                      hintText: 'Your Problems',
                      hintStyle: TextStyle(fontSize: 16),
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.all(Radius.circular(8.0)),
                        borderSide: BorderSide.none,
                      ),
                      filled: false,
                      contentPadding: EdgeInsets.only(left: 16, top: 20),
                    ),
                  ),
                ),

                SizedBox(
                  height: 16,
                ),
                Padding(
                  padding: const EdgeInsets.all(1.0),
                  child: Text(
                    "ARU YOU OPEN TO GET CONSULTATION?",
                    style: GoogleFonts.poppins(
                      fontSize: 14,
                      color: Colors.grey,
                    ),
                  ),
                ),
                SizedBox(
                  height: 3.7,
                ),
                Row(
                  children: [
                    MyRadioListTile<int>(
                        value: 1,
                        groupValue: _value,
                        title: Text(
                          "Yes",
                          style: GoogleFonts.poppins(
                            fontSize: 14,
                            color: Colors.grey,
                          ),
                        ),
                        onChanged: (value) {
                          setState(() {
                            _value = value!;
                            valueAsString = "Yes";
                            print(_value);
                            print(valueAsString);
                          });
                        }),
                    SizedBox(
                      width: 30,
                    ),
                    MyRadioListTile<int>(
                        value: 2,
                        groupValue: _value,
                        title: Text(
                          "No",
                          style: GoogleFonts.poppins(
                            fontSize: 14,
                            color: Colors.grey,
                          ),
                        ),
                        onChanged: (value) {
                          setState(() {
                            _value = value!;
                            valueAsString = "No";
                            print(_value);
                            print(valueAsString);
                          });
                        }),
                  ],
                ),
                // Row(children: [Row(
                //   mainAxisAlignment: MainAxisAlignment.spaceBetween,
                //   children: [
                //     Padding(
                //       padding: const EdgeInsets.symmetric(
                //           horizontal: 5.0, vertical: 4),
                //       child:
                //       Text(
                //         "Yes",
                //         style: GoogleFonts.poppins(
                //           fontSize: 14,
                //           color: Colors.black,
                //         ),
                //       ),
                //     ),
                //     Theme(
                //       data: ThemeData(
                //           unselectedWidgetColor: Colors.green),
                //       child: Checkbox(
                //         shape: RoundedRectangleBorder(
                //           borderRadius: BorderRadius.circular(3.0),
                //         ),
                //         checkColor: Colors.black,
                //         value: agree,
                //         activeColor: Colors.white,
                //         onChanged: (value) {
                //           setState(() {
                //             agree = value;
                //           });
                //         },
                //       ),
                //     ),
                //   ],
                // ),
                //   Row(
                //     mainAxisAlignment: MainAxisAlignment.spaceBetween,
                //     children: [
                //       Padding(
                //         padding: const EdgeInsets.symmetric(
                //             horizontal: 5.0, vertical: 4),
                //         child:
                //         Text(
                //           "No",
                //           style: GoogleFonts.poppins(
                //             fontSize: 14,
                //             color: Colors.black,
                //           ),
                //         ),
                //       ),
                //       Theme(
                //         data: ThemeData(
                //             unselectedWidgetColor: Colors.green),
                //         child: Checkbox(
                //           shape: RoundedRectangleBorder(
                //             borderRadius: BorderRadius.circular(3.0),
                //           ),
                //           checkColor: Colors.black,
                //           value: agree,
                //           activeColor: Colors.grey,
                //           onChanged: (value) {
                //             setState(() {
                //               agree = value;
                //             });
                //           },
                //         ),
                //       ),
                //     ],
                //   ),],)
              ],
            ),
          ),
        ),
      ),
      bottomNavigationBar: Container(
        padding: EdgeInsets.only(left: 16, right: 16, top: 8, bottom: 16),
        child: SizedBox(
          height: 48,
          child: ElevatedButton(
            style: ButtonStyle(
              elevation: MaterialStateProperty.all(0),
              foregroundColor: MaterialStateProperty.all<Color>(Colors.white),
              backgroundColor:
                  MaterialStateProperty.all<Color>(Color(0xFFF2A6A4)),
              shape: MaterialStateProperty.all<RoundedRectangleBorder>(
                RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(10),
                  side: BorderSide(color: Color(0xFFF2A6A4)),
                ),
              ),
            ),
            onPressed: () {
                didTapOnResister();
            },
            child: Text(
              'Register Now',
              style: GoogleFonts.poppins(fontSize: 14, color: Colors.white),
            ),
          ),
        ),
      ),
    );
  }
}

extension HelpingMethod on _HealthHeroRegistrationState {
  Future<void> selectDateFromCal(BuildContext context) async {
    final DateTime? picked = await showDatePicker(
        context: context,
        initialDate: selectedDate,
        firstDate: DateTime.now(),
        lastDate: DateTime(2100, 12),
        builder: (BuildContext context, Widget? child) {
          return Theme(
            data: ThemeData.light().copyWith(
              colorScheme: ColorScheme.light().copyWith(
                primary: selectBlueColor,
              ),
            ),
            child: child!,
          );
        });
    if (picked != null && picked != selectedDate)
      setState(() {
        final DateFormat formatter = DateFormat('dd-MM-yyyy');
        final String formatted = formatter.format(picked);
        print(formatted);
        dateController.text = formatted;
        final DateFormat format = DateFormat('yyyy-MM-dd');
        final String formattedd = format.format(picked);
        selectDate = formattedd;
        final DateFormat NumDate = DateFormat('d');
        final String FormattedNumDate = NumDate.format(picked);
        final DateFormat NumMonth = DateFormat('M');
        final String FormattedNumMonth = NumMonth.format(picked);
        final DateFormat NumYear = DateFormat('y');
        final String FormattedNumYear = NumYear.format(picked);
        selectOnlyDate =FormattedNumDate.toString();
        selectOnlyMonth =FormattedNumMonth.toString();
        selectOnlyYear =FormattedNumYear.toString();
        print(selectOnlyDate);
        print(selectOnlyMonth);
        print(selectOnlyYear);
        timeController.text='';
      });
  }

  Future<void> _selectTime(BuildContext context) async {
    final TimeOfDay? picked_s = await showTimePicker(
        context: context,
        initialTime: selectedTime,
        builder: (BuildContext context, Widget? child) {
          return Theme(
            data: ThemeData.light().copyWith(
              colorScheme: ColorScheme.light().copyWith(
                primary: selectBlueColor,
              ),
            ),
            child: MediaQuery(
              data:
                  MediaQuery.of(context).copyWith(alwaysUse24HourFormat: false),
              child: child!,
            ),
          );
        });
try{
    if (picked_s != null && picked_s != selectedTime) {
      setState(() {
        selectedTime = picked_s;
        print(selectedTime);
        timeController.text = formatTimeOfDay(selectedTime);
        formatTimeOfDay(selectedTime);
      });
    } else if (picked_s != null) {
      formatTimeOfDay(selectedTime);
      print(selectedTime);
      timeController.text = formatTimeOfDay(selectedTime);
    }
  }catch(e){
  showToast("First you choose date.", blackColor);
  }
}

  String formatTimeOfDay(TimeOfDay tod) {
    final now = new DateTime.now();
    final dt = DateTime(int.parse(selectOnlyYear), int.parse(selectOnlyMonth), int.parse(selectOnlyDate), tod.hour, tod.minute);
    fullTime = dt;
    print(fullTime.toIso8601String());
    final format = DateFormat.jm(); //"6:00 AM"
    return format.format(dt);
  }


}


class MyRadioListTile<T> extends StatelessWidget {
  final T value;
  final T groupValue;
  final Widget? title;
  final ValueChanged<T?> onChanged;

  const MyRadioListTile({
    required this.value,
    required this.groupValue,
    required this.onChanged,
    this.title,
  });

  @override
  Widget build(BuildContext context) {
    final title = this.title;
    return InkWell(
      onTap: () => onChanged(value),
      child: Container(
        height: 21,
        padding: EdgeInsets.only(right: 8),
        child: Row(
          children: [
            if (title != null) title,
            SizedBox(width: 10),
            _customRadioButton,
          ],
        ),
      ),
    );
  }

  Widget get _customRadioButton {
    final isSelected = value == groupValue;
    return Container(
      height: 21,
      width: 21,

      decoration: BoxDecoration(
        color: isSelected ? selectBlueColor : null,
        borderRadius: BorderRadius.circular(4),
        border: Border.all(
          color: isSelected ? selectBlueColor : Colors.grey[300]!,
          width: 2,
        ),
      ),
      // child: Text(
      //   leading,
      //   style: TextStyle(
      //     // color: isSelected ? Colors.white : Colors.grey[600]!,
      //     color:Colors.white,
      //     fontWeight: FontWeight.bold,
      //     fontSize: 15,
      //   ),
      child: Center(
          child: Icon(
        Icons.check,
        color: Colors.white,
        size: 18,
      )),
    );
  }
}

CodePudding user response:

Hi showTimePicker not supporting time limit. You can read this comment. I think you can use cupertino timer picker

CodePudding user response:

You can use a syncfusion_flutter_datepicker package to achieve your result

First Install the latest version in your package's pubspec.yaml

dependencies:
  syncfusion_flutter_datepicker: ^19.4.55

And Import the following package in your file.

import 'package:syncfusion_flutter_datepicker/datepicker.dart';

Add the SfDateRangePicker widget as a child of any widget. In below example this widget is added as a child of the scaffold widget.

To disable previous dates, set the enablePastDates attribute value as false like below

@override
Widget build(BuildContext context) {
  return Scaffold(
      body: Container(
    child: SfDateRangePicker(
       enablePastDates: false,
    ),
  ));
}
  • Related