💄 Optimize app bar

This commit is contained in:
LittleSheep 2024-12-22 13:54:46 +08:00
parent 77e9994204
commit 95af7140cd
6 changed files with 131 additions and 117 deletions

View File

@ -57,7 +57,7 @@
"reply": "Reply", "reply": "Reply",
"unset": "Unset", "unset": "Unset",
"untitled": "Untitled", "untitled": "Untitled",
"postDetail": "Post detail", "postDetail": "Post Detail",
"postNoun": "Post", "postNoun": "Post",
"postReadMore": "Read more", "postReadMore": "Read more",
"postReadEstimate": "Est read time {}", "postReadEstimate": "Est read time {}",

View File

@ -416,7 +416,7 @@
"accountStatus": "状态", "accountStatus": "状态",
"accountStatusOnline": "在线", "accountStatusOnline": "在线",
"accountStatusOffline": "离线", "accountStatusOffline": "离线",
"accountStatusLastSeen": "最后一次在 {} 上线", "accountStatusLastSeen": "最后一次上线于 {}",
"postArticle": "Solar Network 上的文章", "postArticle": "Solar Network 上的文章",
"postStory": "Solar Network 上的故事", "postStory": "Solar Network 上的故事",
"articleWrittenAt": "发表于 {}", "articleWrittenAt": "发表于 {}",

View File

@ -416,7 +416,7 @@
"accountStatus": "狀態", "accountStatus": "狀態",
"accountStatusOnline": "在線", "accountStatusOnline": "在線",
"accountStatusOffline": "離線", "accountStatusOffline": "離線",
"accountStatusLastSeen": "最後一次在 {} 上線", "accountStatusLastSeen": "最後一次上線於 {}",
"postArticle": "Solar Network 上的文章", "postArticle": "Solar Network 上的文章",
"postStory": "Solar Network 上的故事", "postStory": "Solar Network 上的故事",
"articleWrittenAt": "發表於 {}", "articleWrittenAt": "發表於 {}",

View File

@ -416,7 +416,7 @@
"accountStatus": "狀態", "accountStatus": "狀態",
"accountStatusOnline": "線上", "accountStatusOnline": "線上",
"accountStatusOffline": "離線", "accountStatusOffline": "離線",
"accountStatusLastSeen": "最後一次在 {} 上線", "accountStatusLastSeen": "最後一次上線於 {}",
"postArticle": "Solar Network 上的文章", "postArticle": "Solar Network 上的文章",
"postStory": "Solar Network 上的故事", "postStory": "Solar Network 上的故事",
"articleWrittenAt": "發表於 {}", "articleWrittenAt": "發表於 {}",

View File

@ -228,65 +228,72 @@ class _UserScreenState extends State<UserScreen> with SingleTickerProviderStateM
body: CustomScrollView( body: CustomScrollView(
controller: _scrollController, controller: _scrollController,
slivers: [ slivers: [
SliverAppBar( Theme(
expandedHeight: _appBarHeight, data: Theme.of(context).copyWith(
title: _account == null appBarTheme: Theme.of(context).appBarTheme.copyWith(
? Text('loading').tr() foregroundColor: Colors.white,
: RichText(
textAlign: TextAlign.center,
text: TextSpan(children: [
TextSpan(
text: _account!.nick,
style: Theme.of(context).textTheme.titleLarge!.copyWith(
color: Theme.of(context).appBarTheme.foregroundColor!,
shadows: labelShadows,
),
),
const TextSpan(text: '\n'),
TextSpan(
text: '@${_account!.name}',
style: Theme.of(context).textTheme.bodySmall!.copyWith(
color: Theme.of(context).appBarTheme.foregroundColor!,
shadows: labelShadows,
),
),
]),
), ),
pinned: true, ),
flexibleSpace: _account != null child: SliverAppBar(
? Stack( expandedHeight: _appBarHeight,
fit: StackFit.expand, title: _account == null
children: [ ? Text('loading').tr()
UniversalImage( : RichText(
sn.getAttachmentUrl(_account!.banner), textAlign: TextAlign.center,
fit: BoxFit.cover, text: TextSpan(children: [
height: imageHeight, TextSpan(
width: _appBarWidth, text: _account!.nick,
cacheHeight: imageHeight, style: Theme.of(context).textTheme.titleLarge!.copyWith(
cacheWidth: _appBarWidth, color: Colors.white,
), shadows: labelShadows,
Positioned( ),
top: 0, ),
left: 0, const TextSpan(text: '\n'),
right: 0, TextSpan(
height: 56 + MediaQuery.of(context).padding.top, text: '@${_account!.name}',
child: ClipRect( style: Theme.of(context).textTheme.bodySmall!.copyWith(
child: BackdropFilter( color: Colors.white,
filter: ImageFilter.blur( shadows: labelShadows,
sigmaX: _appBarBlur, ),
sigmaY: _appBarBlur, ),
), ]),
child: Container( ),
color: Colors.black.withOpacity( pinned: true,
clampDouble(_appBarBlur * 0.1, 0, 0.5), flexibleSpace: _account != null
? Stack(
fit: StackFit.expand,
children: [
UniversalImage(
sn.getAttachmentUrl(_account!.banner),
fit: BoxFit.cover,
height: imageHeight,
width: _appBarWidth,
cacheHeight: imageHeight,
cacheWidth: _appBarWidth,
),
Positioned(
top: 0,
left: 0,
right: 0,
height: 56 + MediaQuery.of(context).padding.top,
child: ClipRect(
child: BackdropFilter(
filter: ImageFilter.blur(
sigmaX: _appBarBlur,
sigmaY: _appBarBlur,
),
child: Container(
color: Colors.black.withOpacity(
clampDouble(_appBarBlur * 0.1, 0, 0.5),
),
), ),
), ),
), ),
), ),
), ],
], )
) : null,
: null, ),
), ),
if (_account != null) if (_account != null)
SliverToBoxAdapter( SliverToBoxAdapter(

View File

@ -277,70 +277,77 @@ class _PostPublisherScreenState extends State<PostPublisherScreen> with SingleTi
handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context), handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
sliver: MultiSliver( sliver: MultiSliver(
children: [ children: [
SliverAppBar( Theme(
expandedHeight: _appBarHeight, data: Theme.of(context).copyWith(
title: _publisher == null appBarTheme: Theme.of(context).appBarTheme.copyWith(
? Text('loading').tr() foregroundColor: Colors.white,
: RichText( ),
textAlign: TextAlign.center, ),
text: TextSpan(children: [ child: SliverAppBar(
TextSpan( expandedHeight: _appBarHeight,
text: _publisher!.nick, title: _publisher == null
style: Theme.of(context).textTheme.titleLarge!.copyWith( ? Text('loading').tr()
color: Theme.of(context).appBarTheme.foregroundColor!, : RichText(
shadows: labelShadows, textAlign: TextAlign.center,
), text: TextSpan(children: [
), TextSpan(
const TextSpan(text: '\n'), text: _publisher!.nick,
TextSpan( style: Theme.of(context).textTheme.titleLarge!.copyWith(
text: '@${_publisher!.name}', color: Colors.white,
style: Theme.of(context).textTheme.bodySmall!.copyWith( shadows: labelShadows,
color: Colors.white, ),
shadows: labelShadows,
),
),
]),
),
pinned: true,
flexibleSpace: _publisher != null
? Stack(
fit: StackFit.expand,
children: [
if (_publisher!.banner.isNotEmpty)
UniversalImage(
sn.getAttachmentUrl(_publisher!.banner),
fit: BoxFit.cover,
height: imageHeight,
width: _appBarWidth,
cacheHeight: imageHeight,
cacheWidth: _appBarWidth,
)
else
Container(
color: Theme.of(context).colorScheme.surfaceContainer,
), ),
Positioned( const TextSpan(text: '\n'),
top: 0, TextSpan(
left: 0, text: '@${_publisher!.name}',
right: 0, style: Theme.of(context).textTheme.bodySmall!.copyWith(
height: 56 + MediaQuery.of(context).padding.top, color: Colors.white,
child: ClipRect( shadows: labelShadows,
child: BackdropFilter( ),
filter: ImageFilter.blur( ),
sigmaX: _appBarBlur, ]),
sigmaY: _appBarBlur, ),
), pinned: true,
child: Container( flexibleSpace: _publisher != null
color: Colors.black.withOpacity( ? Stack(
clampDouble(_appBarBlur * 0.1, 0, 0.5), fit: StackFit.expand,
children: [
if (_publisher!.banner.isNotEmpty)
UniversalImage(
sn.getAttachmentUrl(_publisher!.banner),
fit: BoxFit.cover,
height: imageHeight,
width: _appBarWidth,
cacheHeight: imageHeight,
cacheWidth: _appBarWidth,
)
else
Container(
color: Theme.of(context).colorScheme.surfaceContainer,
),
Positioned(
top: 0,
left: 0,
right: 0,
height: 56 + MediaQuery.of(context).padding.top,
child: ClipRect(
child: BackdropFilter(
filter: ImageFilter.blur(
sigmaX: _appBarBlur,
sigmaY: _appBarBlur,
),
child: Container(
color: Colors.black.withOpacity(
clampDouble(_appBarBlur * 0.1, 0, 0.5),
),
), ),
), ),
), ),
), ),
), ],
], )
) : null,
: null, ),
), ),
if (_publisher != null) if (_publisher != null)
SliverToBoxAdapter( SliverToBoxAdapter(