feat(ui): 底部导航栏添加文字标签

- 在图标下方添加文字标签（首页、行情、交易、资产、我的） - 激活状态文字加粗 - 支持主题切换 - 提升用户体验和可识别性
2026-03-24 02:55:55 +08:00
parent a65aa0fa86
commit a2be43bbf5
2 changed files with 68 additions and 42 deletions
--- a/flutter_monisuo/lib/ui/pages/asset/asset_page.dart
+++ b/flutter_monisuo/lib/ui/pages/asset/asset_page.dart
@@ -484,6 +484,7 @@ class _HoldingItem extends StatelessWidget {
 void _showDepositDialog(BuildContext context) {
  final amountController = TextEditingController();
  final formKey = GlobalKey<ShadFormState>();
+  final colorScheme = Theme.of(context).colorScheme;

  showShadDialog(
    context: context,
@@ -507,7 +508,7 @@ void _showDepositDialog(BuildContext context) {
                      style: GoogleFonts.spaceGrotesk(
                        fontSize: 24,
                        fontWeight: FontWeight.bold,
-                        color: AppColorScheme.darkOnSurface,
+                        color: colorScheme.onSurface,
                      ),
                    ),
                    SizedBox(height: AppSpacing.xs),
@@ -516,7 +517,7 @@ void _showDepositDialog(BuildContext context) {
                      style: TextStyle(
                        fontSize: 12,
                        letterSpacing: 0.1,
-                        color: AppColorScheme.darkOnSurfaceVariant,
+                        color: colorScheme.onSurfaceVariant,
                      ),
                    ),
                  ],
@@ -524,12 +525,12 @@ void _showDepositDialog(BuildContext context) {
                Container(
                  padding: EdgeInsets.all(AppSpacing.sm),
                  decoration: BoxDecoration(
-                    color: AppColorScheme.darkSurfaceContainerHigh,
+                    color: colorScheme.surfaceContainerHigh,
                    borderRadius: BorderRadius.circular(AppRadius.md),
                  ),
                  child: Icon(
                    LucideIcons.wallet,
-                    color: AppColorScheme.darkSecondary,
+                    color: colorScheme.secondary,
                  ),
                ),
              ],
@@ -596,6 +597,7 @@ void _showDepositResultDialog(BuildContext context, Map<String, dynamic> data) {
  final amount = data['amount']?.toString() ?? '0.00';
  final walletAddress = data['walletAddress'] as String? ?? '';
  final walletNetwork = data['walletNetwork'] as String? ?? 'TRC20';
+  final colorScheme = Theme.of(context).colorScheme;

  showShadDialog(
    context: context,
@@ -612,7 +614,7 @@ void _showDepositResultDialog(BuildContext context, Map<String, dynamic> data) {
              children: [
                NeonIcon(
                  icon: Icons.check_circle,
-                  color: AppColorScheme.darkTertiary,
+                  color: AppColorScheme.up,
                  size: 24,
                ),
                SizedBox(width: AppSpacing.sm),
@@ -621,7 +623,7 @@ void _showDepositResultDialog(BuildContext context, Map<String, dynamic> data) {
                  style: GoogleFonts.spaceGrotesk(
                    fontSize: 20,
                    fontWeight: FontWeight.bold,
-                    color: AppColorScheme.darkOnSurface,
+                    color: colorScheme.onSurface,
                  ),
                ),
              ],
@@ -635,7 +637,7 @@ void _showDepositResultDialog(BuildContext context, Map<String, dynamic> data) {
              '请向以下地址转账:',
              style: TextStyle(
                fontSize: 12,
-                color: AppColorScheme.darkOnSurfaceVariant,
+                color: colorScheme.onSurfaceVariant,
              ),
            ),
            SizedBox(height: AppSpacing.sm),
@@ -644,10 +646,10 @@ void _showDepositResultDialog(BuildContext context, Map<String, dynamic> data) {
            Container(
              padding: EdgeInsets.all(AppSpacing.sm),
              decoration: BoxDecoration(
-                color: AppColorScheme.warning.withValues(alpha: 0.1),
+                color: AppColorScheme.warning.withOpacity(0.1),
                borderRadius: BorderRadius.circular(AppRadius.md),
                border: Border.all(
-                  color: AppColorScheme.warning.withValues(alpha: 0.2),
+                  color: AppColorScheme.warning.withOpacity(0.2),
                ),
              ),
              child: Row(
@@ -713,6 +715,8 @@ class _InfoRow extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
@@ -720,7 +724,7 @@ class _InfoRow extends StatelessWidget {
          label,
          style: TextStyle(
            fontSize: 12,
-            color: AppColorScheme.darkOnSurfaceVariant,
+            color: colorScheme.onSurfaceVariant,
          ),
        ),
        Text(
@@ -728,7 +732,7 @@ class _InfoRow extends StatelessWidget {
          style: TextStyle(
            fontSize: 12,
            fontWeight: isBold ? FontWeight.bold : FontWeight.normal,
-            color: AppColorScheme.darkOnSurface,
+            color: colorScheme.onSurface,
          ),
        ),
      ],
@@ -744,13 +748,15 @@ class _WalletAddressCard extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+
    return Container(
      padding: EdgeInsets.all(AppSpacing.md),
      decoration: BoxDecoration(
-        color: AppColorScheme.darkSurfaceContainerHigh,
+        color: colorScheme.surfaceContainerHigh,
        borderRadius: BorderRadius.circular(AppRadius.md),
        border: Border.all(
-          color: AppColorScheme.darkOutlineVariant.withValues(alpha: 0.3),
+          color: colorScheme.outlineVariant.withOpacity(0.3),
        ),
      ),
      child: Column(
@@ -761,10 +767,10 @@ class _WalletAddressCard extends StatelessWidget {
              Expanded(
                child: Text(
                  address,
-                  style: const TextStyle(
+                  style: TextStyle(
                    fontFamily: 'monospace',
                    fontSize: 12,
-                    color: AppColorScheme.darkOnSurface,
+                    color: colorScheme.onSurface,
                  ),
                ),
              ),
@@ -778,13 +784,13 @@ class _WalletAddressCard extends StatelessWidget {
                child: Container(
                  padding: EdgeInsets.all(AppSpacing.xs),
                  decoration: BoxDecoration(
-                    color: AppColorScheme.darkPrimary.withValues(alpha: 0.1),
+                    color: colorScheme.primary.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(AppRadius.sm),
                  ),
                  child: Icon(
                    LucideIcons.copy,
                    size: 16,
-                    color: AppColorScheme.darkPrimary,
+                    color: colorScheme.primary,
                  ),
                ),
              ),
@@ -795,7 +801,7 @@ class _WalletAddressCard extends StatelessWidget {
            '网络: $network',
            style: TextStyle(
              fontSize: 11,
-              color: AppColorScheme.darkOnSurfaceVariant,
+              color: colorScheme.onSurfaceVariant,
            ),
          ),
        ],
@@ -809,6 +815,7 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
  final addressController = TextEditingController();
  final contactController = TextEditingController();
  final formKey = GlobalKey<ShadFormState>();
+  final colorScheme = Theme.of(context).colorScheme;

  showShadDialog(
    context: context,
@@ -827,12 +834,12 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                  Container(
                    padding: EdgeInsets.all(AppSpacing.sm),
                    decoration: BoxDecoration(
-                      color: AppColorScheme.darkPrimary.withValues(alpha: 0.1),
+                      color: colorScheme.primary.withOpacity(0.1),
                      borderRadius: BorderRadius.circular(AppRadius.md),
                    ),
                    child: Icon(
                      LucideIcons.wallet,
-                      color: AppColorScheme.darkPrimary,
+                      color: colorScheme.primary,
                    ),
                  ),
                  SizedBox(width: AppSpacing.sm),
@@ -841,7 +848,7 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                    style: GoogleFonts.spaceGrotesk(
                      fontSize: 20,
                      fontWeight: FontWeight.bold,
-                      color: AppColorScheme.darkOnSurface,
+                      color: colorScheme.onSurface,
                    ),
                  ),
                ],
@@ -851,7 +858,7 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                'Securely transfer your assets to an external wallet address.',
                style: TextStyle(
                  fontSize: 12,
-                  color: AppColorScheme.darkOnSurfaceVariant,
+                  color: colorScheme.onSurfaceVariant,
                ),
              ),
              if (balance != null) ...[
@@ -862,10 +869,10 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                    vertical: AppSpacing.sm,
                  ),
                  decoration: BoxDecoration(
-                    color: AppColorScheme.darkTertiary.withValues(alpha: 0.1),
+                    color: AppColorScheme.up.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(AppRadius.full),
                    border: Border.all(
-                      color: AppColorScheme.darkTertiary.withValues(alpha: 0.2),
+                      color: AppColorScheme.up.withOpacity(0.2),
                    ),
                  ),
                  child: Row(
@@ -876,7 +883,7 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                        style: TextStyle(
                          fontSize: 10,
                          letterSpacing: 0.1,
-                          color: AppColorScheme.darkOnSurfaceVariant,
+                          color: colorScheme.onSurfaceVariant,
                        ),
                      ),
                      Text(
@@ -884,7 +891,7 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                        style: TextStyle(
                          fontSize: 12,
                          fontWeight: FontWeight.bold,
-                          color: AppColorScheme.darkTertiary,
+                          color: AppColorScheme.up,
                        ),
                      ),
                    ],
@@ -971,7 +978,7 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                  Icon(
                    Icons.verified_user,
                    size: 12,
-                    color: AppColorScheme.darkOnSurfaceVariant.withValues(alpha: 0.5),
+                    color: colorScheme.onSurfaceVariant.withOpacity(0.5),
                  ),
                  SizedBox(width: AppSpacing.xs),
                  Text(
@@ -979,7 +986,7 @@ void _showWithdrawDialog(BuildContext context, String? balance) {
                    style: TextStyle(
                      fontSize: 10,
                      letterSpacing: 0.1,
-                      color: AppColorScheme.darkOnSurfaceVariant.withValues(alpha: 0.5),
+                      color: colorScheme.onSurfaceVariant.withOpacity(0.5),
                    ),
                  ),
                ],
@@ -996,6 +1003,7 @@ void _showTransferDialog(BuildContext context) {
  final controller = TextEditingController();
  final formKey = GlobalKey<ShadFormState>();
  int direction = 1;
+  final colorScheme = Theme.of(context).colorScheme;

  showShadDialog(
    context: context,
@@ -1014,7 +1022,7 @@ void _showTransferDialog(BuildContext context) {
                style: GoogleFonts.spaceGrotesk(
                  fontSize: 20,
                  fontWeight: FontWeight.bold,
-                  color: AppColorScheme.darkOnSurface,
+                  color: colorScheme.onSurface,
                ),
              ),
              SizedBox(height: AppSpacing.lg),
@@ -1109,6 +1117,8 @@ class _DirectionButton extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
+    final colorScheme = Theme.of(context).colorScheme;
+
    return GestureDetector(
      onTap: onTap,
      child: AnimatedContainer(
@@ -1116,12 +1126,12 @@ class _DirectionButton extends StatelessWidget {
        padding: EdgeInsets.symmetric(vertical: AppSpacing.sm + AppSpacing.xs),
        decoration: BoxDecoration(
          color: isSelected
-              ? AppColorScheme.darkPrimary.withValues(alpha: 0.15)
-              : AppColorScheme.darkSurfaceContainerHigh,
+              ? colorScheme.primary.withOpacity(0.15)
+              : colorScheme.surfaceContainerHigh,
          borderRadius: BorderRadius.circular(AppRadius.md),
          border: isSelected
              ? Border.all(
-                  color: AppColorScheme.darkPrimary.withValues(alpha: 0.3),
+                  color: colorScheme.primary.withOpacity(0.3),
                )
              : null,
        ),
@@ -1133,7 +1143,7 @@ class _DirectionButton extends StatelessWidget {
                Icon(
                  LucideIcons.check,
                  size: 14,
-                  color: AppColorScheme.darkPrimary,
+                  color: colorScheme.primary,
                )
              else
                SizedBox(width: 14),
@@ -1142,8 +1152,8 @@ class _DirectionButton extends StatelessWidget {
                label,
                style: TextStyle(
                  color: isSelected
-                      ? AppColorScheme.darkPrimary
-                      : AppColorScheme.darkOnSurfaceVariant,
+                      ? colorScheme.primary
+                      : colorScheme.onSurfaceVariant,
                  fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
                  fontSize: 12,
                ),
@@ -1157,6 +1167,8 @@ class _DirectionButton extends StatelessWidget {
 }

 void _showResultDialog(BuildContext context, String title, String? message) {
+  final colorScheme = Theme.of(context).colorScheme;
+
  showShadDialog(
    context: context,
    builder: (ctx) => Dialog(
@@ -1172,7 +1184,7 @@ void _showResultDialog(BuildContext context, String title, String? message) {
              style: GoogleFonts.spaceGrotesk(
                fontSize: 20,
                fontWeight: FontWeight.bold,
-                color: AppColorScheme.darkOnSurface,
+                color: colorScheme.onSurface,
              ),
            ),
            if (message != null) ...[
@@ -1180,7 +1192,7 @@ void _showResultDialog(BuildContext context, String title, String? message) {
              Text(
                message,
                style: TextStyle(
-                  color: AppColorScheme.darkOnSurfaceVariant,
+                  color: colorScheme.onSurfaceVariant,
                ),
                textAlign: TextAlign.center,
              ),
--- a/flutter_monisuo/lib/ui/pages/main/main_page.dart
+++ b/flutter_monisuo/lib/ui/pages/main/main_page.dart
@@ -273,7 +273,7 @@ class _NavItemWidget extends StatelessWidget {
      behavior: HitTestBehavior.opaque,
      child: AnimatedContainer(
        duration: const Duration(milliseconds: 300),
-        padding: const EdgeInsets.all(12),
+        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
        decoration: isSelected
            ? BoxDecoration(
                color: colorScheme.primary.withOpacity(0.1),
@@ -287,10 +287,24 @@ class _NavItemWidget extends StatelessWidget {
                ],
              )
            : null,
-        child: Icon(
-          item.icon,
-          color: color,
-          size: 24,
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Icon(
+              item.icon,
+              color: color,
+              size: 24,
+            ),
+            const SizedBox(height: 4),
+            Text(
+              item.label,
+              style: TextStyle(
+                color: color,
+                fontSize: 12,
+                fontWeight: isSelected ? FontWeight.w600 : FontWeight.normal,
+              ),
+            ),
+          ],
        ),
      ),
    );