Flutter: DateTime format - flutter

Question

Sorry if the code isn't well formatted.
I had a look to the other related subjects but i can't get it right (apparently the best way is .toDate() ). I am a newb so, I am not sure where to do it right. The code works fine but the date in the chat is not user friendly so I wanted to format DateTime.now() to be 'yMd' way (this piece of code 'time': DateFormat('yMd').format(DateTime.now()),) . If I use the DateTime.now() works fine. And "$sender ${time.toDate()}",
enter image description here
So this is the format that I get following the tuto, but I wanted to make it more simple...
final _firestore = FirebaseFirestore.instance;
User loggedInUser;
class ChatScreen extends StatefulWidget {
static const String id = 'chat_screen';
#override
_ChatScreenState createState() => _ChatScreenState();
}
class _ChatScreenState extends State<ChatScreen> {
final messageTextController = TextEditingController();
final _auth = FirebaseAuth.instance;
String messageText;
#override
void initState() {
super.initState();
getCurrentUser();
}
void getCurrentUser() async {
try {
final user = _auth.currentUser;
if (user != null) {
loggedInUser = user;
print(loggedInUser.email);
}
} catch (e) {
print(e);
}
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: null,
actions: <Widget>[
IconButton(
icon: Icon(Icons.close),
onPressed: () {
// getMessages();
// messagesStream();
_auth.signOut();
Navigator.pop(context);
}),
],
title: Text('⚡️Chat'),
backgroundColor: Colors.lightBlueAccent,
),
body: SafeArea(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
MessagesStream(),
Container(
decoration: kMessageContainerDecoration,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Expanded(
child: TextField(
controller: messageTextController,
onChanged: (value) {
messageText = value;
},
decoration: kMessageTextFieldDecoration,
),
),
TextButton(
onPressed: () {
messageTextController.clear();
_firestore.collection('messages').add({
'text': messageText,
'sender': loggedInUser.email,
'time': DateFormat('yMd').format(DateTime.now()),
});
},
child: Text(
'Send',
style: kSendButtonTextStyle,
),
),
],
),
),
],
),
),
);
}
}
class MessagesStream extends StatelessWidget {
#override
Widget build(BuildContext context) {
return StreamBuilder<QuerySnapshot>(
//de donde vienen los mensajes (data)
stream: _firestore.collection('messages').snapshots(),
//
builder: (context, snapshot) {
if (!snapshot.hasData) {
return Center(
child: CircularProgressIndicator(
backgroundColor: Colors.lightBlueAccent,
),
);
}
final messages = snapshot.data.docs.reversed;
List<MessageBubble> messageBubbles = [];
for (var message in messages) {
final messageText = message.data()['text'];
final messageSender = message.data()['sender'];
final messageTime = message.data()['time'];
final currentUser = loggedInUser.email;
final messageWidget = MessageBubble(
text: messageText,
sender: messageSender,
isMe: currentUser == messageSender,
time: messageTime,
);
messageBubbles.add(messageWidget);
messageBubbles.sort((a, b) => b.time.compareTo(a.time));
}
return Expanded(
child: ListView(
reverse: true,
padding: EdgeInsets.symmetric(
horizontal: 10,
vertical: 20,
),
children: messageBubbles,
),
);
},
);
}
}
class MessageBubble extends StatelessWidget {
MessageBubble({this.sender, this.text, this.isMe, this.time});
final String sender;
final String text;
final bool isMe;
final Timestamp time; //added
#override
Widget build(BuildContext context) {
return Padding(
padding: EdgeInsets.all(10.0),
child: Column(
crossAxisAlignment:
isMe ? CrossAxisAlignment.end : CrossAxisAlignment.start,
children: <Widget>[
Text(
"$sender ${time.toDate()}",
style: TextStyle(fontSize: 11.0, color: Colors.black54),
),
Material(
borderRadius: isMe
? BorderRadius.only(
bottomLeft: Radius.circular(30.0),
bottomRight: Radius.circular(30.0),
topLeft: Radius.circular(30.0),
)
: BorderRadius.only(
bottomLeft: Radius.circular(30.0),
bottomRight: Radius.circular(30.0),
topRight: Radius.circular(30.0),
),
elevation: 9.0,
color: isMe
? Colors.lightBlueAccent
: Colors.redAccent, //Colors.lightBlueAccent,
child: Padding(
padding: EdgeInsets.symmetric(
horizontal: 20.0,
vertical: 10.0,
),
child: Text(
'$text',
style: TextStyle(
color: isMe ? Colors.white : Colors.black54,
fontWeight: FontWeight.bold,
fontSize: 15.0,
),
),
),
),
],
),
);
}
}

Answer 1

Timestamp is an integer.
"$sender ${DateTime.fromMillisecondsSinceEpoch(timestamp)}"

Answer 2

Firestore gives you timestamps with its Timestamp class, which represents an epoch timestamp (i.e. milliseconds/microseconds since the epoch, a.k.a. January 1st, 1970 at 12:00 AM UTC). You will have to convert this to a date before you can format it.
As far as the actual formatting, the most straightforward way to do this is with the intl package. There is a DateFormat class with presets for all the common formatting options, including "yMd":
import 'package:intl/intl.dart';
...
final now = Timestamp.now();
final formatted = DateFormat.yMd().format(now.toDate());