💄 Optimize profile page

This commit is contained in:
2025-11-02 01:20:14 +08:00
parent e3c92a3c55
commit 85005ff9c3
2 changed files with 139 additions and 80 deletions

View File

@@ -54,30 +54,88 @@ class _AccountBasicInfo extends StatelessWidget {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Padding( return Card(
padding: const EdgeInsets.fromLTRB(24, 24, 24, 8), child: Builder(
child: Row( builder: (context) {
final hasBackground = data.profile.background?.id != null;
return Column(
crossAxisAlignment: CrossAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
ProfilePictureWidget(file: data.profile.picture, radius: 32), if (isWideScreen(context) && hasBackground)
const Gap(20), Stack(
clipBehavior: Clip.none,
children: [
ClipRRect(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(8),
topRight: Radius.circular(8),
),
child: AspectRatio(
aspectRatio: 16 / 7,
child: CloudImageWidget(
file: data.profile.background,
fit: BoxFit.cover,
),
),
),
Positioned(
bottom: -24,
left: 16,
child: ProfilePictureWidget(
file: data.profile.picture,
radius: 32,
),
),
],
),
Builder(
builder: (context) {
final showBackground = isWideScreen(context) && hasBackground;
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
spacing: showBackground ? 0 : 20,
children: [
if (!showBackground)
ProfilePictureWidget(
file: data.profile.picture,
radius: 32,
),
Expanded( Expanded(
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch, crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Row( Row(
spacing: 4,
crossAxisAlignment: CrossAxisAlignment.end,
children: [ children: [
AccountName(account: data, style: TextStyle(fontSize: 20)), Flexible(
const Gap(6), child: AccountName(
account: data,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
),
),
),
if (isWideScreen(context))
Flexible( Flexible(
child: Text( child: Text(
'@${data.name}', '@${data.name}',
maxLines: 1, ).fontSize(11).padding(bottom: 2.5),
overflow: TextOverflow.ellipsis,
).fontSize(14).opacity(0.85),
), ),
], ],
), ),
if (!isWideScreen(context))
Text(
'@${data.name}',
).fontSize(11).padding(bottom: 2.5),
Text(
(data.profile.bio.isNotEmpty)
? data.profile.bio
: 'descriptionNone'.tr(),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
if (accountDeveloper.value != null) if (accountDeveloper.value != null)
Row( Row(
spacing: 7, spacing: 7,
@@ -85,25 +143,45 @@ class _AccountBasicInfo extends StatelessWidget {
const Icon(Symbols.smart_toy, size: 18), const Icon(Symbols.smart_toy, size: 18),
Text( Text(
'botAutomatedBy'.tr( 'botAutomatedBy'.tr(
args: [accountDeveloper.value!.publisher!.nick], args: [
accountDeveloper.value!.publisher!.nick,
],
), ),
).fontSize(13), ).fontSize(13),
], ],
).opacity(0.75), ).opacity(0.75).padding(top: 4),
const Gap(4), const Gap(4),
AccountStatusWidget(uname: uname, padding: EdgeInsets.zero), AccountStatusWidget(
uname: uname,
padding: EdgeInsets.zero,
),
const Gap(8),
], ],
), ),
), ),
IconButton( IconButton(
onPressed: () { onPressed: () {
SharePlus.instance.share( SharePlus.instance.share(
ShareParams(uri: Uri.parse('https://solian.app/@${data.name}')), ShareParams(
uri: Uri.parse(
'https://solian.app/@${data.name}',
),
),
); );
}, },
icon: const Icon(Symbols.share), icon: const Icon(Symbols.share),
), ),
], ],
).padding(
left: 16,
right: 16,
top: 16 + (showBackground ? 16 : 0),
);
},
),
],
);
},
), ),
); );
} }
@@ -764,22 +842,6 @@ class AccountProfileScreen extends HookConsumerWidget {
color: appbarColor.value, color: appbarColor.value,
shadows: [appbarShadow], shadows: [appbarShadow],
), ),
flexibleSpace: Stack(
children: [
Positioned.fill(
child:
data.profile.background?.id != null
? CloudImageWidget(
file: data.profile.background,
)
: Container(
color:
Theme.of(
context,
).appBarTheme.backgroundColor,
),
),
FlexibleSpaceBar(
title: Text( title: Text(
data.nick, data.nick,
style: TextStyle( style: TextStyle(
@@ -789,9 +851,6 @@ class AccountProfileScreen extends HookConsumerWidget {
shadows: [appbarShadow], shadows: [appbarShadow],
), ),
), ),
),
],
),
) )
: null, : null,
body: body:
@@ -806,7 +865,7 @@ class AccountProfileScreen extends HookConsumerWidget {
data: data, data: data,
uname: name, uname: name,
accountDeveloper: accountDeveloper, accountDeveloper: accountDeveloper,
), ).padding(horizontal: 4, top: 20),
), ),
if (data.badges.isNotEmpty) if (data.badges.isNotEmpty)
SliverToBoxAdapter( SliverToBoxAdapter(
@@ -857,7 +916,12 @@ class AccountProfileScreen extends HookConsumerWidget {
Flexible( Flexible(
child: CustomScrollView( child: CustomScrollView(
slivers: [ slivers: [
SliverGap(24), SliverGap(18),
SliverToBoxAdapter(
child: ActivityPresenceWidget(
uname: name,
).padding(horizontal: 4, top: 4, bottom: 4),
),
SliverToBoxAdapter( SliverToBoxAdapter(
child: _AccountPublisherList( child: _AccountPublisherList(
publishers: accountPublishers.value ?? [], publishers: accountPublishers.value ?? [],
@@ -883,11 +947,6 @@ class AccountProfileScreen extends HookConsumerWidget {
), ),
), ),
), ),
SliverToBoxAdapter(
child: ActivityPresenceWidget(
uname: name,
).padding(horizontal: 4, top: 4, bottom: 8),
),
], ],
), ),
), ),
@@ -939,7 +998,7 @@ class AccountProfileScreen extends HookConsumerWidget {
data: data, data: data,
uname: name, uname: name,
accountDeveloper: accountDeveloper, accountDeveloper: accountDeveloper,
), ).padding(horizontal: 4, top: 8),
), ),
if (data.badges.isNotEmpty) if (data.badges.isNotEmpty)
SliverToBoxAdapter( SliverToBoxAdapter(

View File

@@ -256,7 +256,7 @@ class ActivityPresenceWidget extends ConsumerWidget {
children: [ children: [
Text( Text(
'activities', 'activities',
).tr().bold().padding(horizontal: 8, vertical: 4), ).tr().bold().padding(horizontal: 16, vertical: 4),
if (activities.isEmpty) if (activities.isEmpty)
Row( Row(
spacing: 4, spacing: 4,
@@ -264,7 +264,7 @@ class ActivityPresenceWidget extends ConsumerWidget {
const Icon(Symbols.inbox, size: 16), const Icon(Symbols.inbox, size: 16),
Text('dataEmpty').tr().fontSize(13), Text('dataEmpty').tr().fontSize(13),
], ],
).opacity(0.75).padding(horizontal: 8), ).opacity(0.75).padding(horizontal: 16, bottom: 8),
...activities.map((activity) { ...activities.map((activity) {
final dcImages = _buildDiscordImages(ref, activity); final dcImages = _buildDiscordImages(ref, activity);