opt tabbar

Signed-off-by: dom <githubaccount56556@proton.me>
This commit is contained in:
dom
2026-06-23 10:59:55 +08:00
parent 66c43fe4ec
commit 855b35e1dc
19 changed files with 167 additions and 222 deletions

View File

@@ -149,9 +149,7 @@ class _DynamicsPageState extends State<DynamicsPage>
indicatorColor: theme.colorScheme.primary,
controller: _dynamicsController.tabController,
unselectedLabelColor: theme.colorScheme.onSurface,
labelStyle:
TabBarTheme.of(context).labelStyle?.copyWith(fontSize: 13) ??
const TextStyle(fontSize: 13),
labelStyle: const TextStyle(fontSize: 13),
tabs: DynamicsTabType.values
.map((e) => Tab(text: e.label))
.toList(),

View File

@@ -186,11 +186,11 @@ class _EmotePanelState extends State<EmotePanel>
),
Expanded(
child: TabBar(
controller: _emotePanelController.tabController,
padding: const EdgeInsets.only(right: 60),
dividerColor: Colors.transparent,
dividerHeight: 0,
isScrollable: true,
padding: const .only(right: 60),
dividerColor: Colors.transparent,
controller: _emotePanelController.tabController,
tabs: response
.map(
(e) => Padding(

View File

@@ -215,11 +215,11 @@ class _EpisodePanelState extends State<EpisodePanel>
_buildToolbar(theme),
if (_isMulti)
TabBar(
controller: _tabController,
padding: const EdgeInsets.only(right: 60),
isScrollable: true,
tabs: widget.list.map((item) => Tab(text: item.title)).toList(),
dividerHeight: 1,
isScrollable: true,
controller: _tabController,
padding: const .only(right: 60),
tabs: widget.list.map((item) => Tab(text: item.title)).toList(),
dividerColor: theme.dividerColor.withValues(alpha: 0.1),
),
Expanded(child: enableSlide ? slideList(theme) : buildList(theme)),

View File

@@ -44,28 +44,21 @@ class _FavNotePageState extends State<FavNotePage>
children: [
Expanded(
child: TabBar(
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
splashFactory: NoSplash.splashFactory,
isScrollable: true,
tabAlignment: TabAlignment.start,
controller: _tabController,
padding: const EdgeInsets.symmetric(horizontal: 8),
dividerHeight: 0,
indicatorWeight: 0,
indicatorPadding: const EdgeInsets.symmetric(
horizontal: 3,
vertical: 8,
),
isScrollable: true,
indicatorSize: .tab,
tabAlignment: .start,
controller: _tabController,
splashFactory: NoSplash.splashFactory,
padding: const .symmetric(horizontal: 8),
indicatorPadding: const .symmetric(horizontal: 3, vertical: 8),
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
indicator: BoxDecoration(
color: theme.colorScheme.secondaryContainer,
borderRadius: const BorderRadius.all(Radius.circular(20)),
),
indicatorSize: TabBarIndicatorSize.tab,
labelStyle:
TabBarTheme.of(
context,
).labelStyle?.copyWith(fontSize: 14) ??
const TextStyle(fontSize: 14),
labelStyle: const TextStyle(fontSize: 14),
labelColor: theme.colorScheme.onSecondaryContainer,
unselectedLabelColor: theme.colorScheme.outline,
tabs: const [

View File

@@ -47,28 +47,21 @@ class _FavPgcPageState extends State<FavPgcPage>
children: [
Expanded(
child: TabBar(
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
splashFactory: NoSplash.splashFactory,
isScrollable: true,
tabAlignment: TabAlignment.start,
controller: _tabController,
padding: const EdgeInsets.symmetric(horizontal: 8),
dividerHeight: 0,
indicatorWeight: 0,
indicatorPadding: const EdgeInsets.symmetric(
horizontal: 3,
vertical: 8,
),
isScrollable: true,
tabAlignment: .start,
controller: _tabController,
splashFactory: NoSplash.splashFactory,
padding: const .symmetric(horizontal: 8),
indicatorPadding: const .symmetric(horizontal: 3, vertical: 8),
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
indicator: BoxDecoration(
color: theme.colorScheme.secondaryContainer,
borderRadius: const BorderRadius.all(Radius.circular(20)),
),
indicatorSize: TabBarIndicatorSize.tab,
labelStyle:
TabBarTheme.of(
context,
).labelStyle?.copyWith(fontSize: 14) ??
const TextStyle(fontSize: 14),
labelStyle: const TextStyle(fontSize: 14),
labelColor: theme.colorScheme.onSecondaryContainer,
unselectedLabelColor: theme.colorScheme.outline,
tabs: const [

View File

@@ -131,9 +131,9 @@ class _FavPageState extends State<FavPage> with SingleTickerProviderStateMixin {
],
),
TabBar(
controller: _tabController,
isScrollable: true,
tabAlignment: TabAlignment.start,
tabAlignment: .start,
controller: _tabController,
tabs: FavTabType.values
.map((item) => Tab(text: item.title))
.toList(),

View File

@@ -131,7 +131,7 @@ class _FollowPageState extends State<FollowPage> {
ViewSafeArea(
child: TabBar(
isScrollable: true,
tabAlignment: TabAlignment.start,
tabAlignment: .start,
controller: _followController.tabController,
tabs: List.generate(_followController.tabs.length, (index) {
return Obx(() {

View File

@@ -40,13 +40,13 @@ class _HomePageState extends State<HomePage>
height: 42,
width: double.infinity,
child: TabBar(
dividerHeight: 0,
isScrollable: true,
tabAlignment: .center,
splashBorderRadius: Style.mdRadius,
dividerColor: Colors.transparent,
controller: _homeController.tabController,
tabs: HomeTabType.values.map((e) => Tab(text: e.label)).toList(),
isScrollable: true,
dividerColor: Colors.transparent,
dividerHeight: 0,
splashBorderRadius: Style.mdRadius,
tabAlignment: TabAlignment.center,
onTap: (_) {
if (!_homeController.tabController.indexIsChanging) {
_homeController.animateToTop();

View File

@@ -84,7 +84,7 @@ class _LiveAreaPageState extends State<LiveAreaPage> {
children: [
TabBar(
isScrollable: true,
tabAlignment: TabAlignment.start,
tabAlignment: .start,
controller: _controller.tabController,
tabs: response.map((e) => Tab(text: e.name)).toList(),
),

View File

@@ -82,7 +82,7 @@ class _LiveAreaDetailPageState extends State<LiveAreaDetailPage> {
child: TabBar(
dividerHeight: 0,
isScrollable: true,
tabAlignment: TabAlignment.start,
tabAlignment: .start,
dividerColor: Colors.transparent,
controller: _controller.tabController,
tabs: response

View File

@@ -174,11 +174,11 @@ class _LiveEmotePanelState extends State<LiveEmotePanel>
color: theme.dividerColor.withValues(alpha: 0.1),
),
TabBar(
controller: _emotePanelController.tabController,
padding: const EdgeInsets.only(right: 60),
dividerColor: Colors.transparent,
dividerHeight: 0,
isScrollable: true,
padding: const .only(right: 60),
dividerColor: Colors.transparent,
controller: _emotePanelController.tabController,
tabs: response
.map(
(item) => Padding(

View File

@@ -56,29 +56,22 @@ class _MemberContributeState extends State<MemberContribute>
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TabBar(
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
splashFactory: NoSplash.splashFactory,
padding: const EdgeInsets.symmetric(horizontal: 8),
isScrollable: true,
tabs: _controller.tabs!,
tabAlignment: TabAlignment.start,
controller: _controller.tabController,
dividerHeight: 0,
indicatorWeight: 0,
indicatorPadding: const EdgeInsets.symmetric(
horizontal: 3,
vertical: 8,
),
isScrollable: true,
indicatorSize: .tab,
tabAlignment: .start,
tabs: _controller.tabs!,
controller: _controller.tabController,
splashFactory: NoSplash.splashFactory,
padding: const .symmetric(horizontal: 8),
indicatorPadding: const .symmetric(horizontal: 3, vertical: 8),
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
indicator: BoxDecoration(
color: theme.colorScheme.secondaryContainer,
borderRadius: const BorderRadius.all(Radius.circular(20)),
),
indicatorSize: TabBarIndicatorSize.tab,
labelStyle:
TabBarTheme.of(
context,
).labelStyle?.copyWith(fontSize: 14) ??
const TextStyle(fontSize: 14),
labelStyle: const TextStyle(fontSize: 14),
labelColor: theme.colorScheme.onSecondaryContainer,
unselectedLabelColor: theme.colorScheme.outline,
),

View File

@@ -115,7 +115,7 @@ class _UpowerRankPageState extends State<UpowerRankPage>
children: [
TabBar(
isScrollable: true,
tabAlignment: TabAlignment.start,
tabAlignment: .start,
tabs: tabs
.map(
(e) => Tab(

View File

@@ -87,9 +87,9 @@ class PgcPage extends StatelessWidget {
const SizedBox(width: 16),
Expanded(
child: TabBar(
isScrollable: true,
tabAlignment: TabAlignment.start,
dividerHeight: 0,
isScrollable: true,
tabAlignment: .start,
overlayColor: const WidgetStatePropertyAll(
Colors.transparent,
),
@@ -108,11 +108,7 @@ class PgcPage extends StatelessWidget {
indicatorSize: TabBarIndicatorSize.tab,
labelColor:
theme.colorScheme.onSecondaryContainer,
labelStyle:
TabBarTheme.of(
context,
).labelStyle?.copyWith(fontSize: 14) ??
const TextStyle(fontSize: 14),
labelStyle: const TextStyle(fontSize: 14),
dividerColor: Colors.transparent,
tabs: response.map(
(item) {

View File

@@ -52,31 +52,24 @@ class _PgcReviewPageState extends State<PgcReviewPage>
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TabBar(
controller: _tabController,
isScrollable: true,
tabAlignment: TabAlignment.start,
dividerHeight: 0,
indicatorWeight: 0,
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
isScrollable: true,
indicatorSize: .tab,
tabAlignment: .start,
controller: _tabController,
padding: const .only(left: 6),
dividerColor: Colors.transparent,
splashFactory: NoSplash.splashFactory,
padding: const EdgeInsets.only(left: 6),
indicatorPadding: const EdgeInsets.symmetric(
horizontal: 3,
vertical: 8,
),
indicatorPadding: const .symmetric(horizontal: 3, vertical: 8),
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
indicator: BoxDecoration(
borderRadius: const .all(.circular(20)),
color: theme.colorScheme.secondaryContainer,
borderRadius: const BorderRadius.all(Radius.circular(20)),
),
indicatorSize: TabBarIndicatorSize.tab,
labelColor: theme.colorScheme.onSecondaryContainer,
unselectedLabelColor: theme.colorScheme.outline,
labelStyle:
TabBarTheme.of(
context,
).labelStyle?.copyWith(fontSize: 13) ??
const TextStyle(fontSize: 13),
dividerColor: Colors.transparent,
labelStyle: const TextStyle(fontSize: 13),
tabs: PgcReviewType.values
.map((e) => Tab(text: e.label))
.toList(),

View File

@@ -101,10 +101,10 @@ class _SearchResultPageState extends State<SearchResultPage>
crossAxisAlignment: CrossAxisAlignment.start,
children: [
TabBar(
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
splashFactory: NoSplash.splashFactory,
padding: const EdgeInsets.only(top: 4, left: 8, right: 8),
controller: _tabController,
splashFactory: NoSplash.splashFactory,
padding: const .only(top: 4, left: 8, right: 8),
overlayColor: const WidgetStatePropertyAll(Colors.transparent),
tabs: SearchType.values
.map(
(item) => Obx(
@@ -128,13 +128,9 @@ class _SearchResultPageState extends State<SearchResultPage>
color: theme.colorScheme.secondaryContainer,
borderRadius: const BorderRadius.all(Radius.circular(20)),
),
indicatorSize: TabBarIndicatorSize.tab,
indicatorSize: .tab,
labelColor: theme.colorScheme.onSecondaryContainer,
labelStyle:
TabBarTheme.of(
context,
).labelStyle?.copyWith(fontSize: 13) ??
const TextStyle(fontSize: 13),
labelStyle: const TextStyle(fontSize: 13),
dividerColor: Colors.transparent,
dividerHeight: 0,
unselectedLabelColor: theme.colorScheme.outline,

View File

@@ -57,10 +57,10 @@ class _IntroDetailState extends State<PgcIntroPanel>
children: [
Expanded(
child: TabBar(
controller: _tabController,
dividerHeight: 0,
isScrollable: true,
tabAlignment: TabAlignment.start,
tabAlignment: .start,
controller: _tabController,
dividerColor: Colors.transparent,
tabs: const [
Tab(text: '详情'),

View File

@@ -1079,53 +1079,51 @@ class _VideoDetailPageVState extends State<VideoDetailPageV>
);
}
final flag = !needIndicator || tabs.length == 1;
Widget tabBar() => TabBar(
labelColor: flag ? themeData.colorScheme.onSurface : null,
indicator: flag ? const BoxDecoration() : null,
padding: EdgeInsets.zero,
controller: videoDetailController.tabCtr,
labelStyle:
TabBarTheme.of(context).labelStyle?.copyWith(fontSize: 13) ??
const TextStyle(fontSize: 13),
labelPadding: const EdgeInsets.symmetric(horizontal: 10.0),
dividerColor: Colors.transparent,
dividerHeight: 0,
onTap: (value) {
void animToTop() {
if (onTap != null) {
onTap();
return;
Widget tabBar() {
final flag = !needIndicator || tabs.length == 1;
return TabBar(
padding: .zero,
dividerHeight: 0,
dividerColor: Colors.transparent,
controller: videoDetailController.tabCtr,
labelStyle: const TextStyle(fontSize: 13),
labelColor: flag ? themeData.colorScheme.onSurface : null,
onTap: (value) {
void animToTop() {
if (onTap != null) {
onTap();
return;
}
String text = tabs[value];
if (videoDetailController.isFileSource ||
text == '简介' ||
text == '相关视频') {
videoDetailController.introScrollCtr?.animToTop();
} else if (text.startsWith('评论')) {
_videoReplyController.animateToTop();
}
}
String text = tabs[value];
if (videoDetailController.isFileSource ||
text == '简介' ||
text == '相关视频') {
videoDetailController.introScrollCtr?.animToTop();
} else if (text.startsWith('评论')) {
_videoReplyController.animateToTop();
}
}
if (flag) {
animToTop();
} else if (!videoDetailController.tabCtr.indexIsChanging) {
animToTop();
}
},
tabs: tabs.map((text) {
if (text == '评论') {
return Obx(() {
final count = _videoReplyController.count.value;
return Tab(
text: '评论${count == -1 ? '' : ' ${NumUtils.numFormat(count)}'}',
);
});
} else {
return Tab(text: text);
}
}).toList(),
);
if (flag) {
animToTop();
} else if (!videoDetailController.tabCtr.indexIsChanging) {
animToTop();
}
},
tabs: tabs.map((text) {
if (text == '评论') {
return Obx(() {
final count = _videoReplyController.count.value;
return Tab(
text: '评论${count == -1 ? '' : ' ${NumUtils.numFormat(count)}'}',
);
});
} else {
return Tab(text: text);
}
}).toList(),
);
}
return DecoratedBox(
decoration: BoxDecoration(
@@ -1142,64 +1140,59 @@ class _VideoDetailPageVState extends State<VideoDetailPageV>
if (tabs.isEmpty)
const Spacer()
else
Flexible(
flex: tabs.length == 3 ? 2 : 1,
SizedBox(
width: tabs.length * 96,
child: tabBar(),
),
Flexible(
flex: 1,
child: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
SizedBox(
height: 32,
child: TextButton(
style: const ButtonStyle(
padding: WidgetStatePropertyAll(EdgeInsets.zero),
),
onPressed: videoDetailController.showShootDanmakuSheet,
child: Text(
'发弹幕',
style: TextStyle(
fontSize: 12,
color: themeData.colorScheme.onSurfaceVariant,
Expanded(
child: Row(
mainAxisAlignment: .end,
children: [
TextButton(
style: const ButtonStyle(
visualDensity: .compact,
padding: WidgetStatePropertyAll(.zero),
),
onPressed: videoDetailController.showShootDanmakuSheet,
child: Text(
'发弹幕',
style: TextStyle(
fontSize: 12,
color: themeData.colorScheme.onSurfaceVariant,
),
),
),
SizedBox(
width: 38,
height: 38,
child: Obx(
() {
final ctr = videoDetailController.plPlayerController;
final enableShowDanmaku = ctr.enableShowDanmaku.value;
return IconButton(
onPressed: () {
final newVal = !enableShowDanmaku;
ctr.enableShowDanmaku.value = newVal;
GStorage.setting.put(
SettingBoxKey.enableShowDanmaku,
newVal,
);
},
icon: Icon(
size: 22,
enableShowDanmaku
? BiliIcons.danmaku_opened
: BiliIcons.danmaku_closed,
color: enableShowDanmaku
? themeData.colorScheme.secondary
: themeData.colorScheme.outline,
),
),
),
);
},
),
SizedBox(
width: 38,
height: 38,
child: Obx(
() {
final ctr = videoDetailController.plPlayerController;
final enableShowDanmaku = ctr.enableShowDanmaku.value;
return IconButton(
onPressed: () {
final newVal = !enableShowDanmaku;
ctr.enableShowDanmaku.value = newVal;
GStorage.setting.put(
SettingBoxKey.enableShowDanmaku,
newVal,
);
},
icon: Icon(
size: 22,
enableShowDanmaku
? BiliIcons.danmaku_opened
: BiliIcons.danmaku_closed,
color: enableShowDanmaku
? themeData.colorScheme.secondary
: themeData.colorScheme.outline,
),
);
},
),
),
const SizedBox(width: 14),
],
),
),
const SizedBox(width: 14),
],
),
),
],

View File

@@ -39,10 +39,7 @@ abstract final class ThemeUtils {
centerTitle: false,
scrolledUnderElevation: 0,
backgroundColor: colorScheme.surface,
titleTextStyle: TextStyle(
fontSize: 16,
color: colorScheme.onSurface,
),
titleTextStyle: TextStyle(fontSize: 16, color: colorScheme.onSurface),
),
navigationBarTheme: NavigationBarThemeData(
surfaceTintColor: isDynamic ? colorScheme.onSurfaceVariant : null,
@@ -59,10 +56,8 @@ abstract final class ThemeUtils {
),
cardTheme: CardThemeData(
elevation: 1,
margin: EdgeInsets.zero,
surfaceTintColor: isDynamic
? colorScheme.onSurfaceVariant
: isDark
margin: .zero,
surfaceTintColor: isDynamic || isDark
? colorScheme.onSurfaceVariant
: null,
shadowColor: Colors.transparent,
@@ -73,10 +68,7 @@ abstract final class ThemeUtils {
refreshBackgroundColor: colorScheme.onSecondary,
),
dialogTheme: DialogThemeData(
titleTextStyle: TextStyle(
fontSize: 18,
color: colorScheme.onSurface,
),
titleTextStyle: TextStyle(fontSize: 18, color: colorScheme.onSurface),
backgroundColor: colorScheme.surface,
constraints: const BoxConstraints(minWidth: 280, maxWidth: 420),
),
@@ -89,10 +81,7 @@ abstract final class ThemeUtils {
// ignore: deprecated_member_use
sliderTheme: const SliderThemeData(year2023: false),
tooltipTheme: TooltipThemeData(
textStyle: const TextStyle(
color: Colors.white,
fontSize: 14,
),
textStyle: const TextStyle(color: Colors.white, fontSize: 14),
decoration: BoxDecoration(
color: Colors.grey[700]!.withValues(alpha: 0.9),
borderRadius: const BorderRadius.all(Radius.circular(4)),
@@ -111,6 +100,7 @@ abstract final class ThemeUtils {
},
),
),
tabBarTheme: const TabBarThemeData(indicatorAnimation: .linear),
pageTransitionsTheme: const PageTransitionsTheme(
builders: {
TargetPlatform.android: ZoomPageTransitionsBuilder(),