sion/monisuo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(theme): 修复组件主题硬编码问题

Browse Source 
- asset_card: Colors.white/black → colorScheme
- gradient_button: Colors.white → onPrimary
- trade_button: Colors.white → onPrimary
- 支持亮/暗主题动态切换
This commit is contained in:
sion
2026-03-24 08:45:54 +08:00
parent 13841b1958
commit b4eeb61aa1
3 changed files with 34 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
flutter_monisuo/lib/ui/components/asset_card.dart
View File

@@ -52,9 +52,14 @@ class AssetCard extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = ShadTheme.of(context);
final colorScheme = Theme.of(context).colorScheme;
final isDark = Theme.of(context).brightness == Brightness.dark;
final cardGradient = gradient ?? defaultGradientBuilder(isDark);
// 主题感知颜色 - 在渐变背景上使用 onPrimary
final primaryTextColor = colorScheme.onPrimary;
final secondaryTextColor = colorScheme.onPrimary.withValues(alpha: 0.7);
return GestureDetector(
onTap: onTap,
child: Container(
@@ -65,7 +70,7 @@ class AssetCard extends StatelessWidget {
borderRadius: BorderRadius.circular(AppRadius.xl),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.1),
color: colorScheme.onSurface.withValues(alpha: 0.1),
blurRadius: 10,
offset: const Offset(0, 4),
),
@@ -79,13 +84,13 @@ class AssetCard extends StatelessWidget {
children: [
Text(
title,
style: theme.textTheme.small.copyWith(color: Colors.white70),
style: theme.textTheme.small.copyWith(color: secondaryTextColor),
),
const Spacer(),
if (onTap != null)
const Icon(
Icon(
LucideIcons.chevronRight,
color: Colors.white70,
color: secondaryTextColor,
size: 18,
),
],
@@ -96,7 +101,7 @@ class AssetCard extends StatelessWidget {
balance,
style: theme.textTheme.h1.copyWith(
fontWeight: FontWeight.bold,
color: Colors.white,
color: primaryTextColor,
fontSize: 32,
),
),
@@ -107,13 +112,13 @@ class AssetCard extends StatelessWidget {
children: [
Icon(
isProfit == true ? LucideIcons.trendingUp : LucideIcons.trendingDown,
color: Colors.white70,
color: secondaryTextColor,
size: 16,
),
const SizedBox(width: 6),
Text(
'盈亏: $profit',
style: theme.textTheme.small.copyWith(color: Colors.white70),
style: theme.textTheme.small.copyWith(color: secondaryTextColor),
),
],
),
@@ -123,7 +128,7 @@ class AssetCard extends StatelessWidget {
const SizedBox(height: AppSpacing.lg),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: items!.map((item) => _buildItem(item)).toList(),
children: items!.map((item) => _buildItem(item, primaryTextColor, secondaryTextColor)).toList(),
),
],
],
@@ -132,21 +137,21 @@ class AssetCard extends StatelessWidget {
).animate().fadeIn(duration: 400.ms).slideY(begin: 0.1, end: 0);
}
Widget _buildItem(AssetItem item) {
Widget _buildItem(AssetItem item, Color primaryTextColor, Color secondaryTextColor) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item.label,
style: const TextStyle(fontSize: 12, color: Colors.white70),
style: TextStyle(fontSize: 12, color: secondaryTextColor),
),
const SizedBox(height: 4),
Text(
item.value,
style: const TextStyle(
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w600,
color: Colors.white,
color: primaryTextColor,
),
),
],

13
flutter_monisuo/lib/ui/components/gradient_button.dart
View File

@@ -96,6 +96,9 @@ class GradientButton extends StatelessWidget {
final buttonGradient = gradient ??
(isDark ? AppColorScheme.darkCtaGradient : AppColorScheme.lightCtaGradient);
// 主题感知颜色 - 在渐变背景上使用 onPrimary
final textColor = colorScheme.onPrimary;
return Container(
width: isFullWidth ? double.infinity : null,
height: height,
@@ -114,23 +117,23 @@ class GradientButton extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (isLoading)
const SizedBox(
SizedBox(
width: 20,
height: 20,
child: CircularProgressIndicator(
strokeWidth: 2,
color: Colors.white,
color: textColor,
),
)
else ...[
if (icon != null) ...[
Icon(icon, size: 18, color: Colors.white),
Icon(icon, size: 18, color: textColor),
SizedBox(width: AppSpacing.sm),
],
Text(
text,
style: const TextStyle(
color: Colors.white,
style: TextStyle(
color: textColor,
fontSize: 16,
fontWeight: FontWeight.w600,
),

14
flutter_monisuo/lib/ui/components/trade_button.dart
View File

@@ -45,11 +45,15 @@ class TradeButton extends StatelessWidget {
@override
Widget build(BuildContext context) {
final colorScheme = Theme.of(context).colorScheme;
final gradient = isBuy ? AppColorScheme.buyGradient : AppColorScheme.sellGradient;
final text = isBuy
? '买入${coinCode != null ? ' $coinCode' : ''}'
: '卖出${coinCode != null ? ' $coinCode' : ''}';
// 主题感知颜色 - 在渐变背景上使用 onPrimary
final textColor = colorScheme.onPrimary;
return Container(
width: fullWidth ? double.infinity : null,
height: 48,
@@ -68,24 +72,24 @@ class TradeButton extends StatelessWidget {
mainAxisAlignment: MainAxisAlignment.center,
children: [
if (isLoading)
const SizedBox.square(
SizedBox.square(
dimension: 16,
child: CircularProgressIndicator(
strokeWidth: 2,
color: Colors.white,
color: textColor,
),
)
else
Icon(
isBuy ? Icons.arrow_downward_rounded : Icons.arrow_upward_rounded,
size: 18,
color: Colors.white,
color: textColor,
),
const SizedBox(width: 8),
Text(
text,
style: const TextStyle(
color: Colors.white,
style: TextStyle(
color: textColor,
fontSize: 16,
fontWeight: FontWeight.w600,
),