Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to display the date in custom format in Flutter

Tags:

flutter

I want to pick the date and print it in the custom format( DD-MM-YYYY). Am able to do that using the following code. However when I pick the date from date picker still the current date is displaying not the picked date. There is a problem in my setState it seems. But am unable to trace it.

import 'package:checkboxtest/report.dart';
import 'package:flutter/material.dart';


class Date extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
          primarySwatch: Colors.blue,
          textTheme: TextTheme(body1: TextStyle(fontSize: 21))),
      home: Home(),
    );
  }
}

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

class _HomeState extends State<Home> {
  DateTime _date = DateTime.now();
  static var date1 = DateTime.now();
  var customDate = "${date1.day}-${date1.month}-${date1.year}";
    
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(_date == null
                ? 'Today'
                : "${date1.day.toString().padLeft(2, '0')}-${date1.month.toString().padLeft(2, '0')}-${date1.year.toString()}"),
            RaisedButton.icon(
              color: Colors.teal,
              icon: Icon(Icons.calendar_today),
              label: Text('Pick Date'),

              onPressed: () {
                
                showDatePicker(
                        context: context,
                        initialDate: _date == null ? DateTime.now() : _date,
                        firstDate: DateTime(2001),
                        lastDate: DateTime(2021))
                    .then((date) {
                  setState(() {
                    
                   customDate =
                   "${date.day.toString().padLeft(2, '0')}-${date.month.toString().padLeft(2, '0')}-${date.year.toString()}";
                  });
                });
              },
            ),
           ],
        ),
      ),
    );
  }
}
like image 786
raj Avatar asked Nov 17 '25 13:11

raj


1 Answers

to format date, you can use dateFormatter first, make your date formater object

DateFormat dateFormat = DateFormat("yyyy-MM-dd HH:mm:ss");

this is example of date format date is displayed according to this format you can use any format here

yyyy-MM-dd HH:mm:ss

check formats from this link https://pub.dev/documentation/intl/latest/intl/DateFormat-class.html

after that, you need to parse the date, which you want to format, to get a date in string

String string = dateFormat.format(DateTime.now());

use parse to get the date in String Object

DateTime dateTime = dateFormat.parse("2019-07-19 8:40:23");
like image 154
rishabh mistry Avatar answered Nov 20 '25 05:11

rishabh mistry



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!