skip to Main Content

Here is the example for monthly pattern what i have tried. Date need to get increment on tap of buttons. Increment and decrement buttons to add and subtract dates.

How to increase weekly format?

import 'package:flutter/material.dart';
import 'package:flutter_base/src/common_widget/custom_app_bar.dart';
import 'package:flutter_base/utils/app_colors.dart';
import 'package:flutter_base/utils/decorations.dart';

class DateCounter extends StatefulWidget {
  const DateCounter({Key? key}) : super(key: key);

  @override
  State<DateCounter> createState() => _DateCounterState();
}

class _DateCounterState extends State<DateCounter> {
  var _selectedMonthlyStartDate = DateTime.now();
  final _inputStartFormat = DateFormat('dd-MM-yyyy');
  var month;
  var monthEnd;
  late DateTime startDateTime;
  late DateTime endDateTime;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    startDateTime = DateTime(DateTime.now().year, DateTime.now().month, 1);
    month = _inputStartFormat.format(startDateTime);

    endDateTime = DateTime(DateTime.now().year, DateTime.now().month + 1, 0);
    monthEnd = _inputStartFormat.format(endDateTime);
  }

  //output : 19-02-23 to 25-02-23 how to increase this weekly format
  DateTime findFirstDateOfTheWeek(DateTime dateTime) {
    return dateTime.subtract(Duration(days: dateTime.weekday));
  }

  DateTime findLastDateOfTheWeek(DateTime dateTime) {
    return dateTime.add(Duration(days: DateTime.daysPerWeek - dateTime.weekday - 1));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CustomAppBar(
        context,
        isTrailingButtonLastVisible: false,
        isBackButtonVisible: true,
        titleVisible: true,
        titleColor: AppColors.colorBlack,
        fontWeight: FontWeight.bold,
        fontSize: 16,
        isTrailingButtonVisible: true,
      
      ),
      body: Center(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
          children: [
            InkWell(
              onTap: (){
                monthSubtractFunc();
              }, child: Container(
              width: 30,
                height: 30,
                color: Colors.grey,
                child: const Center(child: Text("-")))),
            Text("$month To $monthEnd"),
            InkWell(
              onTap: (){
                monthAddFunc();
              },
                child: Container(
                  width: 30,
                    height: 30,
                    color: Colors.grey,
                    child: Center(child: Text("+"))))
          ],
        ),
      ),
    );
  }

  void monthAddFunc(){
    _selectedMonthlyStartDate = DateTime(_selectedMonthlyStartDate.year,
        _selectedMonthlyStartDate.month + 1, 1);
    month = _inputStartFormat.format(_selectedMonthlyStartDate);
    _selectedMonthlyStartDate = DateTime(_selectedMonthlyStartDate.year,
        _selectedMonthlyStartDate.month + 1, 0);
    monthEnd = _inputStartFormat.format(_selectedMonthlyStartDate);
    setState(() {});
  }

  void monthSubtractFunc(){
    _selectedMonthlyStartDate = DateTime(_selectedMonthlyStartDate.year,
        _selectedMonthlyStartDate.month - 1, 1);
    month = _inputStartFormat.format(_selectedMonthlyStartDate);
    _selectedMonthlyStartDate = DateTime(_selectedMonthlyStartDate.year,
        _selectedMonthlyStartDate.month + 1, 0);
    monthEnd = _inputStartFormat.format(_selectedMonthlyStartDate);
    setState(() {});
  }
}

My output need to be like "01-01-2023" to "31-03-2023" => positive tap => "01-04-2023" to "30-06-2023" negative button reduces 3 month.

If anyone knows the solution please help…thanks.

2

Answers


  1. I guess what you’re missing is, there is a build in function inside DateTime class. Which lets you do this :

    DateTime startTime = DateTime.now();
    startTime.add(const Duration(day: 60)); // Adds two month.
    

    Also you can do something like this

    DateTime startTime = DateTime.now();
    startTime.copyWith(
    month: startTime.month + 2,
    ); // Adds two month.
    

    But this approach can make issues if like you add more than 12 months. So for this one you will need to like do some checking and extra work.

    Login or Signup to reply.
  2. Add two functions:

      DateTime endDate(DateTime startDate) {
        return DateTime(startDate.year, startDate.month + 3, 1).add(const Duration(days: -1));
      }
    
      DateTime addMonths(DateTime date, int months) {
        return DateTime(date.year, date.month + months, 1);
      }
    

    Then call them in your init:

      void initState() {
        super.initState();
        startDateTime = DateTime(DateTime.now().year, DateTime.now().month, 1);
        endDateTime = endDate(startDateTime);
      }
    

    And in your increase/decrease functions:

      void monthAddFunc() {
        startDateTime = addMonths(startDateTime, 3);
        endDateTime = endDate(startDateTime);
        setState(() {});
      }
    
      void monthSubtractFunc() {
        startDateTime = addMonths(startDateTime, -3);
        endDateTime = endDate(startDateTime);
        setState(() {});
      }
    

    Then use whatever format you want to display the dates.

    The endDate function is creating a new date based on the input date, adding three months and setting it to the first of that month. Then removing one day in order to get the correct last day of the month.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search