Unable to overwrite a Dart/Flutter value - setting today's date correctly on pressing button

Question

apologies for a simple question but I just started my Dart/Flutter hobby and ran into the following issue: I wanted a simple App that has a defined end date ("dt1") and caluclates the days left based on today's date. I got it to work hardcoding the start date ("dt2) but when I wanted to add a button that gets today's date to overwrite the pre-set start date ("dt2"), it just doesnt acknowledge it - instead it sticks with the dt2 date that I've set earlier.

How do I modify my code so that dt2 gets overwriten by the pressing the button and replaced the value in dt2 with today's date?

Any help is much appreciated!

import 'package:flutter/material.dart';

void main() {
runApp(MaterialApp(home: Home()));
}

class Home extends StatefulWidget {
@override
State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
@override
Widget build(BuildContext context) {
DateTime dt1 = DateTime.parse("2022-06-01");
DateTime dt2 = DateTime.parse("2022-01-01");
Duration diff = dt1.difference(dt2);

return Scaffold(
    appBar: AppBar(
      title: const Text("Time left at work"),
      centerTitle: true,
      backgroundColor: const Color.fromARGB(255, 131, 48, 75),
    ),
    body: Container(
      alignment: Alignment.center,
      color: Colors.black,
      padding: const EdgeInsets.all(20),
      child: Column(children: [
        TextButton(
          onPressed: () {
            DateTime dt2 = DateTime.now();
            Duration diff = dt1.difference(dt2);
            print(dt2);
          },
          child: const Text(
            "Refresh current date",
            style: TextStyle(
              color: Colors.deepOrange,
              fontWeight: FontWeight.bold,
              fontSize: 10.0,
            ),
          ),
        ),
        Text(
          "Days left: " + diff.inDays.toString(),
          style: const TextStyle(
            color: Colors.white,
            fontWeight: FontWeight.bold,
            fontSize: 40.0,
          ),
        ),
      ]),
    ));
  }
}

Answer 1

This is the current revised code:

import 'package:flutter/material.dart';

void main() {
runApp(const MaterialApp(home: Home()));
}

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

@override
State<Home> createState() => _HomeState();
}

class _HomeState extends State<Home> {
  DateTime dt1 = DateTime.parse("2022-06-01");
DateTime dt2 = DateTime.parse("2022-01-01");

Duration get diff => dt1.difference(dt2);

@override
Widget build(BuildContext context) {
return Scaffold(
    appBar: AppBar(
      title: const Text("Work Terminator"),
      centerTitle: true,
      backgroundColor: Colors.grey[850],
    ),
    body: Container(
      alignment: Alignment.center,
      color: Colors.black,
      padding: const EdgeInsets.all(20),
      child: Column(children: [
        TextButton(
          onPressed: () {
            print(dt2);
            dt2 = DateTime.now();
          },
          child: const Text(
            "Refresh current date",
            style: TextStyle(
              color: Colors.deepOrange,
              fontWeight: FontWeight.bold,
              fontSize: 10.0,
            ),
          ),
        ),
        Text(
          "Days left: " + diff.inDays.toString(),
          style: const TextStyle(
            color: Colors.white,
            fontWeight: FontWeight.bold,
            fontSize: 40.0,
          ),
        ),
      ]),
    ));
 }
}

Answer 2

Remove this code from your build and onPressed functions

DateTime dt1 = DateTime.parse("2022-06-01");
DateTime dt2 = DateTime.parse("2022-01-01");
Duration diff = dt1.difference(dt2);

Declare dt1 and dt2 as your _HomeState fields

class _HomeState extends State<Home> {
DateTime dt1 = DateTime.parse("2022-06-01");
DateTime dt2 = DateTime.parse("2022-01-01");

Declare getter named diff in your _HomeState

 class _HomeState extends State<Home> {
    DateTime dt1 = DateTime.parse("2022-06-01");
    DateTime dt2 = DateTime.parse("2022-01-01");
   
    Duration get diff => dt1.difference(dt2);

And finally in onPressed (IMPORTANT TO WRAP WITH setState in order to update UI ):

 onPressed: () {
        setState((){
           dt2 = DateTime.now()
        });
      },

Answer 3

When you want to change the value of a variable, you must use setState.

Because, you want to change the value at runtime and update UI.

setState(() {
    var_you_want_change = new_value_of_the_var;
  });

Try this in the onPressed:

    onPressed: () {
  dt2 = DateTime.now();
  diff = dt1.difference(dt2);
  print(dt2);
  setState(() {
      diff = dt1.difference(dt2);
  });
},