HyperNet/Surface
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

💄 Optimize attachment list

Browse Source
This commit is contained in:
LittleSheep 2025-01-01 17:57:41 +08:00
parent a3c8dafff9
commit f614da7918
5 changed files with 205 additions and 203 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
lib/screens/chat/room.dart
View File

@ -281,11 +281,7 @@ class _ChatRoomScreenState extends State<ChatRoomScreen> {
Expanded( Expanded(
child: InfiniteList( child: InfiniteList(
reverse: true, reverse: true,
padding: const EdgeInsets.only( padding: const EdgeInsets.only(top: 12),
left: 12,
right: 12,
top: 12,
),
hasReachedMax: _messageController.isAllLoaded, hasReachedMax: _messageController.isAllLoaded,
itemCount: _messageController.messages.length, itemCount: _messageController.messages.length,
isLoading: _messageController.isLoading, isLoading: _messageController.isLoading,
@ -311,23 +307,20 @@ class _ChatRoomScreenState extends State<ChatRoomScreen> {
return Align( return Align(
alignment: Alignment.centerLeft, alignment: Alignment.centerLeft,
child: Container( child: ChatMessage(
constraints: BoxConstraints(maxWidth: 480), data: message,
child: ChatMessage( isMerged: canMerge,
data: message, hasMerged: canMergePrevious,
isMerged: canMerge, isPending: _messageController.unconfirmedMessages.contains(message.uuid),
hasMerged: canMergePrevious, onReply: (value) {
isPending: _messageController.unconfirmedMessages.contains(message.uuid), _inputGlobalKey.currentState?.setReply(value);
onReply: (value) { },
_inputGlobalKey.currentState?.setReply(value); onEdit: (value) {
}, _inputGlobalKey.currentState?.setEdit(value);
onEdit: (value) { },
_inputGlobalKey.currentState?.setEdit(value); onDelete: (value) {
}, _inputGlobalKey.currentState?.deleteMessage(value);
onDelete: (value) { },
_inputGlobalKey.currentState?.deleteMessage(value);
},
),
), ),
); );
}, },

37
lib/screens/home.dart
View File

@ -153,9 +153,14 @@ class _HomeDashUpdateWidget extends StatelessWidget {
} }
} }
class _HomeDashSpecialDayWidget extends StatelessWidget { class _HomeDashSpecialDayWidget extends StatefulWidget {
const _HomeDashSpecialDayWidget(); const _HomeDashSpecialDayWidget();
@override
State<_HomeDashSpecialDayWidget> createState() => _HomeDashSpecialDayWidgetState();
}
class _HomeDashSpecialDayWidgetState extends State<_HomeDashSpecialDayWidget> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final ua = context.watch<UserProvider>(); final ua = context.watch<UserProvider>();
@ -165,21 +170,20 @@ class _HomeDashSpecialDayWidget extends StatelessWidget {
if (days.isNotEmpty) { if (days.isNotEmpty) {
return Column( return Column(
spacing: 8,
children: days.map((ele) { children: days.map((ele) {
return Card( return Card(
child: ListTile( child: ListTile(
leading: Text(kSpecialDaysSymbol[ele] ?? '🎉').fontSize(24), leading: Text(kSpecialDaysSymbol[ele] ?? '🎉').fontSize(24),
title: Text('celebrate$ele').tr(args: [ua.user?.nick ?? 'user']), title: Text('celebrate$ele').tr(args: [ua.user?.nick ?? 'user']),
subtitle: Text( subtitle: Text(
DateFormat('y/M/d').format(DateTime.now().copyWith( DateFormat('y/M/d').format(DateTime.now().copyWith(
month: kSpecialDays[ele]?.$1, month: kSpecialDays[ele]?.$1,
day: kSpecialDays[ele]?.$2, day: kSpecialDays[ele]?.$2,
)), )),
), ),
), ),
).padding(bottom: 8); ).padding(bottom: 8);
}).toList()); }).toList());
} }
final nextOne = dayz.getNextSpecialDay(); final nextOne = dayz.getNextSpecialDay();
@ -204,6 +208,9 @@ class _HomeDashSpecialDayWidget extends StatelessWidget {
separatorType: SeparatorType.symbol, separatorType: SeparatorType.symbol,
decoration: BoxDecoration(), decoration: BoxDecoration(),
padding: EdgeInsets.zero, padding: EdgeInsets.zero,
onDone: () {
setState(() {});
},
), ),
const Gap(12), const Gap(12),
Expanded( Expanded(

188
lib/widgets/attachment/attachment_list.dart
View File

@ -106,76 +106,38 @@ class _AttachmentListState extends State<AttachmentList> {
} }
if (widget.gridded) { if (widget.gridded) {
return Padding( return Container(
padding: widget.padding ?? EdgeInsets.zero, margin: widget.padding ?? EdgeInsets.zero,
child: Container( decoration: BoxDecoration(
decoration: BoxDecoration( color: backgroundColor,
color: backgroundColor, border: Border(
border: Border( top: borderSide,
top: borderSide, bottom: borderSide,
bottom: borderSide,
),
borderRadius: AttachmentList.kDefaultRadius,
),
child: ClipRRect(
borderRadius: AttachmentList.kDefaultRadius,
child: StaggeredGrid.count(
crossAxisCount: math.min(widget.data.length, 2),
crossAxisSpacing: 4,
mainAxisSpacing: 4,
children: widget.data
.mapIndexed(
(idx, ele) => GestureDetector(
child: Container(
constraints: constraints,
child: AttachmentItem(
data: ele,
heroTag: heroTags[idx],
fit: BoxFit.cover,
),
),
onTap: () {
if (widget.data[idx]!.mediaType != SnMediaType.image) return;
context.pushTransparentRoute(
AttachmentZoomView(
data: widget.data.where((ele) => ele != null).cast(),
initialIndex: idx,
heroTags: heroTags,
),
backgroundColor: Colors.black.withOpacity(0.7),
rootNavigator: true,
);
},
),
)
.toList(),
),
), ),
borderRadius: AttachmentList.kDefaultRadius,
), ),
); child: ClipRRect(
} borderRadius: AttachmentList.kDefaultRadius,
child: StaggeredGrid.count(
return AspectRatio( crossAxisCount: math.min(widget.data.length, 2),
aspectRatio: (widget.data.firstOrNull?.data['ratio'] ?? 1).toDouble(), crossAxisSpacing: 4,
child: Container( mainAxisSpacing: 4,
constraints: BoxConstraints(maxHeight: constraints.maxHeight), children: widget.data
child: ScrollConfiguration( .mapIndexed(
behavior: _AttachmentListScrollBehavior(), (idx, ele) => GestureDetector(
child: ListView.separated( child: Container(
shrinkWrap: true, constraints: constraints,
itemCount: widget.data.length, child: AttachmentItem(
itemBuilder: (context, idx) { data: ele,
return Container( heroTag: heroTags[idx],
constraints: constraints, fit: BoxFit.cover,
child: AspectRatio( ),
aspectRatio: (widget.data[idx]?.data['ratio'] ?? 1).toDouble(), ),
child: GestureDetector(
onTap: () { onTap: () {
if (widget.data[idx]?.mediaType != SnMediaType.image) return; if (widget.data[idx]!.mediaType != SnMediaType.image) return;
context.pushTransparentRoute( context.pushTransparentRoute(
AttachmentZoomView( AttachmentZoomView(
data: data: widget.data.where((ele) => ele != null).cast(),
widget.data.where((ele) => ele != null && ele.mediaType == SnMediaType.image).cast(),
initialIndex: idx, initialIndex: idx,
heroTags: heroTags, heroTags: heroTags,
), ),
@ -183,44 +145,76 @@ class _AttachmentListState extends State<AttachmentList> {
rootNavigator: true, rootNavigator: true,
); );
}, },
child: Stack( ),
fit: StackFit.expand, )
children: [ .toList(),
Container( ),
decoration: BoxDecoration( ),
color: backgroundColor, );
border: Border( }
top: borderSide,
bottom: borderSide, return Container(
), constraints: BoxConstraints(maxHeight: constraints.maxHeight),
borderRadius: AttachmentList.kDefaultRadius, child: ScrollConfiguration(
behavior: _AttachmentListScrollBehavior(),
child: ListView.separated(
padding: widget.padding,
shrinkWrap: true,
itemCount: widget.data.length,
itemBuilder: (context, idx) {
return Container(
constraints: constraints.copyWith(maxWidth: widget.maxWidth),
child: AspectRatio(
aspectRatio: (widget.data[idx]?.data['ratio'] ?? 1).toDouble(),
child: GestureDetector(
onTap: () {
if (widget.data[idx]?.mediaType != SnMediaType.image) return;
context.pushTransparentRoute(
AttachmentZoomView(
data: widget.data.where((ele) => ele != null && ele.mediaType == SnMediaType.image).cast(),
initialIndex: idx,
heroTags: heroTags,
),
backgroundColor: Colors.black.withOpacity(0.7),
rootNavigator: true,
);
},
child: Stack(
fit: StackFit.expand,
children: [
Container(
decoration: BoxDecoration(
color: backgroundColor,
border: Border(
top: borderSide,
bottom: borderSide,
), ),
child: ClipRRect( borderRadius: AttachmentList.kDefaultRadius,
borderRadius: AttachmentList.kDefaultRadius, ),
child: AttachmentItem( child: ClipRRect(
data: widget.data[idx], borderRadius: AttachmentList.kDefaultRadius,
heroTag: heroTags[idx], child: AttachmentItem(
), data: widget.data[idx],
heroTag: heroTags[idx],
), ),
), ),
Positioned( ),
right: 8, Positioned(
bottom: 8, right: 8,
child: Chip( bottom: 8,
label: Text('${idx + 1}/${widget.data.length}'), child: Chip(
), label: Text('${idx + 1}/${widget.data.length}'),
), ),
], ),
), ],
), ),
), ),
); ),
}, );
separatorBuilder: (context, index) => const Gap(8), },
padding: widget.padding, separatorBuilder: (context, index) => const Gap(8),
physics: const BouncingScrollPhysics(), physics: const BouncingScrollPhysics(),
scrollDirection: Axis.horizontal, scrollDirection: Axis.horizontal,
),
), ),
), ),
); );

4
lib/widgets/attachment/attachment_zoom.dart
View File

@ -231,7 +231,7 @@ class _AttachmentZoomViewState extends State<AttachmentZoomView> {
children: [ children: [
IgnorePointer( IgnorePointer(
child: AccountImage( child: AccountImage(
content: account!.avatar, content: account?.avatar,
radius: 19, radius: 19,
), ),
), ),
@ -246,7 +246,7 @@ class _AttachmentZoomViewState extends State<AttachmentZoomView> {
style: Theme.of(context).textTheme.bodySmall, style: Theme.of(context).textTheme.bodySmall,
), ),
Text( Text(
account.nick, account?.nick ?? 'unknown'.tr(),
style: Theme.of(context).textTheme.bodyMedium, style: Theme.of(context).textTheme.bodyMedium,
), ),
], ],

142
lib/widgets/chat/chat_message.dart
View File

@ -24,6 +24,7 @@ class ChatMessage extends StatelessWidget {
final Function(SnChatMessage)? onReply; final Function(SnChatMessage)? onReply;
final Function(SnChatMessage)? onEdit; final Function(SnChatMessage)? onEdit;
final Function(SnChatMessage)? onDelete; final Function(SnChatMessage)? onDelete;
final EdgeInsets padding;
const ChatMessage({ const ChatMessage({
super.key, super.key,
@ -35,6 +36,7 @@ class ChatMessage extends StatelessWidget {
this.onReply, this.onReply,
this.onEdit, this.onEdit,
this.onDelete, this.onDelete,
this.padding = const EdgeInsets.only(left: 12, right: 12),
}); });
@override @override
@ -87,83 +89,89 @@ class ChatMessage extends StatelessWidget {
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Row( Padding(
crossAxisAlignment: CrossAxisAlignment.start, padding: isCompact ? EdgeInsets.zero : padding,
children: [ child: Row(
if (!isMerged && !isCompact) crossAxisAlignment: CrossAxisAlignment.start,
AccountImage( children: [
content: user?.avatar, if (!isMerged && !isCompact)
) AccountImage(
else if (isMerged) content: user?.avatar,
const Gap(40), )
const Gap(8), else if (isMerged)
Expanded( const Gap(40),
child: Column( const Gap(8),
crossAxisAlignment: CrossAxisAlignment.start, Expanded(
children: [ child: Container(
if (!isMerged) constraints: BoxConstraints(maxWidth: 480),
Row( child: Column(
crossAxisAlignment: CrossAxisAlignment.center, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
if (isCompact) if (!isMerged)
AccountImage( Row(
content: user?.avatar, crossAxisAlignment: CrossAxisAlignment.center,
radius: 12, children: [
).padding(right: 8), if (isCompact)
Text( AccountImage(
(data.sender.nick?.isNotEmpty ?? false) ? data.sender.nick! : user?.nick ?? 'unknown', content: user?.avatar,
).bold(), radius: 12,
const Gap(8), ).padding(right: 8),
Text( Text(
dateFormatter.format(data.createdAt.toLocal()), (data.sender.nick?.isNotEmpty ?? false) ? data.sender.nick! : user?.nick ?? 'unknown',
).fontSize(13), ).bold(),
], const Gap(8),
), Text(
if (isCompact) const Gap(4), dateFormatter.format(data.createdAt.toLocal()),
if (data.preload?.quoteEvent != null) ).fontSize(13),
StyledWidget(Container( ],
decoration: BoxDecoration(
borderRadius: const BorderRadius.all(Radius.circular(8)),
border: Border.all(
color: Theme.of(context).dividerColor,
width: 1,
), ),
), if (isCompact) const Gap(8),
padding: const EdgeInsets.only( if (data.preload?.quoteEvent != null)
left: 4, StyledWidget(Container(
right: 4, decoration: BoxDecoration(
top: 8, borderRadius: const BorderRadius.all(Radius.circular(8)),
bottom: 6, border: Border.all(
), color: Theme.of(context).dividerColor,
child: ChatMessage( width: 1,
data: data.preload!.quoteEvent!, ),
isCompact: true, ),
onReply: onReply, padding: const EdgeInsets.only(
onEdit: onEdit, left: 4,
onDelete: onDelete, right: 4,
), top: 8,
)).padding(bottom: 4, top: 4), bottom: 6,
switch (data.type) { ),
'messages.new' => _ChatMessageText(data: data), child: ChatMessage(
_ => _ChatMessageSystemNotify(data: data), data: data.preload!.quoteEvent!,
}, isCompact: true,
], onReply: onReply,
), onEdit: onEdit,
) onDelete: onDelete,
], ),
).opacity(isPending ? 0.5 : 1), )).padding(bottom: 4, top: 4),
switch (data.type) {
'messages.new' => _ChatMessageText(data: data),
_ => _ChatMessageSystemNotify(data: data),
},
],
),
),
)
],
).opacity(isPending ? 0.5 : 1),
),
if (data.body['text'] != null && data.type == 'messages.new' && (data.body['text']?.isNotEmpty ?? false)) if (data.body['text'] != null && data.type == 'messages.new' && (data.body['text']?.isNotEmpty ?? false))
LinkPreviewWidget(text: data.body['text']!), LinkPreviewWidget(text: data.body['text']!),
if (data.preload?.attachments?.isNotEmpty ?? false) if (data.preload?.attachments?.isNotEmpty ?? false)
AttachmentList( AttachmentList(
data: data.preload!.attachments!, data: data.preload!.attachments!,
bordered: true, bordered: true,
// gridded: true,
maxHeight: 560, maxHeight: 560,
maxWidth: 480,
minWidth: 480, minWidth: 480,
padding: const EdgeInsets.only(top: 8), padding: padding.copyWith(top: 8),
), ),
if (!hasMerged && !isCompact) const Gap(12) else if (!isCompact) const Gap(6), if (!hasMerged && !isCompact) const Gap(12) else if (!isCompact) const Gap(8),
], ],
), ),
), ),