chore: Nicer message animation

This commit is contained in:
krille-chan 2024-05-20 17:25:09 +02:00
commit 3d7dbf7ddf
No known key found for this signature in database

View file

@ -144,11 +144,12 @@ class Message extends StatelessWidget {
setState(resetAnimateIn); setState(resetAnimateIn);
}); });
} }
return AnimatedSlide( return AnimatedSize(
offset: Offset(0, animateIn ? 1 : 0),
duration: FluffyThemes.animationDuration, duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve, curve: FluffyThemes.animationCurve,
child: Stack( child: animateIn
? const SizedBox.shrink()
: Stack(
children: [ children: [
Positioned( Positioned(
top: 0, top: 0,
@ -201,7 +202,8 @@ class Message extends StatelessWidget {
child: event.status == EventStatus.error child: event.status == EventStatus.error
? const Icon(Icons.error, color: Colors.red) ? const Icon(Icons.error, color: Colors.red)
: event.fileSendingStatus != null : event.fileSendingStatus != null
? const CircularProgressIndicator.adaptive( ? const CircularProgressIndicator
.adaptive(
strokeWidth: 1, strokeWidth: 1,
) )
: null, : null,
@ -212,8 +214,8 @@ class Message extends StatelessWidget {
FutureBuilder<User?>( FutureBuilder<User?>(
future: event.fetchSenderUser(), future: event.fetchSenderUser(),
builder: (context, snapshot) { builder: (context, snapshot) {
final user = final user = snapshot.data ??
snapshot.data ?? event.senderFromMemoryOrFallback; event.senderFromMemoryOrFallback;
return Avatar( return Avatar(
mxContent: user.avatarUrl, mxContent: user.avatarUrl,
name: user.calcDisplayname(), name: user.calcDisplayname(),
@ -231,26 +233,27 @@ class Message extends StatelessWidget {
children: [ children: [
if (!nextEventSameSender) if (!nextEventSameSender)
Padding( Padding(
padding: padding: const EdgeInsets.only(
const EdgeInsets.only(left: 8.0, bottom: 4), left: 8.0, bottom: 4),
child: ownMessage || event.room.isDirectChat child: ownMessage || event.room.isDirectChat
? const SizedBox(height: 12) ? const SizedBox(height: 12)
: FutureBuilder<User?>( : FutureBuilder<User?>(
future: event.fetchSenderUser(), future: event.fetchSenderUser(),
builder: (context, snapshot) { builder: (context, snapshot) {
final displayname = final displayname = snapshot.data
snapshot.data?.calcDisplayname() ?? ?.calcDisplayname() ??
event.senderFromMemoryOrFallback event.senderFromMemoryOrFallback
.calcDisplayname(); .calcDisplayname();
return Text( return Text(
displayname, displayname,
style: TextStyle( style: TextStyle(
fontSize: 12, fontSize: 12,
color: color: (Theme.of(context)
(Theme.of(context).brightness == .brightness ==
Brightness.light Brightness.light
? displayname.color ? displayname.color
: displayname.lightColorText), : displayname
.lightColorText),
), ),
); );
}, },
@ -278,7 +281,8 @@ class Message extends StatelessWidget {
duration: FluffyThemes.animationDuration, duration: FluffyThemes.animationDuration,
curve: FluffyThemes.animationCurve, curve: FluffyThemes.animationCurve,
child: Material( child: Material(
color: noBubble ? Colors.transparent : color, color:
noBubble ? Colors.transparent : color,
clipBehavior: Clip.antiAlias, clipBehavior: Clip.antiAlias,
shape: RoundedRectangleBorder( shape: RoundedRectangleBorder(
borderRadius: borderRadius, borderRadius: borderRadius,
@ -296,7 +300,8 @@ class Message extends StatelessWidget {
vertical: 8, vertical: 8,
), ),
constraints: const BoxConstraints( constraints: const BoxConstraints(
maxWidth: FluffyThemes.columnWidth * 1.5, maxWidth:
FluffyThemes.columnWidth * 1.5,
), ),
child: Column( child: Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
@ -306,10 +311,12 @@ class Message extends StatelessWidget {
if (event.relationshipType == if (event.relationshipType ==
RelationshipTypes.reply) RelationshipTypes.reply)
FutureBuilder<Event?>( FutureBuilder<Event?>(
future: event.getReplyEvent(timeline), future: event
builder: .getReplyEvent(timeline),
(BuildContext context, snapshot) { builder: (BuildContext context,
final replyEvent = snapshot.hasData snapshot) {
final replyEvent = snapshot
.hasData
? snapshot.data! ? snapshot.data!
: Event( : Event(
eventId: event eventId: event
@ -318,27 +325,33 @@ class Message extends StatelessWidget {
'msgtype': 'm.text', 'msgtype': 'm.text',
'body': '...', 'body': '...',
}, },
senderId: event.senderId, senderId:
type: 'm.room.message', event.senderId,
type:
'm.room.message',
room: event.room, room: event.room,
status: EventStatus.sent, status:
EventStatus.sent,
originServerTs: originServerTs:
DateTime.now(), DateTime.now(),
); );
return Padding( return Padding(
padding: const EdgeInsets.only( padding:
const EdgeInsets.only(
bottom: 4.0, bottom: 4.0,
), ),
child: InkWell( child: InkWell(
borderRadius: borderRadius: ReplyContent
ReplyContent.borderRadius, .borderRadius,
onTap: () => scrollToEventId( onTap: () =>
scrollToEventId(
replyEvent.eventId, replyEvent.eventId,
), ),
child: AbsorbPointer( child: AbsorbPointer(
child: ReplyContent( child: ReplyContent(
replyEvent, replyEvent,
ownMessage: ownMessage, ownMessage:
ownMessage,
timeline: timeline, timeline: timeline,
), ),
), ),
@ -361,18 +374,20 @@ class Message extends StatelessWidget {
top: 4.0, top: 4.0,
), ),
child: Row( child: Row(
mainAxisSize: MainAxisSize.min, mainAxisSize:
MainAxisSize.min,
children: [ children: [
Icon( Icon(
Icons.edit_outlined, Icons.edit_outlined,
color: textColor.withAlpha(164), color: textColor
.withAlpha(164),
size: 14, size: 14,
), ),
Text( Text(
' - ${displayEvent.originServerTs.localizedTimeShort(context)}', ' - ${displayEvent.originServerTs.localizedTimeShort(context)}',
style: TextStyle( style: TextStyle(
color: color: textColor
textColor.withAlpha(164), .withAlpha(164),
fontSize: 12, fontSize: 12,
), ),
), ),