merge: 合并 K28-S 浅色暖橙视觉主题
This commit is contained in:
commit
e448003f1b
56 files changed
+941
-409
No files matched your search
+4
-4
@@ -251,14 +251,14 @@ class _LumaDramaAppState extends State<LumaDramaApp> {
|
||||
localeResolutionCallback: (deviceLocale, _) =>
|
||||
resolveAppLocale(deviceLocale),
|
||||
debugShowCheckedModeBanner: false,
|
||||
themeMode: ThemeMode.dark,
|
||||
themeMode: ThemeMode.light,
|
||||
theme: AppTheme.light(),
|
||||
darkTheme: AppTheme.dark(),
|
||||
darkTheme: AppTheme.light(),
|
||||
builder: (context, child) => AnnotatedRegion<SystemUiOverlayStyle>(
|
||||
value: SystemUiOverlayStyle.light.copyWith(
|
||||
value: SystemUiOverlayStyle.dark.copyWith(
|
||||
statusBarColor: Colors.transparent,
|
||||
systemNavigationBarColor: AppColors.bar,
|
||||
systemNavigationBarIconBrightness: Brightness.light,
|
||||
systemNavigationBarIconBrightness: Brightness.dark,
|
||||
),
|
||||
child: child ?? const SizedBox.shrink(),
|
||||
),
|
||||
|
||||
@@ -2,79 +2,102 @@
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
/// Obsidian Flare palette from `docs/design/README.md` and screens 01/02.
|
||||
/// K28-S 浅色暖橙主题色板。
|
||||
///
|
||||
/// Existing semantic names (`blue`, `blueSoft`, `ink`, ...) are kept so page
|
||||
/// code does not need a mass rename; their values now follow the design tokens.
|
||||
/// 保留既有语义名,避免页面大范围改名;实际颜色统一由本文件控制。
|
||||
abstract final class AppColors {
|
||||
/// Primary CTA, selected navigation, playback progress.
|
||||
static const blue = Color(0xFFFF5B3D);
|
||||
/// 主操作、选中态、播放进度。
|
||||
static const blue = Color(0xFFFF7A1A);
|
||||
static const primary = blue;
|
||||
|
||||
/// Pressed state for the primary CTA.
|
||||
static const bluePressed = Color(0xFFFF4321);
|
||||
/// 主操作按下态。
|
||||
static const bluePressed = Color(0xFFFF6A00);
|
||||
|
||||
/// Secondary accent for tags, locks, and highlighted icons.
|
||||
static const blueSoft = Color(0xFF9278EA);
|
||||
/// 粉色辅助强调色。
|
||||
static const blueSoft = Color(0xFFFF6A8A);
|
||||
static const secondary = blueSoft;
|
||||
static const lavender = blueSoft;
|
||||
|
||||
/// Coins and rewards.
|
||||
static const gold = Color(0xFFFBBF24);
|
||||
/// 金币与奖励。
|
||||
static const gold = Color(0xFFF3B34C);
|
||||
|
||||
/// Success and free-state accents.
|
||||
static const success = Color(0xFF34D399);
|
||||
/// 成功状态。
|
||||
static const success = Color(0xFF2FA873);
|
||||
|
||||
/// Liked hearts use the primary accent.
|
||||
static const favorite = blue;
|
||||
/// 收藏和喜欢使用粉色强调。
|
||||
static const favorite = secondary;
|
||||
|
||||
/// Text placed on [gold].
|
||||
static const onGold = Color(0xFF2A1810);
|
||||
/// 金币底色上的文字。
|
||||
static const onGold = Color(0xFF5A3511);
|
||||
|
||||
/// Text and icons placed directly on [blue].
|
||||
/// 主色上的文字与图标。
|
||||
static const onPrimary = Color(0xFFFFFFFF);
|
||||
|
||||
/// Page background.
|
||||
static const ink = Color(0xFF0B0C10);
|
||||
/// 页面背景。
|
||||
static const ink = Color(0xFFFFF8F0);
|
||||
|
||||
/// Bottom navigation background (rendered at 95% with blur).
|
||||
static const bar = Color(0xFF0D0D11);
|
||||
/// 页面顶部暖色渐变起点。
|
||||
static const surfaceTop = Color(0xFFFFE9D6);
|
||||
|
||||
/// Cards lifted off [ink].
|
||||
static const card = Color(0xFF1B1C21);
|
||||
/// 底部导航底色。
|
||||
static const bar = Color(0xFFFFFDFB);
|
||||
|
||||
/// Alternate card surface from the mobile preview.
|
||||
static const cardAlt = Color(0xFF1C1D21);
|
||||
/// 中央操作按钮渐变。
|
||||
static const navCenterStart = Color(0xFFFF9A3D);
|
||||
static const navCenterEnd = Color(0xFFFF6A00);
|
||||
static const navCenterShadow = Color(0x33FF7A1A);
|
||||
|
||||
/// Floating surfaces, inputs, and nested rows.
|
||||
static const raised = Color(0xFF1C1D21);
|
||||
static const quick = Color(0xFF202126);
|
||||
static const input = Color(0xFF25252A);
|
||||
static const goldCard = Color(0xFF201B1E);
|
||||
/// 卡片轻阴影。
|
||||
static const cardShadow = Color(0x14FF8A3D);
|
||||
|
||||
/// Body text on dark surfaces.
|
||||
static const cream = Color(0xFFE6E1E3);
|
||||
/// 卡片与弹层。
|
||||
static const card = Color(0xFFFFFFFF);
|
||||
|
||||
/// Titles and high-emphasis text.
|
||||
static const onSurface = Color(0xFFFFFFFF);
|
||||
/// 次要卡片表面。
|
||||
static const cardAlt = Color(0xFFFFF4E9);
|
||||
|
||||
/// Secondary text.
|
||||
static const muted = Color(0xFFD2CDD0);
|
||||
/// 浮层、输入框和嵌套区域。
|
||||
static const raised = Color(0xFFFFF1E5);
|
||||
static const quick = Color(0xFFFFF0E1);
|
||||
static const input = Color(0xFFFFF4EA);
|
||||
static const goldCard = Color(0xFFFFF4DF);
|
||||
|
||||
/// Weak hints and timestamps.
|
||||
static const subtle = Color(0xFF9A96A3);
|
||||
/// 正文颜色。
|
||||
static const cream = Color(0xFF1F1B16);
|
||||
|
||||
/// Soft orange used for continue labels and secondary times.
|
||||
static const accent = Color(0xFFFFA490);
|
||||
/// 主文字。
|
||||
static const onSurface = Color(0xFF1F1B16);
|
||||
|
||||
/// 8% white border used by cards and inputs.
|
||||
static const border = Color(0x14FFFFFF);
|
||||
/// 次要文字。
|
||||
static const muted = Color(0xFF8C837B);
|
||||
|
||||
/// 14% white border used by glass controls.
|
||||
static const glassBorder = Color(0x24FFFFFF);
|
||||
/// 弱提示与时间。
|
||||
static const subtle = Color(0xFFB3AAA1);
|
||||
|
||||
static const outlineDark = Color(0xFF2A2C36);
|
||||
static const outlineVariantDark = Color(0xFF242329);
|
||||
static const outlineLight = Color(0xFF8E8E93);
|
||||
static const outlineVariantLight = Color(0xFFE4E4E7);
|
||||
/// 橙色强调文案。
|
||||
static const accent = blue;
|
||||
|
||||
/// 卡片描边。
|
||||
static const border = Color(0xFFF0E4D6);
|
||||
|
||||
/// 玻璃面板描边。
|
||||
static const glassBorder = Color(0x66FFFFFF);
|
||||
|
||||
/// 粉色角标。
|
||||
static const badgePink = Color(0xFFFFE3EC);
|
||||
static const badgePinkText = Color(0xFFFF6A8A);
|
||||
|
||||
/// 封面锁定数量与视频遮罩。
|
||||
static const overlayDark = Color(0x33000000);
|
||||
|
||||
/// 封面集数胶囊。
|
||||
static const badgeBeige = Color(0xFFFFF0DF);
|
||||
|
||||
/// 导航未选中。
|
||||
static const navUnselected = muted;
|
||||
|
||||
static const outlineDark = border;
|
||||
static const outlineVariantDark = border;
|
||||
static const outlineLight = muted;
|
||||
static const outlineVariantLight = border;
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
// Author: fruit.com.cn
|
||||
|
||||
/// Cross-page spacing, type, radius, and control sizes.
|
||||
/// 跨页面复用的间距、字号、圆角和控件尺寸。
|
||||
abstract final class AppDimens {
|
||||
static const double spaceXs = 4;
|
||||
static const double spaceSm = 8;
|
||||
@@ -9,17 +9,18 @@ abstract final class AppDimens {
|
||||
static const double spaceXl = 24;
|
||||
|
||||
static const double pageHorizontal = 16;
|
||||
static const double cardRadius = 12;
|
||||
static const double cardRadius = 16;
|
||||
static const double authCardRadius = 20;
|
||||
static const double cardPadding = 16;
|
||||
static const double innerRadius = 10;
|
||||
static const double innerRadius = 12;
|
||||
static const double innerPadding = 12;
|
||||
static const double pillRadius = 20;
|
||||
static const double glassSmallRadius = 12;
|
||||
static const double glassRadius = 14;
|
||||
static const double glassCardRadius = 14;
|
||||
static const double buttonRadius = 9;
|
||||
static const double coverRadius = 10;
|
||||
static const double pillRadius = 999;
|
||||
static const double glassSmallRadius = 16;
|
||||
static const double glassRadius = 20;
|
||||
static const double glassCardRadius = 20;
|
||||
static const double buttonRadius = 999;
|
||||
static const double coverRadius = 16;
|
||||
static const double sheetRadius = 20;
|
||||
|
||||
static const double caption = 12;
|
||||
static const double emptyStateSubtitle = 12.5;
|
||||
@@ -33,7 +34,7 @@ abstract final class AppDimens {
|
||||
static const double previewCardTitle = 13;
|
||||
static const double previewSectionTitle = 14;
|
||||
static const double chipFont = 10;
|
||||
static const double navLabel = 9;
|
||||
static const double navLabel = 10;
|
||||
|
||||
static const double buttonHeight = 48;
|
||||
static const double primaryButtonHeight = 52;
|
||||
@@ -44,8 +45,10 @@ abstract final class AppDimens {
|
||||
static const double tapTarget = 44;
|
||||
static const double contentHeaderHeight = 46;
|
||||
|
||||
static const double navHeight = 54;
|
||||
static const double navIcon = 17;
|
||||
static const double navHeight = 64;
|
||||
static const double navIcon = 20;
|
||||
static const double navCenter = 56;
|
||||
static const double navCenterIcon = 28;
|
||||
static const double progressHeight = 3;
|
||||
static const double progressRadius = 2;
|
||||
static const double progressLineHeight = 3;
|
||||
@@ -60,7 +63,11 @@ abstract final class AppDimens {
|
||||
|
||||
static const double watchPlaceholderHeight = 114;
|
||||
static const double heroBannerHeight = 176;
|
||||
static const double heroBannerRadius = 20;
|
||||
|
||||
static const double cardMeta = 9;
|
||||
static const double cardViews = 9;
|
||||
static const double cardMeta = 12;
|
||||
static const double cardViews = 11;
|
||||
static const double cardTitle = 15;
|
||||
static const double cardShadowBlur = 18;
|
||||
static const double cardShadowY = 6;
|
||||
}
|
||||
@@ -6,79 +6,62 @@ import 'package:flutter/services.dart';
|
||||
import 'app_colors.dart';
|
||||
import 'app_dimens.dart';
|
||||
|
||||
/// Obsidian Flare themes. Dark is the product default; light mirrors the same
|
||||
/// orange primary for system-light devices.
|
||||
/// K28-S 浅色暖橙主题。
|
||||
abstract final class AppTheme {
|
||||
static const _lightBackground = Color(0xFFF7F7F8);
|
||||
static const _darkBackground = AppColors.ink;
|
||||
|
||||
/// Light theme for system light mode.
|
||||
static ThemeData light() => _build(
|
||||
brightness: Brightness.light,
|
||||
surface: _lightBackground,
|
||||
accent: AppColors.blue,
|
||||
/// 页面顶部暖色到米白背景的渐变。
|
||||
static const LinearGradient pageGradient = LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [AppColors.surfaceTop, AppColors.ink],
|
||||
stops: [0, 0.24],
|
||||
);
|
||||
|
||||
/// Dark theme for system dark mode.
|
||||
static ThemeData dark() => _build(
|
||||
brightness: Brightness.dark,
|
||||
surface: _darkBackground,
|
||||
accent: AppColors.blue,
|
||||
/// 卡片轻阴影。
|
||||
static const BoxShadow cardShadow = BoxShadow(
|
||||
color: AppColors.cardShadow,
|
||||
blurRadius: AppDimens.cardShadowBlur,
|
||||
offset: Offset(0, AppDimens.cardShadowY),
|
||||
);
|
||||
|
||||
static ThemeData _build({
|
||||
required Brightness brightness,
|
||||
required Color surface,
|
||||
required Color accent,
|
||||
}) {
|
||||
final dark = brightness == Brightness.dark;
|
||||
final scheme = dark
|
||||
? const ColorScheme.dark(
|
||||
primary: AppColors.blue,
|
||||
onPrimary: AppColors.onPrimary,
|
||||
secondary: AppColors.secondary,
|
||||
onSecondary: AppColors.onPrimary,
|
||||
primaryContainer: AppColors.bluePressed,
|
||||
onPrimaryContainer: AppColors.onPrimary,
|
||||
secondaryContainer: AppColors.raised,
|
||||
onSecondaryContainer: AppColors.onPrimary,
|
||||
surface: _darkBackground,
|
||||
onSurface: AppColors.onSurface,
|
||||
outline: AppColors.outlineDark,
|
||||
outlineVariant: AppColors.outlineVariantDark,
|
||||
surfaceTint: AppColors.blue,
|
||||
inversePrimary: AppColors.blueSoft,
|
||||
)
|
||||
: ColorScheme.light(
|
||||
primary: AppColors.blue,
|
||||
onPrimary: AppColors.onPrimary,
|
||||
secondary: AppColors.secondary,
|
||||
onSecondary: AppColors.onPrimary,
|
||||
primaryContainer: AppColors.blue.withValues(alpha: 0.14),
|
||||
onPrimaryContainer: AppColors.ink,
|
||||
secondaryContainer: AppColors.blueSoft.withValues(alpha: 0.14),
|
||||
onSecondaryContainer: AppColors.ink,
|
||||
surface: _lightBackground,
|
||||
onSurface: AppColors.ink,
|
||||
outline: AppColors.outlineLight,
|
||||
outlineVariant: AppColors.outlineVariantLight,
|
||||
surfaceTint: AppColors.blue,
|
||||
inversePrimary: AppColors.blueSoft,
|
||||
);
|
||||
/// 全局浅色暖橙主题。
|
||||
static ThemeData light() {
|
||||
const scheme = ColorScheme.light(
|
||||
primary: AppColors.blue,
|
||||
onPrimary: AppColors.onPrimary,
|
||||
secondary: AppColors.secondary,
|
||||
onSecondary: AppColors.onPrimary,
|
||||
primaryContainer: AppColors.surfaceTop,
|
||||
onPrimaryContainer: AppColors.onSurface,
|
||||
secondaryContainer: AppColors.badgePink,
|
||||
onSecondaryContainer: AppColors.badgePinkText,
|
||||
surface: AppColors.ink,
|
||||
onSurface: AppColors.onSurface,
|
||||
outline: AppColors.border,
|
||||
outlineVariant: AppColors.border,
|
||||
surfaceTint: AppColors.blue,
|
||||
inversePrimary: AppColors.bluePressed,
|
||||
);
|
||||
final base = ThemeData(
|
||||
useMaterial3: true,
|
||||
brightness: brightness,
|
||||
brightness: Brightness.light,
|
||||
colorScheme: scheme,
|
||||
scaffoldBackgroundColor: surface,
|
||||
scaffoldBackgroundColor: AppColors.ink,
|
||||
fontFamily: 'PlusJakartaSans',
|
||||
progressIndicatorTheme: ProgressIndicatorThemeData(color: accent),
|
||||
sliderTheme: SliderThemeData(
|
||||
activeTrackColor: accent,
|
||||
progressIndicatorTheme: const ProgressIndicatorThemeData(
|
||||
color: AppColors.blue,
|
||||
),
|
||||
sliderTheme: const SliderThemeData(
|
||||
activeTrackColor: AppColors.blue,
|
||||
inactiveTrackColor: AppColors.border,
|
||||
thumbColor: AppColors.onPrimary,
|
||||
),
|
||||
tabBarTheme: TabBarThemeData(labelColor: accent, indicatorColor: accent),
|
||||
tabBarTheme: const TabBarThemeData(
|
||||
labelColor: AppColors.blue,
|
||||
indicatorColor: AppColors.blue,
|
||||
unselectedLabelColor: AppColors.muted,
|
||||
),
|
||||
textButtonTheme: TextButtonThemeData(
|
||||
style: TextButton.styleFrom(foregroundColor: accent),
|
||||
style: TextButton.styleFrom(foregroundColor: AppColors.blue),
|
||||
),
|
||||
filledButtonTheme: FilledButtonThemeData(
|
||||
style: ButtonStyle(
|
||||
@@ -87,25 +70,26 @@ abstract final class AppTheme {
|
||||
minimumSize: const WidgetStatePropertyAll(
|
||||
Size(0, AppDimens.buttonHeight),
|
||||
),
|
||||
shape: const WidgetStatePropertyAll(StadiumBorder()),
|
||||
),
|
||||
),
|
||||
outlinedButtonTheme: OutlinedButtonThemeData(
|
||||
style: ButtonStyle(
|
||||
foregroundColor: WidgetStatePropertyAll(
|
||||
dark ? AppColors.blueSoft : AppColors.bluePressed,
|
||||
),
|
||||
foregroundColor: const WidgetStatePropertyAll(AppColors.blue),
|
||||
minimumSize: const WidgetStatePropertyAll(
|
||||
Size(0, AppDimens.buttonHeight),
|
||||
),
|
||||
side: WidgetStatePropertyAll(
|
||||
BorderSide(
|
||||
color: dark ? AppColors.outlineDark : AppColors.outlineLight,
|
||||
),
|
||||
side: const WidgetStatePropertyAll(
|
||||
BorderSide(color: AppColors.border),
|
||||
),
|
||||
shape: const WidgetStatePropertyAll(StadiumBorder()),
|
||||
),
|
||||
),
|
||||
appBarTheme: const AppBarTheme(
|
||||
systemOverlayStyle: SystemUiOverlayStyle.light,
|
||||
backgroundColor: AppColors.ink,
|
||||
foregroundColor: AppColors.onSurface,
|
||||
elevation: 0,
|
||||
systemOverlayStyle: SystemUiOverlayStyle.dark,
|
||||
titleTextStyle: TextStyle(
|
||||
color: AppColors.onSurface,
|
||||
fontFamily: 'Outfit',
|
||||
@@ -113,6 +97,16 @@ abstract final class AppTheme {
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
),
|
||||
iconTheme: const IconThemeData(color: AppColors.onSurface),
|
||||
dividerTheme: const DividerThemeData(color: AppColors.border),
|
||||
cardTheme: const CardThemeData(
|
||||
color: AppColors.card,
|
||||
elevation: 0,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.all(Radius.circular(AppDimens.cardRadius)),
|
||||
side: BorderSide(color: AppColors.border),
|
||||
),
|
||||
),
|
||||
switchTheme: SwitchThemeData(
|
||||
thumbColor: WidgetStateProperty.resolveWith(
|
||||
(states) => states.contains(WidgetState.selected)
|
||||
@@ -120,36 +114,35 @@ abstract final class AppTheme {
|
||||
: null,
|
||||
),
|
||||
trackColor: WidgetStateProperty.resolveWith(
|
||||
(states) => states.contains(WidgetState.selected) ? accent : null,
|
||||
(states) =>
|
||||
states.contains(WidgetState.selected) ? AppColors.blue : null,
|
||||
),
|
||||
),
|
||||
snackBarTheme: SnackBarThemeData(
|
||||
backgroundColor: AppColors.bluePressed,
|
||||
contentTextStyle: const TextStyle(color: AppColors.onPrimary),
|
||||
snackBarTheme: const SnackBarThemeData(
|
||||
backgroundColor: AppColors.onSurface,
|
||||
contentTextStyle: TextStyle(color: AppColors.onPrimary),
|
||||
),
|
||||
);
|
||||
final textTheme = base.textTheme
|
||||
.apply(
|
||||
fontFamily: 'PlusJakartaSans',
|
||||
bodyColor: dark ? AppColors.cream : AppColors.ink,
|
||||
displayColor: dark ? AppColors.onSurface : AppColors.ink,
|
||||
bodyColor: AppColors.cream,
|
||||
displayColor: AppColors.onSurface,
|
||||
)
|
||||
.copyWith(
|
||||
displayLarge: _display(base.textTheme.displayLarge, dark),
|
||||
displayMedium: _display(base.textTheme.displayMedium, dark),
|
||||
displaySmall: _display(base.textTheme.displaySmall, dark),
|
||||
headlineLarge: _display(base.textTheme.headlineLarge, dark),
|
||||
headlineMedium: _display(base.textTheme.headlineMedium, dark),
|
||||
headlineSmall: _display(base.textTheme.headlineSmall, dark),
|
||||
titleLarge: _display(base.textTheme.titleLarge, dark),
|
||||
displayLarge: _display(base.textTheme.displayLarge),
|
||||
displayMedium: _display(base.textTheme.displayMedium),
|
||||
displaySmall: _display(base.textTheme.displaySmall),
|
||||
headlineLarge: _display(base.textTheme.headlineLarge),
|
||||
headlineMedium: _display(base.textTheme.headlineMedium),
|
||||
headlineSmall: _display(base.textTheme.headlineSmall),
|
||||
titleLarge: _display(base.textTheme.titleLarge),
|
||||
);
|
||||
return base.copyWith(textTheme: textTheme);
|
||||
}
|
||||
|
||||
static TextStyle? _display(TextStyle? style, bool dark) => style?.copyWith(
|
||||
fontFamily: 'Outfit',
|
||||
color: dark ? AppColors.onSurface : AppColors.ink,
|
||||
);
|
||||
static TextStyle? _display(TextStyle? style) =>
|
||||
style?.copyWith(fontFamily: 'Outfit', color: AppColors.onSurface);
|
||||
|
||||
static Color _buttonColor(Set<WidgetState> states) {
|
||||
if (states.contains(WidgetState.pressed) ||
|
||||
|
||||
@@ -7,7 +7,7 @@ import 'package:flutter/material.dart';
|
||||
import '../theme/app_colors.dart';
|
||||
import '../theme/app_dimens.dart';
|
||||
|
||||
/// One destination rendered by [AppBottomNav].
|
||||
/// 底部导航普通目的地。
|
||||
class AppBottomNavItem {
|
||||
const AppBottomNavItem({
|
||||
required this.tabKey,
|
||||
@@ -26,41 +26,69 @@ class AppBottomNavItem {
|
||||
final bool selected;
|
||||
}
|
||||
|
||||
/// Shared bottom navigation used by the root shell and standalone tabs.
|
||||
/// 底部导航中央操作按钮。
|
||||
class AppBottomNavCenterAction {
|
||||
const AppBottomNavCenterAction({
|
||||
required this.label,
|
||||
required this.onTap,
|
||||
this.key = const Key('nav-center-action'),
|
||||
});
|
||||
|
||||
final Key key;
|
||||
final String label;
|
||||
final VoidCallback onTap;
|
||||
}
|
||||
|
||||
/// 全局五槽底部导航。
|
||||
class AppBottomNav extends StatelessWidget {
|
||||
const AppBottomNav({
|
||||
super.key,
|
||||
required this.items,
|
||||
this.centerAction,
|
||||
this.backgroundColor = AppColors.bar,
|
||||
this.barKey,
|
||||
});
|
||||
|
||||
final List<AppBottomNavItem> items;
|
||||
final AppBottomNavCenterAction? centerAction;
|
||||
final Color backgroundColor;
|
||||
final Key? barKey;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => ClipRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||
child: SafeArea(
|
||||
top: false,
|
||||
child: Container(
|
||||
key: barKey,
|
||||
height: AppDimens.navHeight,
|
||||
decoration: BoxDecoration(
|
||||
color: backgroundColor.withValues(alpha: 0.95),
|
||||
border: const Border(
|
||||
top: BorderSide(color: AppColors.outlineVariantDark),
|
||||
Widget build(BuildContext context) {
|
||||
final action = centerAction;
|
||||
return ClipRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||
child: SafeArea(
|
||||
top: false,
|
||||
child: Container(
|
||||
key: barKey,
|
||||
height: AppDimens.navHeight,
|
||||
decoration: BoxDecoration(
|
||||
color: backgroundColor.withValues(alpha: 0.95),
|
||||
border: const Border(top: BorderSide(color: AppColors.border)),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
children: [for (final item in items) _NavDestination(item: item)],
|
||||
child: action == null
|
||||
? Row(
|
||||
children: [
|
||||
for (final item in items) _NavDestination(item: item),
|
||||
],
|
||||
)
|
||||
: Row(
|
||||
children: [
|
||||
for (final item in items.take(2))
|
||||
_NavDestination(item: item),
|
||||
Expanded(child: _CenterDestination(action: action)),
|
||||
for (final item in items.skip(2))
|
||||
_NavDestination(item: item),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _NavDestination extends StatelessWidget {
|
||||
@@ -78,7 +106,7 @@ class _NavDestination extends StatelessWidget {
|
||||
key: item.tabKey,
|
||||
onTap: item.onTap,
|
||||
child: ConstrainedBox(
|
||||
constraints: const BoxConstraints(minHeight: 48),
|
||||
constraints: const BoxConstraints(minHeight: AppDimens.navHeight),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
@@ -91,7 +119,7 @@ class _NavDestination extends StatelessWidget {
|
||||
size: AppDimens.navIcon,
|
||||
color: item.selected
|
||||
? AppColors.blue
|
||||
: Colors.white.withValues(alpha: 0.45),
|
||||
: AppColors.navUnselected,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
@@ -104,7 +132,7 @@ class _NavDestination extends StatelessWidget {
|
||||
fontWeight: item.selected ? FontWeight.w700 : FontWeight.w500,
|
||||
color: item.selected
|
||||
? AppColors.blue
|
||||
: Colors.white.withValues(alpha: 0.45),
|
||||
: AppColors.navUnselected,
|
||||
letterSpacing: 0,
|
||||
),
|
||||
),
|
||||
@@ -115,3 +143,53 @@ class _NavDestination extends StatelessWidget {
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
class _CenterDestination extends StatelessWidget {
|
||||
const _CenterDestination({required this.action});
|
||||
|
||||
final AppBottomNavCenterAction action;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Center(
|
||||
child: Semantics(
|
||||
button: true,
|
||||
label: action.label,
|
||||
child: Material(
|
||||
color: Colors.transparent,
|
||||
shape: const CircleBorder(),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: Ink(
|
||||
width: AppDimens.navCenter,
|
||||
height: AppDimens.navCenter,
|
||||
decoration: const BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [AppColors.navCenterStart, AppColors.navCenterEnd],
|
||||
),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: AppColors.navCenterShadow,
|
||||
blurRadius: 14,
|
||||
offset: Offset(0, 5),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: InkWell(
|
||||
key: action.key,
|
||||
customBorder: const CircleBorder(),
|
||||
onTap: action.onTap,
|
||||
child: const Icon(
|
||||
Icons.add_rounded,
|
||||
color: AppColors.onPrimary,
|
||||
size: AppDimens.navCenterIcon,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -7,7 +7,7 @@ import 'package:flutter/material.dart';
|
||||
import '../theme/app_colors.dart';
|
||||
import '../theme/app_dimens.dart';
|
||||
|
||||
/// Dark glass surface used by the home info card and floating controls.
|
||||
/// 首页信息卡与浮层控件使用的浅色玻璃面板。
|
||||
class GlassPanel extends StatelessWidget {
|
||||
const GlassPanel({
|
||||
super.key,
|
||||
@@ -38,7 +38,7 @@ class GlassPanel extends StatelessWidget {
|
||||
const LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [Color(0x24FFFFFF), Color(0x0DFFFFFF)],
|
||||
colors: [Color(0xE6FFFFFF), Color(0xB3FFFDFB)],
|
||||
),
|
||||
),
|
||||
child: Padding(padding: padding ?? EdgeInsets.zero, child: child),
|
||||
|
||||
@@ -82,6 +82,18 @@
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"allEpisodesBadge": "All {count}",
|
||||
"@allEpisodesBadge": {
|
||||
"placeholders": {
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"lockedEpisodeCount": "{count} locked",
|
||||
"@lockedEpisodeCount": {
|
||||
"placeholders": {
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"watchedPercent": "Watched {percent}%",
|
||||
"@watchedPercent": {
|
||||
"placeholders": {
|
||||
|
||||
@@ -82,6 +82,18 @@
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"allEpisodesBadge": "Semua {count}",
|
||||
"@allEpisodesBadge": {
|
||||
"placeholders": {
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"lockedEpisodeCount": "{count} terkunci",
|
||||
"@lockedEpisodeCount": {
|
||||
"placeholders": {
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"watchedPercent": "Sudah ditonton {percent}%",
|
||||
"@watchedPercent": {
|
||||
"placeholders": {
|
||||
|
||||
@@ -460,6 +460,18 @@ abstract class AppLocalizations {
|
||||
/// **'{count} views'**
|
||||
String viewCountLabel(int count);
|
||||
|
||||
/// No description provided for @allEpisodesBadge.
|
||||
///
|
||||
/// In en, this message translates to:
|
||||
/// **'All {count}'**
|
||||
String allEpisodesBadge(int count);
|
||||
|
||||
/// No description provided for @lockedEpisodeCount.
|
||||
///
|
||||
/// In en, this message translates to:
|
||||
/// **'{count} locked'**
|
||||
String lockedEpisodeCount(int count);
|
||||
|
||||
/// No description provided for @watchedPercent.
|
||||
///
|
||||
/// In en, this message translates to:
|
||||
|
||||
@@ -201,6 +201,16 @@ class AppLocalizationsEn extends AppLocalizations {
|
||||
return '$count views';
|
||||
}
|
||||
|
||||
@override
|
||||
String allEpisodesBadge(int count) {
|
||||
return 'All $count';
|
||||
}
|
||||
|
||||
@override
|
||||
String lockedEpisodeCount(int count) {
|
||||
return '$count locked';
|
||||
}
|
||||
|
||||
@override
|
||||
String watchedPercent(int percent) {
|
||||
return 'Watched $percent%';
|
||||
|
||||
@@ -201,6 +201,16 @@ class AppLocalizationsId extends AppLocalizations {
|
||||
return '$count tayangan';
|
||||
}
|
||||
|
||||
@override
|
||||
String allEpisodesBadge(int count) {
|
||||
return 'Semua $count';
|
||||
}
|
||||
|
||||
@override
|
||||
String lockedEpisodeCount(int count) {
|
||||
return '$count terkunci';
|
||||
}
|
||||
|
||||
@override
|
||||
String watchedPercent(int percent) {
|
||||
return 'Sudah ditonton $percent%';
|
||||
|
||||
@@ -196,6 +196,16 @@ class AppLocalizationsZh extends AppLocalizations {
|
||||
return '$count 次播放';
|
||||
}
|
||||
|
||||
@override
|
||||
String allEpisodesBadge(int count) {
|
||||
return '全 $count 集';
|
||||
}
|
||||
|
||||
@override
|
||||
String lockedEpisodeCount(int count) {
|
||||
return '锁 $count';
|
||||
}
|
||||
|
||||
@override
|
||||
String watchedPercent(int percent) {
|
||||
return '已观看 $percent%';
|
||||
|
||||
@@ -82,6 +82,18 @@
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"allEpisodesBadge": "全 {count} 集",
|
||||
"@allEpisodesBadge": {
|
||||
"placeholders": {
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"lockedEpisodeCount": "锁 {count}",
|
||||
"@lockedEpisodeCount": {
|
||||
"placeholders": {
|
||||
"count": {"type": "int"}
|
||||
}
|
||||
},
|
||||
"watchedPercent": "已观看 {percent}%",
|
||||
"@watchedPercent": {
|
||||
"placeholders": {
|
||||
|
||||
@@ -50,7 +50,7 @@ class _AccountDeactivatePageState extends State<AccountDeactivatePage> {
|
||||
final signedIn = context.watch<AuthController>().isSignedIn;
|
||||
final canShow = signedIn || _logic.scheduledAt != null;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('account-deactivate-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -50,7 +50,7 @@ class _AccountDevicesPageState extends State<AccountDevicesPage> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final signedIn = context.watch<AuthController>().isSignedIn;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('account-devices-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -51,7 +51,7 @@ class _AccountExportPageState extends State<AccountExportPage> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final signedIn = context.watch<AuthController>().isSignedIn;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('account-export-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -71,7 +71,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final signedIn = context.watch<AuthController>().isSignedIn;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('account-profile-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -141,7 +141,7 @@ class _AuthPageState extends State<AuthPage> {
|
||||
Widget build(BuildContext context) {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
resizeToAvoidBottomInset: true,
|
||||
backgroundColor: AppColors.ink,
|
||||
@@ -332,7 +332,7 @@ class _AuthPageState extends State<AuthPage> {
|
||||
Text(
|
||||
l10n.authLandingSubtitle,
|
||||
textAlign: TextAlign.center,
|
||||
style: const TextStyle(color: Color(0xFF9A96A3), fontSize: 11),
|
||||
style: const TextStyle(color: AppColors.subtle, fontSize: 11),
|
||||
),
|
||||
const SizedBox(height: 22),
|
||||
_AuthEntryButton(
|
||||
@@ -358,7 +358,7 @@ class _AuthPageState extends State<AuthPage> {
|
||||
key: const Key('auth-legal'),
|
||||
textAlign: TextAlign.center,
|
||||
style: const TextStyle(
|
||||
color: Color(0xFF6B6772),
|
||||
color: AppColors.muted,
|
||||
fontSize: 9,
|
||||
height: 1.6,
|
||||
),
|
||||
@@ -442,8 +442,7 @@ class _AuthEntryButton extends StatelessWidget {
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
if (icon != null)
|
||||
Icon(icon, size: 16, color: foreground),
|
||||
if (icon != null) Icon(icon, size: 16, color: foreground),
|
||||
if (icon != null) const SizedBox(width: 7),
|
||||
Flexible(
|
||||
child: Text(
|
||||
|
||||
@@ -7,7 +7,7 @@ import '../../core/theme/app_dimens.dart';
|
||||
import '../../core/theme/app_theme.dart';
|
||||
import '../../l10n/app_localizations.dart';
|
||||
|
||||
/// K28-A1 placeholder for the future creation workspace.
|
||||
/// K28-A1 创作页占位骨架。
|
||||
class CreatePage extends StatelessWidget {
|
||||
const CreatePage({super.key});
|
||||
|
||||
@@ -15,7 +15,7 @@ class CreatePage extends StatelessWidget {
|
||||
Widget build(BuildContext context) {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: SafeArea(
|
||||
bottom: false,
|
||||
child: Padding(
|
||||
|
||||
@@ -27,7 +27,7 @@ class CategoryDramasPage extends StatelessWidget {
|
||||
Widget build(BuildContext context) {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('category-dramas-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -108,9 +108,9 @@ class _DiscoverPageState extends State<DiscoverPage> {
|
||||
),
|
||||
);
|
||||
return AnnotatedRegion<SystemUiOverlayStyle>(
|
||||
value: SystemUiOverlayStyle.light,
|
||||
value: SystemUiOverlayStyle.dark,
|
||||
child: Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: embedded
|
||||
? content
|
||||
: Scaffold(backgroundColor: AppColors.ink, body: content),
|
||||
@@ -340,6 +340,10 @@ class _DiscoverPageState extends State<DiscoverPage> {
|
||||
}
|
||||
|
||||
Widget _bottomNav(AppLocalizations l10n) => AppBottomNav(
|
||||
centerAction: AppBottomNavCenterAction(
|
||||
label: l10n.createTab,
|
||||
onTap: () => _act(DiscoverPageAction.create),
|
||||
),
|
||||
items: [
|
||||
AppBottomNavItem(
|
||||
tabKey: const Key('discover-nav-home'),
|
||||
|
||||
@@ -88,12 +88,12 @@ class DiscoverHeader extends StatelessWidget {
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [Color(0xFF6A5CFF), AppColors.blue],
|
||||
colors: [AppColors.secondary, AppColors.blue],
|
||||
),
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.person_rounded,
|
||||
color: AppColors.onSurface,
|
||||
color: AppColors.onPrimary,
|
||||
size: 18,
|
||||
),
|
||||
),
|
||||
@@ -124,7 +124,7 @@ class _HeaderIcon extends StatelessWidget {
|
||||
onPressed: onTap,
|
||||
padding: EdgeInsets.zero,
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: const Color(0xFF2C2D33),
|
||||
backgroundColor: AppColors.raised,
|
||||
foregroundColor: AppColors.onSurface,
|
||||
),
|
||||
icon: Icon(icon, size: 18),
|
||||
|
||||
@@ -5,11 +5,15 @@ import 'package:flutter/material.dart';
|
||||
import '../../../core/config/app_config.dart';
|
||||
import '../../../core/data/models/drama.dart';
|
||||
import '../../../core/theme/app_colors.dart';
|
||||
import '../../../core/theme/app_dimens.dart';
|
||||
import '../../../core/theme/app_theme.dart';
|
||||
import '../../../l10n/app_localizations.dart';
|
||||
|
||||
const int _columns = 2;
|
||||
const double _columnGap = 10;
|
||||
const double _cardGap = 10;
|
||||
const double _addSize = 28;
|
||||
const double _addIconSize = 18;
|
||||
|
||||
/// 剧场/分类页共用的双列剧目网格。
|
||||
class DramaGrid extends StatelessWidget {
|
||||
@@ -71,19 +75,33 @@ class DramaGridCard extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return InkWell(
|
||||
key: Key('home-drama-card-${drama.id}'),
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_cover(),
|
||||
const SizedBox(height: 5),
|
||||
_title(),
|
||||
const SizedBox(height: 2),
|
||||
_genre(),
|
||||
],
|
||||
return Container(
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.card,
|
||||
borderRadius: BorderRadius.circular(AppDimens.cardRadius),
|
||||
boxShadow: const [AppTheme.cardShadow],
|
||||
),
|
||||
child: Material(
|
||||
color: Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(AppDimens.cardRadius),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: InkWell(
|
||||
key: Key('home-drama-card-${drama.id}'),
|
||||
onTap: onTap,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(AppDimens.spaceSm),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_cover(),
|
||||
const SizedBox(height: AppDimens.spaceSm),
|
||||
_title(),
|
||||
const SizedBox(height: AppDimens.spaceXs),
|
||||
_footer(),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
@@ -94,34 +112,90 @@ class DramaGridCard extends StatelessWidget {
|
||||
drama.episodes.any((episode) => episode.isFree);
|
||||
return ClipRRect(
|
||||
key: Key('home-drama-cover-${drama.id}'),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
borderRadius: BorderRadius.circular(AppDimens.coverRadius),
|
||||
child: Stack(
|
||||
children: [
|
||||
_DiscoverCoverImage(path: drama.posterUrl),
|
||||
if (free) Positioned(top: 6, left: 6, child: _freeBadge()),
|
||||
Positioned(top: 8, left: 8, child: _tagBadge(free)),
|
||||
if (_lockedCount > 0)
|
||||
Positioned(top: 8, right: 8, child: _lockedBadge()),
|
||||
Positioned(right: 8, bottom: 8, child: _episodeBadge()),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _freeBadge() {
|
||||
int get _lockedCount {
|
||||
final explicit = drama.episodes.where((episode) => episode.locked).length;
|
||||
if (explicit > 0) return explicit;
|
||||
final inferred = drama.episodeCount - drama.freeEpisodes;
|
||||
return inferred > 0 ? inferred : 0;
|
||||
}
|
||||
|
||||
Widget _tagBadge(bool free) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
||||
key: Key('drama-tag-${drama.id}'),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.blue,
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
color: AppColors.badgePink,
|
||||
borderRadius: BorderRadius.circular(AppDimens.pillRadius),
|
||||
),
|
||||
child: Text(
|
||||
l10n.free,
|
||||
free ? l10n.free : l10n.originalTag,
|
||||
style: const TextStyle(
|
||||
color: AppColors.onPrimary,
|
||||
fontSize: 8,
|
||||
color: AppColors.badgePinkText,
|
||||
fontSize: AppDimens.cardMeta,
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _lockedBadge() {
|
||||
return Container(
|
||||
key: Key('drama-locked-${drama.id}'),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.overlayDark,
|
||||
borderRadius: BorderRadius.circular(AppDimens.pillRadius),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(Icons.lock_rounded, color: AppColors.onPrimary, size: 11),
|
||||
const SizedBox(width: 2),
|
||||
Text(
|
||||
l10n.lockedEpisodeCount(_lockedCount),
|
||||
style: const TextStyle(
|
||||
color: AppColors.onPrimary,
|
||||
fontSize: 9,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _episodeBadge() {
|
||||
return Container(
|
||||
key: Key('drama-episodes-badge-${drama.id}'),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.badgeBeige,
|
||||
borderRadius: BorderRadius.circular(AppDimens.pillRadius),
|
||||
),
|
||||
child: Text(
|
||||
l10n.allEpisodesBadge(drama.episodeCount),
|
||||
style: const TextStyle(
|
||||
color: AppColors.onSurface,
|
||||
fontSize: 9,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _title() {
|
||||
return Text(
|
||||
drama.title,
|
||||
@@ -130,7 +204,7 @@ class DramaGridCard extends StatelessWidget {
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
color: AppColors.onSurface,
|
||||
fontSize: 11,
|
||||
fontSize: AppDimens.cardTitle,
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
);
|
||||
@@ -143,7 +217,32 @@ class DramaGridCard extends StatelessWidget {
|
||||
key: Key('home-drama-genre-${drama.id}'),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 9),
|
||||
style: const TextStyle(
|
||||
color: AppColors.muted,
|
||||
fontSize: AppDimens.cardMeta,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _footer() {
|
||||
return Row(
|
||||
children: [
|
||||
Expanded(child: _genre()),
|
||||
Container(
|
||||
key: Key('drama-add-${drama.id}'),
|
||||
width: _addSize,
|
||||
height: _addSize,
|
||||
decoration: const BoxDecoration(
|
||||
color: AppColors.blue,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.add_rounded,
|
||||
color: AppColors.onPrimary,
|
||||
size: _addIconSize,
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -135,7 +135,7 @@ class _RankingSectionState extends State<RankingSection> {
|
||||
final selected = logic.board == board;
|
||||
return Material(
|
||||
key: key,
|
||||
color: selected ? AppColors.blue : AppColors.raised,
|
||||
color: selected ? AppColors.blue : AppColors.card,
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: InkWell(
|
||||
@@ -145,7 +145,7 @@ class _RankingSectionState extends State<RankingSection> {
|
||||
child: Text(
|
||||
label,
|
||||
style: TextStyle(
|
||||
color: selected ? AppColors.onPrimary : AppColors.muted,
|
||||
color: selected ? AppColors.onPrimary : AppColors.onSurface,
|
||||
fontSize: 9,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
|
||||
@@ -54,7 +54,7 @@ class _DownloadsPageState extends State<DownloadsPage> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final signedIn = context.watch<AuthController>().isSignedIn;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('downloads-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
@@ -168,11 +168,8 @@ class _DownloadsBody extends StatelessWidget {
|
||||
);
|
||||
Navigator.of(context).push(
|
||||
MaterialPageRoute<void>(
|
||||
builder: (_) => PlayerPage(
|
||||
drama: drama,
|
||||
initialIndex: 0,
|
||||
downloads: downloads,
|
||||
),
|
||||
builder: (_) =>
|
||||
PlayerPage(drama: drama, initialIndex: 0, downloads: downloads),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -73,7 +73,7 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: ListenableBuilder(
|
||||
listenable: logic,
|
||||
builder: (context, _) => _page(context),
|
||||
@@ -171,7 +171,7 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [Color(0x33000000), Color(0xCC0B0C10)],
|
||||
colors: [Color(0x33000000), AppColors.onSurface],
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -363,7 +363,7 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
|
||||
? AppColors.blue
|
||||
: locked
|
||||
? AppColors.secondary.withValues(alpha: 0.16)
|
||||
: const Color(0xFF29272B),
|
||||
: AppColors.raised,
|
||||
borderRadius: BorderRadius.circular(9),
|
||||
),
|
||||
child: Text(
|
||||
@@ -461,8 +461,8 @@ class _DramaDetailPageState extends State<DramaDetailPage> {
|
||||
child: Container(
|
||||
width: 36,
|
||||
height: 36,
|
||||
decoration: const BoxDecoration(
|
||||
color: Color(0x80000000),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.card.withValues(alpha: 0.92),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: const Icon(
|
||||
@@ -562,8 +562,8 @@ class _RoundAction extends StatelessWidget {
|
||||
return Container(
|
||||
width: 36,
|
||||
height: 36,
|
||||
decoration: const BoxDecoration(
|
||||
color: Color(0x80000000),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.card.withValues(alpha: 0.92),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: IconButton(
|
||||
@@ -592,7 +592,7 @@ class _ResumeBar extends StatelessWidget {
|
||||
child: LinearProgressIndicator(
|
||||
value: fraction,
|
||||
minHeight: 3,
|
||||
backgroundColor: const Color(0xFF474248),
|
||||
backgroundColor: AppColors.border,
|
||||
valueColor: const AlwaysStoppedAnimation(AppColors.blue),
|
||||
),
|
||||
),
|
||||
|
||||
@@ -51,7 +51,7 @@ class _FavoritesPageState extends State<FavoritesPage> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final signedIn = context.watch<AuthController>().isSignedIn;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
backgroundColor: AppColors.ink,
|
||||
appBar: AppBar(
|
||||
|
||||
@@ -7,10 +7,10 @@ import 'package:flutter/foundation.dart';
|
||||
import '../../core/data/models/watch_progress.dart';
|
||||
import '../../core/data/repositories/watch_history_repository.dart';
|
||||
|
||||
/// Home browse channel, backed only by data already present in the catalogue.
|
||||
/// 首页频道,只依赖目录中已有数据排序或过滤。
|
||||
enum HomeChannel { hot, free, newReleases, ranking }
|
||||
|
||||
/// Local UI state for the browse-first home page.
|
||||
/// 浏览型首页的本地 UI 状态。
|
||||
class HomeBrowseLogic extends ChangeNotifier {
|
||||
HomeBrowseLogic({required this.history}) {
|
||||
unawaited(refreshRecent());
|
||||
@@ -24,7 +24,7 @@ class HomeBrowseLogic extends ChangeNotifier {
|
||||
bool loadingRecent = false;
|
||||
bool _disposed = false;
|
||||
|
||||
/// First unfinished record with a real position.
|
||||
/// 第一条未完成且存在真实播放位置的记录。
|
||||
WatchProgress? get primaryRecord {
|
||||
for (final record in recent) {
|
||||
if (!record.finished && record.hasPosition) return record;
|
||||
@@ -32,14 +32,14 @@ class HomeBrowseLogic extends ChangeNotifier {
|
||||
return null;
|
||||
}
|
||||
|
||||
/// Changes the selected browse channel without triggering network work.
|
||||
/// 切换频道,不触发额外网络请求。
|
||||
void selectChannel(HomeChannel value) {
|
||||
if (channel == value) return;
|
||||
channel = value;
|
||||
_notify();
|
||||
}
|
||||
|
||||
/// Reloads continuation data; signed-out reads simply return an empty list.
|
||||
/// 重新加载续看数据;未登录时返回空列表。
|
||||
Future<void> refreshRecent() async {
|
||||
loadingRecent = true;
|
||||
_notify();
|
||||
@@ -53,7 +53,7 @@ class HomeBrowseLogic extends ChangeNotifier {
|
||||
}
|
||||
}
|
||||
|
||||
/// Refreshes continuation data when the home tab becomes visible again.
|
||||
/// 首页重新可见时刷新续看数据。
|
||||
void syncPage({required bool active, required bool wasActive}) {
|
||||
if (active && !wasActive) unawaited(refreshRecent());
|
||||
}
|
||||
|
||||
@@ -20,7 +20,7 @@ import 'home_browse_logic.dart';
|
||||
import 'widgets/home_browse_header.dart';
|
||||
import 'widgets/home_drama_grid.dart';
|
||||
|
||||
/// Browse-first home page with channels, hero, continuation, and catalogue.
|
||||
/// 浏览型首页:频道、Hero、继续观看与剧目目录。
|
||||
class HomeBrowseView extends StatefulWidget {
|
||||
const HomeBrowseView({
|
||||
super.key,
|
||||
@@ -214,7 +214,7 @@ class _HomeBrowseViewState extends State<HomeBrowseView> {
|
||||
color: selected ? AppColors.blue : AppColors.border,
|
||||
),
|
||||
labelStyle: TextStyle(
|
||||
color: selected ? AppColors.onPrimary : AppColors.muted,
|
||||
color: selected ? AppColors.onPrimary : AppColors.onSurface,
|
||||
fontSize: AppDimens.chipFont,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
|
||||
@@ -8,7 +8,6 @@ import 'package:provider/provider.dart';
|
||||
import '../../core/data/models/drama.dart';
|
||||
import '../../core/data/services/catalog_controller.dart';
|
||||
import '../../core/platform/haptics.dart';
|
||||
import '../../core/theme/app_colors.dart';
|
||||
import '../../core/theme/app_theme.dart';
|
||||
import '../../core/widgets/app_bottom_nav.dart';
|
||||
import '../../core/widgets/empty_state.dart';
|
||||
@@ -32,8 +31,11 @@ class HomePage extends StatelessWidget {
|
||||
if (!catalog.settled) return const SplashPage();
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
child: _buildHome(context, catalog, l10n),
|
||||
data: AppTheme.light(),
|
||||
child: DecoratedBox(
|
||||
decoration: const BoxDecoration(gradient: AppTheme.pageGradient),
|
||||
child: _buildHome(context, catalog, l10n),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@@ -44,19 +46,19 @@ class HomePage extends StatelessWidget {
|
||||
) {
|
||||
if (catalog.loading) {
|
||||
return const Scaffold(
|
||||
backgroundColor: AppColors.ink,
|
||||
backgroundColor: Colors.transparent,
|
||||
body: Center(child: CircularProgressIndicator()),
|
||||
);
|
||||
}
|
||||
if (catalog.error != null) {
|
||||
return Scaffold(
|
||||
backgroundColor: AppColors.ink,
|
||||
backgroundColor: Colors.transparent,
|
||||
body: HomeFailureView(onRetry: catalog.load),
|
||||
);
|
||||
}
|
||||
if (catalog.dramas.isEmpty) {
|
||||
return Scaffold(
|
||||
backgroundColor: AppColors.ink,
|
||||
backgroundColor: Colors.transparent,
|
||||
body: EmptyState(
|
||||
key: const Key('home-empty'),
|
||||
icon: Icons.movie_outlined,
|
||||
@@ -75,7 +77,7 @@ class HomePage extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// Home catalog failure with a single recovery action.
|
||||
/// 首页目录加载失败与重试入口。
|
||||
class HomeFailureView extends StatelessWidget {
|
||||
const HomeFailureView({super.key, required this.onRetry});
|
||||
|
||||
@@ -93,7 +95,7 @@ class HomeFailureView extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// The four primary destinations share a single route and keep their state.
|
||||
/// 四个根页面共享同一路由并保持各自状态。
|
||||
class _HomeTabs extends StatefulWidget {
|
||||
const _HomeTabs({super.key, required this.dramas});
|
||||
|
||||
@@ -136,7 +138,7 @@ class _HomeTabsState extends State<_HomeTabs> {
|
||||
},
|
||||
child: Scaffold(
|
||||
key: logic.scaffoldKey,
|
||||
backgroundColor: AppColors.ink,
|
||||
backgroundColor: Colors.transparent,
|
||||
body: _body(context),
|
||||
bottomNavigationBar: logic.videoImmersive ? null : _nav(context, l10n),
|
||||
),
|
||||
@@ -193,6 +195,10 @@ class _HomeTabsState extends State<_HomeTabs> {
|
||||
Widget _nav(BuildContext context, AppLocalizations l10n) {
|
||||
return AppBottomNav(
|
||||
barKey: const Key('home-tabs-bar'),
|
||||
centerAction: AppBottomNavCenterAction(
|
||||
label: l10n.createTab,
|
||||
onTap: () => _selectTab(context, 2),
|
||||
),
|
||||
items: [
|
||||
_navItem(context, l10n, 0),
|
||||
_navItem(context, l10n, 1),
|
||||
|
||||
@@ -8,7 +8,7 @@ import '../../../l10n/app_localizations.dart';
|
||||
|
||||
const double _searchHeight = 36;
|
||||
|
||||
/// Fixed home header with catalogue search, weekday, and profile entry.
|
||||
/// 首页固定顶栏:搜索、星期与头像入口。
|
||||
class HomeBrowseHeader extends StatelessWidget {
|
||||
const HomeBrowseHeader({
|
||||
super.key,
|
||||
|
||||
@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
|
||||
import '../../../core/data/models/drama.dart';
|
||||
import '../../../core/theme/app_colors.dart';
|
||||
import '../../../core/theme/app_dimens.dart';
|
||||
import '../../../core/theme/app_theme.dart';
|
||||
import '../../../core/widgets/remote_image.dart';
|
||||
import '../../../l10n/app_localizations.dart';
|
||||
|
||||
@@ -12,8 +13,10 @@ const int _columns = 2;
|
||||
const double _columnGap = 10;
|
||||
const double _cardGap = 10;
|
||||
const double _coverAspectRatio = 3 / 4;
|
||||
const double _addSize = 28;
|
||||
const double _addIconSize = 18;
|
||||
|
||||
/// Two-column drama grid used by the browse-first home page.
|
||||
/// 首页浏览态使用的双列剧目网格。
|
||||
class HomeDramaGrid extends StatelessWidget {
|
||||
const HomeDramaGrid({
|
||||
super.key,
|
||||
@@ -57,7 +60,7 @@ class HomeDramaGrid extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// Home catalogue card with title, genre, free badge, episode count, and heat.
|
||||
/// 首页剧卡:封面、角标、标题、题材、集数与热度。
|
||||
class HomeDramaCard extends StatelessWidget {
|
||||
const HomeDramaCard({
|
||||
super.key,
|
||||
@@ -72,21 +75,35 @@ class HomeDramaCard extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return InkWell(
|
||||
key: Key('home-drama-card-${drama.id}'),
|
||||
onTap: onTap,
|
||||
borderRadius: BorderRadius.circular(AppDimens.coverRadius),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_cover(),
|
||||
const SizedBox(height: AppDimens.spaceXs),
|
||||
_title(),
|
||||
const SizedBox(height: 2),
|
||||
_genre(),
|
||||
const SizedBox(height: AppDimens.spaceXs),
|
||||
_metadata(),
|
||||
],
|
||||
return Container(
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.card,
|
||||
borderRadius: BorderRadius.circular(AppDimens.cardRadius),
|
||||
boxShadow: const [AppTheme.cardShadow],
|
||||
),
|
||||
child: Material(
|
||||
color: Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(AppDimens.cardRadius),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: InkWell(
|
||||
key: Key('home-drama-card-${drama.id}'),
|
||||
onTap: onTap,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(AppDimens.spaceSm),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_cover(),
|
||||
const SizedBox(height: AppDimens.spaceSm),
|
||||
_title(),
|
||||
const SizedBox(height: AppDimens.spaceXs),
|
||||
_genre(),
|
||||
const SizedBox(height: AppDimens.spaceXs),
|
||||
_metadata(),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
@@ -104,7 +121,10 @@ class HomeDramaCard extends StatelessWidget {
|
||||
showFallbackIcon: true,
|
||||
fallbackAspectRatio: _coverAspectRatio,
|
||||
),
|
||||
if (_isFree) Positioned(top: 6, left: 6, child: _freeBadge()),
|
||||
Positioned(top: 8, left: 8, child: _tagBadge()),
|
||||
if (_lockedCount > 0)
|
||||
Positioned(top: 8, right: 8, child: _lockedBadge()),
|
||||
Positioned(right: 8, bottom: 8, child: _episodeBadge()),
|
||||
],
|
||||
),
|
||||
);
|
||||
@@ -115,17 +135,29 @@ class HomeDramaCard extends StatelessWidget {
|
||||
drama.episodes.any((episode) => episode.isFree);
|
||||
}
|
||||
|
||||
Widget _freeBadge() {
|
||||
int get _lockedCount {
|
||||
final explicit = drama.episodes.where((episode) => episode.locked).length;
|
||||
if (explicit > 0) return explicit;
|
||||
final inferred = drama.episodeCount - drama.freeEpisodes;
|
||||
return inferred > 0 ? inferred : 0;
|
||||
}
|
||||
|
||||
Widget _tagBadge() {
|
||||
final label = _isFree ? l10n.free : l10n.originalTag;
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
||||
key: Key('home-drama-tag-${drama.id}'),
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: AppDimens.spaceSm,
|
||||
vertical: 3,
|
||||
),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.blue,
|
||||
borderRadius: BorderRadius.circular(6),
|
||||
color: AppColors.badgePink,
|
||||
borderRadius: BorderRadius.circular(AppDimens.pillRadius),
|
||||
),
|
||||
child: Text(
|
||||
l10n.free,
|
||||
label,
|
||||
style: const TextStyle(
|
||||
color: AppColors.onPrimary,
|
||||
color: AppColors.badgePinkText,
|
||||
fontSize: AppDimens.cardMeta,
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
@@ -133,6 +165,51 @@ class HomeDramaCard extends StatelessWidget {
|
||||
);
|
||||
}
|
||||
|
||||
Widget _lockedBadge() {
|
||||
return Container(
|
||||
key: Key('home-drama-locked-${drama.id}'),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.overlayDark,
|
||||
borderRadius: BorderRadius.circular(AppDimens.pillRadius),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(Icons.lock_rounded, color: AppColors.onPrimary, size: 11),
|
||||
const SizedBox(width: 2),
|
||||
Text(
|
||||
l10n.lockedEpisodeCount(_lockedCount),
|
||||
style: const TextStyle(
|
||||
color: AppColors.onPrimary,
|
||||
fontSize: 9,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _episodeBadge() {
|
||||
return Container(
|
||||
key: Key('home-drama-episodes-badge-${drama.id}'),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.badgeBeige,
|
||||
borderRadius: BorderRadius.circular(AppDimens.pillRadius),
|
||||
),
|
||||
child: Text(
|
||||
l10n.allEpisodesBadge(drama.episodeCount),
|
||||
style: const TextStyle(
|
||||
color: AppColors.onSurface,
|
||||
fontSize: 9,
|
||||
fontWeight: FontWeight.w700,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _title() {
|
||||
return Text(
|
||||
drama.title,
|
||||
@@ -141,7 +218,7 @@ class HomeDramaCard extends StatelessWidget {
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
color: AppColors.onSurface,
|
||||
fontSize: AppDimens.previewSectionTitle,
|
||||
fontSize: AppDimens.cardTitle,
|
||||
fontWeight: FontWeight.w800,
|
||||
),
|
||||
);
|
||||
@@ -162,24 +239,44 @@ class HomeDramaCard extends StatelessWidget {
|
||||
}
|
||||
|
||||
Widget _metadata() {
|
||||
return Wrap(
|
||||
spacing: AppDimens.spaceSm,
|
||||
runSpacing: AppDimens.spaceXs,
|
||||
return Row(
|
||||
children: [
|
||||
Text(
|
||||
l10n.episodeCount(drama.episodeCount),
|
||||
key: Key('home-drama-episode-count-${drama.id}'),
|
||||
style: const TextStyle(
|
||||
color: AppColors.subtle,
|
||||
fontSize: AppDimens.cardViews,
|
||||
Expanded(
|
||||
child: Wrap(
|
||||
spacing: AppDimens.spaceSm,
|
||||
runSpacing: AppDimens.spaceXs,
|
||||
children: [
|
||||
Text(
|
||||
l10n.episodeCount(drama.episodeCount),
|
||||
key: Key('home-drama-episode-count-${drama.id}'),
|
||||
style: const TextStyle(
|
||||
color: AppColors.subtle,
|
||||
fontSize: AppDimens.cardViews,
|
||||
),
|
||||
),
|
||||
Text(
|
||||
l10n.viewCountLabel(drama.viewCount),
|
||||
key: Key('home-drama-views-${drama.id}'),
|
||||
style: const TextStyle(
|
||||
color: AppColors.subtle,
|
||||
fontSize: AppDimens.cardViews,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
Text(
|
||||
l10n.viewCountLabel(drama.viewCount),
|
||||
key: Key('home-drama-views-${drama.id}'),
|
||||
style: const TextStyle(
|
||||
color: AppColors.subtle,
|
||||
fontSize: AppDimens.cardViews,
|
||||
Container(
|
||||
key: Key('home-drama-add-${drama.id}'),
|
||||
width: _addSize,
|
||||
height: _addSize,
|
||||
decoration: const BoxDecoration(
|
||||
color: AppColors.blue,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.add_rounded,
|
||||
color: AppColors.onPrimary,
|
||||
size: _addIconSize,
|
||||
),
|
||||
),
|
||||
],
|
||||
|
||||
@@ -92,7 +92,7 @@ class _MyPageState extends State<MyPage> {
|
||||
),
|
||||
);
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: embedded
|
||||
? content
|
||||
: Scaffold(backgroundColor: AppColors.ink, body: content),
|
||||
@@ -242,6 +242,10 @@ class _MyPageState extends State<MyPage> {
|
||||
|
||||
Widget _bottomNav(AppLocalizations l10n) {
|
||||
return AppBottomNav(
|
||||
centerAction: AppBottomNavCenterAction(
|
||||
label: l10n.createTab,
|
||||
onTap: () => _act(MyPageAction.create),
|
||||
),
|
||||
items: [
|
||||
AppBottomNavItem(
|
||||
tabKey: const Key('mine-nav-home'),
|
||||
|
||||
@@ -101,7 +101,7 @@ class ContinueWatchingCard extends StatelessWidget {
|
||||
key: progressKey,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 9),
|
||||
style: const TextStyle(color: AppColors.muted, fontSize: 9),
|
||||
),
|
||||
],
|
||||
);
|
||||
|
||||
@@ -46,12 +46,12 @@ class MineHeader extends StatelessWidget {
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [Color(0xFF6A5CFF), AppColors.blue],
|
||||
colors: [AppColors.secondary, AppColors.blue],
|
||||
),
|
||||
),
|
||||
child: const Icon(
|
||||
Icons.person_rounded,
|
||||
color: AppColors.onSurface,
|
||||
color: AppColors.onPrimary,
|
||||
size: 22,
|
||||
),
|
||||
);
|
||||
@@ -76,7 +76,7 @@ class MineHeader extends StatelessWidget {
|
||||
subtitle,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 10),
|
||||
style: const TextStyle(color: AppColors.muted, fontSize: 10),
|
||||
),
|
||||
],
|
||||
);
|
||||
|
||||
@@ -44,7 +44,7 @@ class _NoticesPageState extends State<NoticesPage> {
|
||||
Widget build(BuildContext context) {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('notices-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -669,7 +669,7 @@ class PlayerLogic extends ChangeNotifier {
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
color: Color(0xFFB7B3B8),
|
||||
color: AppColors.muted,
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w400,
|
||||
),
|
||||
|
||||
@@ -146,9 +146,9 @@ class _PlayerPageState extends State<PlayerPage> with WidgetsBindingObserver {
|
||||
),
|
||||
);
|
||||
return AnnotatedRegion<SystemUiOverlayStyle>(
|
||||
value: SystemUiOverlayStyle.light,
|
||||
value: SystemUiOverlayStyle.dark,
|
||||
child: Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: widget.embedded
|
||||
? content
|
||||
: Scaffold(backgroundColor: AppColors.ink, body: content),
|
||||
@@ -1155,7 +1155,7 @@ class _TopAction extends StatelessWidget {
|
||||
onPressed: onPressed,
|
||||
padding: EdgeInsets.zero,
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: const Color(0xFF2C2D33),
|
||||
backgroundColor: AppColors.card.withValues(alpha: 0.94),
|
||||
foregroundColor: AppColors.onSurface,
|
||||
),
|
||||
icon: Icon(icon, size: 18),
|
||||
@@ -1179,7 +1179,7 @@ class _PlayerAction extends StatelessWidget {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Material(
|
||||
color: const Color(0xFF2A2A30),
|
||||
color: AppColors.card.withValues(alpha: 0.94),
|
||||
borderRadius: BorderRadius.circular(9),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: InkWell(
|
||||
|
||||
@@ -160,12 +160,7 @@ class HomeFeedOverlay extends StatelessWidget {
|
||||
radius: 14,
|
||||
blur: 6,
|
||||
padding: const EdgeInsets.all(12),
|
||||
gradient: const LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [Color(0xBF0F0F14), Color(0xA60F0F14)],
|
||||
),
|
||||
borderColor: Colors.white.withValues(alpha: 0.06),
|
||||
borderColor: AppColors.border,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
@@ -184,13 +179,13 @@ class HomeFeedOverlay extends StatelessWidget {
|
||||
if (drama.category.isNotEmpty && drama.category != genre)
|
||||
_tag(
|
||||
drama.category,
|
||||
background: const Color(0xFF333333),
|
||||
foreground: const Color(0xFFDDDDDD),
|
||||
background: AppColors.raised,
|
||||
foreground: AppColors.onSurface,
|
||||
),
|
||||
Text(
|
||||
l10n.episodeOfTotal(episode.number, drama.episodeCount),
|
||||
key: const Key('home-feed-episode'),
|
||||
style: const TextStyle(color: Color(0xFFBBBBBB), fontSize: 9),
|
||||
style: const TextStyle(color: AppColors.muted, fontSize: 9),
|
||||
),
|
||||
],
|
||||
),
|
||||
@@ -248,7 +243,7 @@ class HomeFeedOverlay extends StatelessWidget {
|
||||
key: const Key('home-feed-episodes'),
|
||||
onPressed: onEpisodes,
|
||||
style: FilledButton.styleFrom(
|
||||
backgroundColor: const Color(0xFF2A2A30),
|
||||
backgroundColor: AppColors.raised,
|
||||
foregroundColor: AppColors.onSurface,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius: BorderRadius.circular(
|
||||
@@ -362,7 +357,7 @@ class _RoundIcon extends StatelessWidget {
|
||||
onPressed: onPressed,
|
||||
padding: EdgeInsets.zero,
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: const Color(0xCC2C2D33),
|
||||
backgroundColor: AppColors.card.withValues(alpha: 0.94),
|
||||
foregroundColor: AppColors.onSurface,
|
||||
),
|
||||
icon: Icon(icon, size: 18),
|
||||
|
||||
@@ -4,7 +4,7 @@ import 'package:flutter/material.dart';
|
||||
|
||||
import '../../../core/theme/app_colors.dart';
|
||||
|
||||
/// Shared play/pause control used by the home feed and full-screen player.
|
||||
/// 首页沉浸流与全屏播放器共用的播放/暂停按钮。
|
||||
class PlayerCenterToggle extends StatelessWidget {
|
||||
const PlayerCenterToggle({
|
||||
super.key,
|
||||
@@ -26,7 +26,7 @@ class PlayerCenterToggle extends StatelessWidget {
|
||||
width: 52,
|
||||
height: 52,
|
||||
decoration: const BoxDecoration(
|
||||
color: Color(0x80000000),
|
||||
color: AppColors.blue,
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(
|
||||
|
||||
@@ -117,7 +117,7 @@ class _PlayerFeaturedCommentState extends State<PlayerFeaturedComment> {
|
||||
Text(
|
||||
'· $time',
|
||||
style: const TextStyle(
|
||||
color: Color(0xFF777777),
|
||||
color: AppColors.muted,
|
||||
fontSize: 9,
|
||||
),
|
||||
),
|
||||
@@ -133,7 +133,7 @@ class _PlayerFeaturedCommentState extends State<PlayerFeaturedComment> {
|
||||
maxLines: 2,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: const TextStyle(
|
||||
color: Color(0xFFDDDDDD),
|
||||
color: AppColors.onSurface,
|
||||
fontSize: 10,
|
||||
height: 1.5,
|
||||
),
|
||||
|
||||
@@ -127,10 +127,8 @@ class _SeekProgressBarState extends State<SeekProgressBar> {
|
||||
? (scrubbing ? 3 : 1.5)
|
||||
: (scrubbing ? 4 : 3),
|
||||
activeTrackColor: AppColors.blue,
|
||||
inactiveTrackColor: widget.compact
|
||||
? Colors.white.withValues(alpha: 0.18)
|
||||
: const Color(0xFF474248),
|
||||
thumbColor: widget.compact ? AppColors.blue : Colors.white,
|
||||
inactiveTrackColor: AppColors.border,
|
||||
thumbColor: AppColors.onPrimary,
|
||||
thumbShape: RoundSliderThumbShape(
|
||||
enabledThumbRadius: widget.compact
|
||||
? (scrubbing ? 6 : 4)
|
||||
|
||||
@@ -22,7 +22,7 @@ class SettingsPage extends StatelessWidget {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final auth = context.watch<AuthController>();
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('settings-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -56,7 +56,7 @@ class _StorePageState extends State<StorePage> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final isVip = widget.type == StoreController.vipType;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('store-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -44,7 +44,7 @@ class _WalletPageState extends State<WalletPage> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final wallet = context.watch<WalletController>();
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('wallet-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
@@ -188,7 +188,7 @@ class _BalanceHero extends StatelessWidget {
|
||||
gradient: const LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [Color(0xFF2B2116), Color(0xFF17171D)],
|
||||
colors: [AppColors.goldCard, AppColors.card],
|
||||
),
|
||||
border: Border.all(color: AppColors.gold.withValues(alpha: 0.35)),
|
||||
boxShadow: [
|
||||
|
||||
@@ -33,7 +33,7 @@ class WatchRecordsPage extends StatelessWidget {
|
||||
final signedIn = context.watch<AuthController>().isSignedIn;
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
return Theme(
|
||||
data: AppTheme.dark(),
|
||||
data: AppTheme.light(),
|
||||
child: Scaffold(
|
||||
key: const Key('watch-records-page'),
|
||||
backgroundColor: AppColors.ink,
|
||||
|
||||
@@ -207,7 +207,7 @@ Widget _host(Drama drama) {
|
||||
ChangeNotifierProvider(create: (_) => CatalogController(catalog)..load()),
|
||||
],
|
||||
child: MaterialApp(
|
||||
theme: AppTheme.dark(),
|
||||
theme: AppTheme.light(),
|
||||
locale: const Locale('en'),
|
||||
supportedLocales: AppLocalizations.supportedLocales,
|
||||
localizationsDelegates: AppLocalizations.localizationsDelegates,
|
||||
|
||||
@@ -12,7 +12,7 @@ void main() {
|
||||
var taps = 0;
|
||||
await _pump(
|
||||
tester,
|
||||
theme: AppTheme.dark(),
|
||||
theme: AppTheme.light(),
|
||||
child: EmptyState(
|
||||
icon: Icons.movie_outlined,
|
||||
title: 'No stories',
|
||||
@@ -33,7 +33,7 @@ void main() {
|
||||
);
|
||||
expect(
|
||||
tester.widget<Icon>(find.byKey(const Key('empty-state-icon'))).color,
|
||||
AppColors.gold,
|
||||
AppColors.blue,
|
||||
);
|
||||
expect(
|
||||
tester
|
||||
@@ -103,15 +103,15 @@ void main() {
|
||||
expect(find.byKey(const Key('empty-state-action')), findsNothing);
|
||||
});
|
||||
|
||||
testWidgets('should_tint_the_bare_icon_for_light_and_dark', (tester) async {
|
||||
testWidgets('should_tint_the_bare_icon_with_the_light_theme', (tester) async {
|
||||
await _pump(
|
||||
tester,
|
||||
theme: AppTheme.dark(),
|
||||
theme: AppTheme.light(),
|
||||
child: const EmptyState(icon: Icons.history_rounded, title: 'No history'),
|
||||
);
|
||||
expect(
|
||||
tester.widget<Icon>(find.byKey(const Key('empty-state-icon'))).color,
|
||||
AppColors.gold,
|
||||
AppColors.blue,
|
||||
);
|
||||
|
||||
await _pump(
|
||||
@@ -156,7 +156,7 @@ Future<void> _pump(
|
||||
}) async {
|
||||
await tester.pumpWidget(
|
||||
MaterialApp(
|
||||
theme: theme ?? AppTheme.dark(),
|
||||
theme: theme ?? AppTheme.light(),
|
||||
home: Scaffold(body: child),
|
||||
),
|
||||
);
|
||||
|
||||
@@ -2,13 +2,13 @@
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_test/flutter_test.dart';
|
||||
import 'package:fruitshorts/core/theme/app_colors.dart';
|
||||
import 'package:fruitshorts/core/theme/app_dimens.dart';
|
||||
import 'package:fruitshorts/core/widgets/app_bottom_nav.dart';
|
||||
|
||||
void main() {
|
||||
testWidgets('should_render_64_high_navigation_and_keep_item_keys', (
|
||||
tester,
|
||||
) async {
|
||||
testWidgets('should_render_five_slots_with_center_action', (tester) async {
|
||||
var centerTaps = 0;
|
||||
await tester.pumpWidget(
|
||||
MaterialApp(
|
||||
home: Scaffold(
|
||||
@@ -23,24 +23,74 @@ void main() {
|
||||
onTap: () {},
|
||||
),
|
||||
AppBottomNavItem(
|
||||
tabKey: const Key('tab-my'),
|
||||
tabKey: const Key('tab-theater'),
|
||||
icon: Icons.explore_outlined,
|
||||
selectedIcon: Icons.explore_rounded,
|
||||
label: 'Theater',
|
||||
onTap: () {},
|
||||
),
|
||||
AppBottomNavItem(
|
||||
tabKey: const Key('tab-create'),
|
||||
icon: Icons.add_box_outlined,
|
||||
selectedIcon: Icons.add_box_rounded,
|
||||
label: 'Create',
|
||||
onTap: () {},
|
||||
),
|
||||
AppBottomNavItem(
|
||||
tabKey: const Key('tab-mine'),
|
||||
icon: Icons.person_outline_rounded,
|
||||
selectedIcon: Icons.person_rounded,
|
||||
label: 'Me',
|
||||
onTap: () {},
|
||||
),
|
||||
],
|
||||
centerAction: AppBottomNavCenterAction(
|
||||
label: 'Create',
|
||||
onTap: () => centerTaps++,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
expect(find.byKey(const Key('tab-home')), findsOneWidget);
|
||||
expect(find.byKey(const Key('tab-my')), findsOneWidget);
|
||||
expect(find.byKey(const Key('tab-theater')), findsOneWidget);
|
||||
expect(find.byKey(const Key('nav-center-action')), findsOneWidget);
|
||||
expect(find.byKey(const Key('tab-create')), findsOneWidget);
|
||||
expect(find.byKey(const Key('tab-mine')), findsOneWidget);
|
||||
expect(find.text('Home'), findsOneWidget);
|
||||
final centers = [
|
||||
Key('tab-home'),
|
||||
Key('tab-theater'),
|
||||
Key('nav-center-action'),
|
||||
Key('tab-create'),
|
||||
Key('tab-mine'),
|
||||
].map((key) => tester.getCenter(find.byKey(key)).dx).toList();
|
||||
expect(centers, orderedEquals(centers.toList()..sort()));
|
||||
expect(
|
||||
tester.getSize(find.byType(AppBottomNav)).height,
|
||||
AppDimens.navHeight,
|
||||
);
|
||||
expect(
|
||||
tester.getSize(find.byKey(const Key('nav-center-action'))),
|
||||
const Size.square(AppDimens.navCenter),
|
||||
);
|
||||
final ink = tester.widget<Ink>(
|
||||
find
|
||||
.ancestor(
|
||||
of: find.byKey(const Key('nav-center-action')),
|
||||
matching: find.byType(Ink),
|
||||
)
|
||||
.first,
|
||||
);
|
||||
final decoration = ink.decoration! as BoxDecoration;
|
||||
expect(decoration.shape, BoxShape.circle);
|
||||
expect((decoration.gradient! as LinearGradient).colors, const [
|
||||
AppColors.navCenterStart,
|
||||
AppColors.navCenterEnd,
|
||||
]);
|
||||
|
||||
await tester.tap(find.byKey(const Key('nav-center-action')));
|
||||
expect(centerTaps, 1);
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,69 @@
|
||||
// Author: fruit.com.cn
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_test/flutter_test.dart';
|
||||
import 'package:fruitshorts/core/data/models/drama.dart';
|
||||
import 'package:fruitshorts/core/theme/app_colors.dart';
|
||||
import 'package:fruitshorts/core/theme/app_dimens.dart';
|
||||
import 'package:fruitshorts/core/theme/app_theme.dart';
|
||||
import 'package:fruitshorts/l10n/app_localizations.dart';
|
||||
import 'package:fruitshorts/pages/home/widgets/home_drama_grid.dart';
|
||||
|
||||
void main() {
|
||||
testWidgets('should_render_warm_orange_cover_badges_and_plus_action', (
|
||||
tester,
|
||||
) async {
|
||||
await tester.pumpWidget(
|
||||
MaterialApp(
|
||||
theme: AppTheme.light(),
|
||||
locale: const Locale('en'),
|
||||
supportedLocales: AppLocalizations.supportedLocales,
|
||||
localizationsDelegates: AppLocalizations.localizationsDelegates,
|
||||
home: Scaffold(
|
||||
body: Builder(
|
||||
builder: (context) => SizedBox(
|
||||
width: 180,
|
||||
child: HomeDramaCard(
|
||||
l10n: AppLocalizations.of(context)!,
|
||||
drama: _drama,
|
||||
onTap: () {},
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
await tester.pumpAndSettle();
|
||||
|
||||
final card = find.byKey(const Key('home-drama-card-style-drama'));
|
||||
final cardContainer = tester.widget<Container>(
|
||||
find.ancestor(of: card, matching: find.byType(Container)).last,
|
||||
);
|
||||
final cardDecoration = cardContainer.decoration! as BoxDecoration;
|
||||
expect(cardDecoration.color, AppColors.card);
|
||||
expect(
|
||||
cardDecoration.borderRadius,
|
||||
BorderRadius.circular(AppDimens.cardRadius),
|
||||
);
|
||||
expect(cardDecoration.boxShadow, const [AppTheme.cardShadow]);
|
||||
|
||||
final tag = tester.widget<Container>(
|
||||
find.byKey(const Key('home-drama-tag-style-drama')),
|
||||
);
|
||||
expect((tag.decoration! as BoxDecoration).color, AppColors.badgePink);
|
||||
expect(find.text('Free'), findsOneWidget);
|
||||
expect(find.text('18 locked'), findsOneWidget);
|
||||
expect(find.text('All 24'), findsOneWidget);
|
||||
expect(find.byKey(const Key('home-drama-add-style-drama')), findsOneWidget);
|
||||
});
|
||||
}
|
||||
|
||||
const _drama = Drama(
|
||||
id: 'style-drama',
|
||||
title: 'Warm Orange Story',
|
||||
synopsis: '暖橙短剧',
|
||||
posterUrl: '/files/style.jpg',
|
||||
genre: 'Romance',
|
||||
totalEpisodes: 24,
|
||||
freeEpisodes: 6,
|
||||
);
|
||||
@@ -20,6 +20,7 @@ const _keys = [
|
||||
Key('home-tabs-bar'),
|
||||
Key('tab-home'),
|
||||
Key('tab-theater'),
|
||||
Key('nav-center-action'),
|
||||
Key('tab-create'),
|
||||
Key('tab-mine'),
|
||||
];
|
||||
@@ -53,7 +54,7 @@ void main() {
|
||||
final decoration = bar.decoration as BoxDecoration;
|
||||
final border = decoration.border as Border;
|
||||
expect(decoration.color, AppColors.bar.withValues(alpha: 0.95));
|
||||
expect(border.top.color, AppColors.outlineVariantDark);
|
||||
expect(border.top.color, AppColors.border);
|
||||
expect(border.top.color, isNot(Colors.white));
|
||||
expect(
|
||||
tester
|
||||
@@ -73,6 +74,17 @@ void main() {
|
||||
),
|
||||
findsOneWidget,
|
||||
);
|
||||
expect(
|
||||
tester
|
||||
.widget<Icon>(
|
||||
find.descendant(
|
||||
of: find.byKey(const Key('tab-home')),
|
||||
matching: find.byIcon(Icons.home_rounded),
|
||||
),
|
||||
)
|
||||
.color,
|
||||
AppColors.blue,
|
||||
);
|
||||
|
||||
await tester.tap(find.byKey(const Key('tab-theater')));
|
||||
await tester.pumpAndSettle();
|
||||
@@ -87,6 +99,30 @@ void main() {
|
||||
),
|
||||
findsOneWidget,
|
||||
);
|
||||
expect(
|
||||
tester
|
||||
.widget<Text>(
|
||||
find.descendant(
|
||||
of: find.byKey(const Key('tab-theater')),
|
||||
matching: find.text('Theater'),
|
||||
),
|
||||
)
|
||||
.style
|
||||
?.color,
|
||||
AppColors.blue,
|
||||
);
|
||||
expect(
|
||||
tester
|
||||
.widget<Text>(
|
||||
find.descendant(
|
||||
of: find.byKey(const Key('tab-home')),
|
||||
matching: find.text('Home'),
|
||||
),
|
||||
)
|
||||
.style
|
||||
?.color,
|
||||
AppColors.navUnselected,
|
||||
);
|
||||
expect(
|
||||
find.descendant(
|
||||
of: find.byKey(const Key('tab-home')),
|
||||
@@ -103,6 +139,7 @@ void main() {
|
||||
|
||||
expect(find.byKey(const Key('tab-home')), findsOneWidget);
|
||||
expect(find.byKey(const Key('tab-theater')), findsOneWidget);
|
||||
expect(find.byKey(const Key('nav-center-action')), findsOneWidget);
|
||||
expect(find.byKey(const Key('tab-create')), findsOneWidget);
|
||||
expect(find.byKey(const Key('tab-mine')), findsOneWidget);
|
||||
expect(find.byKey(const Key('home-browse-page')), findsOneWidget);
|
||||
@@ -111,6 +148,12 @@ void main() {
|
||||
await tester.pumpAndSettle();
|
||||
expect(find.byKey(const Key('home-all-dramas-grid')), findsOneWidget);
|
||||
|
||||
await tester.tap(find.byKey(const Key('nav-center-action')));
|
||||
await tester.pumpAndSettle();
|
||||
expect(find.byKey(const Key('create-page')), findsOneWidget);
|
||||
|
||||
await tester.tap(find.byKey(const Key('tab-home')));
|
||||
await tester.pumpAndSettle();
|
||||
await tester.tap(find.byKey(const Key('tab-create')));
|
||||
await tester.pumpAndSettle();
|
||||
expect(find.byKey(const Key('create-page')), findsOneWidget);
|
||||
|
||||
@@ -82,7 +82,7 @@ void main() {
|
||||
Future<void> pumpEpisode(Episode episode) async {
|
||||
await tester.pumpWidget(
|
||||
MaterialApp(
|
||||
theme: AppTheme.dark(),
|
||||
theme: AppTheme.light(),
|
||||
locale: const Locale('en'),
|
||||
supportedLocales: AppLocalizations.supportedLocales,
|
||||
localizationsDelegates: AppLocalizations.localizationsDelegates,
|
||||
@@ -141,7 +141,7 @@ void main() {
|
||||
) async {
|
||||
await tester.pumpWidget(
|
||||
MaterialApp(
|
||||
theme: AppTheme.dark(),
|
||||
theme: AppTheme.light(),
|
||||
locale: const Locale('en'),
|
||||
supportedLocales: AppLocalizations.supportedLocales,
|
||||
localizationsDelegates: AppLocalizations.localizationsDelegates,
|
||||
|
||||
@@ -8,6 +8,7 @@ import 'package:fruitshorts/core/data/models/watch_progress.dart';
|
||||
import 'package:fruitshorts/core/data/repositories/favorite_repository.dart';
|
||||
import 'package:fruitshorts/core/data/repositories/playback_repository.dart';
|
||||
import 'package:fruitshorts/core/data/repositories/watch_history_repository.dart';
|
||||
import 'package:fruitshorts/core/theme/app_colors.dart';
|
||||
import 'package:fruitshorts/pages/player/player_view.dart';
|
||||
import 'package:shared_preferences_platform_interface/in_memory_shared_preferences_async.dart';
|
||||
import 'package:shared_preferences_platform_interface/shared_preferences_async_platform_interface.dart';
|
||||
@@ -32,8 +33,9 @@ void main() {
|
||||
for (final key in _tabKeys) {
|
||||
expect(find.byKey(key), findsOneWidget);
|
||||
}
|
||||
expect(find.byKey(const Key('nav-center-action')), findsOneWidget);
|
||||
|
||||
await tester.tap(find.byKey(const Key('tab-create')));
|
||||
await tester.tap(find.byKey(const Key('nav-center-action')));
|
||||
await tester.pumpAndSettle();
|
||||
|
||||
expect(find.byKey(const Key('create-page')), findsOneWidget);
|
||||
@@ -46,12 +48,22 @@ void main() {
|
||||
|
||||
expect(_chip(tester, 'home-channel-hot').selected, isTrue);
|
||||
expect(_chip(tester, 'home-channel-free').selected, isFalse);
|
||||
expect(_chip(tester, 'home-channel-hot').selectedColor, AppColors.blue);
|
||||
expect(_chip(tester, 'home-channel-free').backgroundColor, AppColors.card);
|
||||
expect(
|
||||
_chip(tester, 'home-channel-free').labelStyle?.color,
|
||||
AppColors.onSurface,
|
||||
);
|
||||
|
||||
await tester.tap(find.byKey(const Key('home-channel-free')));
|
||||
await tester.pumpAndSettle();
|
||||
|
||||
expect(_chip(tester, 'home-channel-hot').selected, isFalse);
|
||||
expect(_chip(tester, 'home-channel-free').selected, isTrue);
|
||||
expect(
|
||||
_chip(tester, 'home-channel-free').labelStyle?.color,
|
||||
AppColors.onPrimary,
|
||||
);
|
||||
});
|
||||
|
||||
testWidgets('should_open_theater_search_when_home_search_is_tapped', (
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_test/flutter_test.dart';
|
||||
import 'package:fruitshorts/core/theme/app_colors.dart';
|
||||
import 'package:fruitshorts/pages/player/widgets/player_center_toggle.dart';
|
||||
|
||||
void main() {
|
||||
@@ -36,7 +37,7 @@ void main() {
|
||||
find.descendant(of: find.byKey(key), matching: find.byType(Container)),
|
||||
);
|
||||
final decoration = container.decoration! as BoxDecoration;
|
||||
expect(decoration.color, const Color(0x80000000));
|
||||
expect(decoration.color, AppColors.blue);
|
||||
expect(decoration.shape, BoxShape.circle);
|
||||
final icon = tester.widget<Icon>(
|
||||
find.descendant(of: find.byKey(key), matching: find.byType(Icon)),
|
||||
|
||||
@@ -6,18 +6,22 @@ import 'package:fruitshorts/core/theme/app_dimens.dart';
|
||||
void main() {
|
||||
test('should_expose_the_k20_spacing_and_type_scale', () {
|
||||
expect(AppDimens.pageHorizontal, 16);
|
||||
expect(AppDimens.cardRadius, 12);
|
||||
expect(AppDimens.innerRadius, 10);
|
||||
expect(AppDimens.cardRadius, 16);
|
||||
expect(AppDimens.coverRadius, 16);
|
||||
expect(AppDimens.authCardRadius, 20);
|
||||
expect(AppDimens.pillRadius, 999);
|
||||
expect(AppDimens.buttonRadius, 999);
|
||||
expect(AppDimens.caption, 12);
|
||||
expect(AppDimens.body, 14);
|
||||
expect(AppDimens.listTitle, 15);
|
||||
expect(AppDimens.sectionTitle, 16);
|
||||
expect(AppDimens.pageTitle, 20);
|
||||
expect(AppDimens.navLabel, 9);
|
||||
expect(AppDimens.navLabel, 10);
|
||||
expect(AppDimens.buttonHeight, 48);
|
||||
expect(AppDimens.primaryButtonHeight, 52);
|
||||
expect(AppDimens.tapTarget, 44);
|
||||
expect(AppDimens.navHeight, 54);
|
||||
expect(AppDimens.navHeight, 64);
|
||||
expect(AppDimens.navCenter, 56);
|
||||
expect(AppDimens.progressHeight, 3);
|
||||
});
|
||||
}
|
||||
@@ -2,7 +2,7 @@
|
||||
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:flutter_test/flutter_test.dart';
|
||||
import 'package:fruitshorts/core/theme/app_colors.dart';
|
||||
import 'package:fruitshorts/core/theme/app_theme.dart';
|
||||
@@ -14,71 +14,46 @@ double _contrast(Color foreground, Color background) {
|
||||
}
|
||||
|
||||
void main() {
|
||||
test('should_expose_obsidian_flare_brand_tokens', () {
|
||||
expect(AppColors.blue, const Color(0xFFFF5B3D));
|
||||
expect(AppColors.bluePressed, const Color(0xFFFF4321));
|
||||
expect(AppColors.blueSoft, const Color(0xFF9278EA));
|
||||
expect(AppColors.secondary, const Color(0xFF9278EA));
|
||||
expect(AppColors.gold, const Color(0xFFFBBF24));
|
||||
expect(AppColors.ink, const Color(0xFF0B0C10));
|
||||
expect(AppColors.card, const Color(0xFF1B1C21));
|
||||
expect(AppColors.cardAlt, const Color(0xFF1C1D21));
|
||||
expect(AppColors.raised, const Color(0xFF1C1D21));
|
||||
expect(AppColors.bar, const Color(0xFF0D0D11));
|
||||
expect(AppColors.success, const Color(0xFF34D399));
|
||||
expect(AppColors.onPrimary, const Color(0xFFFFFFFF));
|
||||
test('should_expose_light_warm_orange_tokens', () {
|
||||
expect(AppColors.blue, const Color(0xFFFF7A1A));
|
||||
expect(AppColors.bluePressed, const Color(0xFFFF6A00));
|
||||
expect(AppColors.secondary, const Color(0xFFFF6A8A));
|
||||
expect(AppColors.ink, const Color(0xFFFFF8F0));
|
||||
expect(AppColors.surfaceTop, const Color(0xFFFFE9D6));
|
||||
expect(AppColors.card, const Color(0xFFFFFFFF));
|
||||
expect(AppColors.onSurface, const Color(0xFF1F1B16));
|
||||
expect(AppColors.muted, const Color(0xFF8C837B));
|
||||
expect(AppColors.subtle, const Color(0xFFB3AAA1));
|
||||
expect(AppColors.border, const Color(0xFFF0E4D6));
|
||||
expect(AppColors.badgePink, const Color(0xFFFFE3EC));
|
||||
expect(AppColors.badgePinkText, const Color(0xFFFF6A8A));
|
||||
});
|
||||
|
||||
test('should_keep_primary_text_readable_on_warm_background', () {
|
||||
expect(
|
||||
_contrast(AppColors.onGold, AppColors.gold),
|
||||
_contrast(AppColors.onSurface, AppColors.ink),
|
||||
greaterThanOrEqualTo(4.5),
|
||||
);
|
||||
expect(_contrast(AppColors.muted, AppColors.card), greaterThanOrEqualTo(3));
|
||||
});
|
||||
|
||||
test('should_meet_text_and_icon_contrast_when_using_theme_tokens', () {
|
||||
expect(
|
||||
_contrast(AppColors.onPrimary, AppColors.blue),
|
||||
greaterThanOrEqualTo(3),
|
||||
);
|
||||
expect(_contrast(AppColors.blue, Colors.white), greaterThanOrEqualTo(3));
|
||||
expect(
|
||||
_contrast(AppColors.blueSoft, AppColors.ink),
|
||||
greaterThanOrEqualTo(3),
|
||||
);
|
||||
test('should_use_light_color_scheme_and_dark_system_icons', () {
|
||||
final theme = AppTheme.light();
|
||||
|
||||
expect(theme.brightness, Brightness.light);
|
||||
expect(theme.colorScheme.primary, AppColors.blue);
|
||||
expect(theme.colorScheme.onPrimary, AppColors.onPrimary);
|
||||
expect(theme.colorScheme.surface, AppColors.ink);
|
||||
expect(theme.colorScheme.onSurface, AppColors.onSurface);
|
||||
expect(theme.colorScheme.outline, AppColors.border);
|
||||
expect(theme.scaffoldBackgroundColor, AppColors.ink);
|
||||
expect(theme.appBarTheme.systemOverlayStyle, SystemUiOverlayStyle.dark);
|
||||
});
|
||||
|
||||
test('should_use_flare_brand_in_light_and_dark_color_schemes', () {
|
||||
for (final theme in [AppTheme.light(), AppTheme.dark()]) {
|
||||
expect(theme.colorScheme.primary, AppColors.blue);
|
||||
expect(theme.colorScheme.onPrimary, AppColors.onPrimary);
|
||||
}
|
||||
});
|
||||
|
||||
test('should_define_non_white_outline_tokens_in_both_themes', () {
|
||||
final light = AppTheme.light().colorScheme;
|
||||
final dark = AppTheme.dark().colorScheme;
|
||||
|
||||
expect(light.outline, AppColors.outlineLight);
|
||||
expect(light.outlineVariant, AppColors.outlineVariantLight);
|
||||
expect(dark.outline, AppColors.outlineDark);
|
||||
expect(dark.outlineVariant, AppColors.outlineVariantDark);
|
||||
expect(dark.outlineVariant.computeLuminance(), lessThan(0.2));
|
||||
expect(light.outlineVariant.computeLuminance(), lessThan(0.92));
|
||||
});
|
||||
|
||||
testWidgets('should_expose_chili_brand_through_widget_theme', (tester) async {
|
||||
late ThemeData applied;
|
||||
await tester.pumpWidget(
|
||||
MaterialApp(
|
||||
theme: AppTheme.dark(),
|
||||
home: Builder(
|
||||
builder: (context) {
|
||||
applied = Theme.of(context);
|
||||
return const SizedBox.shrink();
|
||||
},
|
||||
),
|
||||
),
|
||||
);
|
||||
|
||||
expect(applied.colorScheme.primary, AppColors.blue);
|
||||
expect(applied.colorScheme.onPrimary, AppColors.onPrimary);
|
||||
test('should_expose_page_gradient_and_soft_card_shadow', () {
|
||||
expect(AppTheme.pageGradient.colors, [AppColors.surfaceTop, AppColors.ink]);
|
||||
expect(AppTheme.cardShadow.color, AppColors.cardShadow);
|
||||
expect(AppTheme.cardShadow.blurRadius, 18);
|
||||
expect(AppTheme.cardShadow.offset, const Offset(0, 6));
|
||||
});
|
||||
}
|
||||
Reference in new issue
Block a user