style(ui): 统一页面字号间距与状态样式

2026-10-19 10:21:28 +08:00
1 parent df5fbe5b08
commit c5bfd006fa
@@ -9,6 +9,7 @@ import '../../core/data/repositories/account_repository.dart';
 import '../../core/data/services/auth_controller.dart';
 import '../../core/formatting/localized_date_time.dart';
 import '../../core/theme/app_colors.dart';
+import '../../core/theme/app_dimens.dart';
 import '../../core/theme/app_theme.dart';
 import '../../core/widgets/auth_gate.dart';
 import '../../l10n/app_localizations.dart';
@@ -58,12 +59,15 @@ class _AccountDeactivatePageState extends State<AccountDeactivatePage> {
          foregroundColor: AppColors.onPrimary,
          title: Text(l10n.accountDeactivate),
        ),
-        body: canShow
-            ? ListenableBuilder(
-                listenable: _logic,
-                builder: (context, _) => _body(l10n),
-              )
-            : const AuthGatePanel(),
+        body: SafeArea(
+          top: false,
+          child: canShow
+              ? ListenableBuilder(
+                  listenable: _logic,
+                  builder: (context, _) => _body(l10n),
+                )
+              : const AuthGatePanel(),
+        ),
      ),
    );
  }
@@ -90,7 +94,7 @@ class _AccountDeactivatePageState extends State<AccountDeactivatePage> {
      padding: const EdgeInsets.all(16),
      decoration: BoxDecoration(
        color: errorColor.withValues(alpha: 0.10),
-        borderRadius: BorderRadius.circular(14),
+        borderRadius: BorderRadius.circular(AppDimens.cardRadius),
        border: Border.all(color: errorColor.withValues(alpha: 0.35)),
      ),
      child: Text(
@@ -105,7 +109,7 @@ class _AccountDeactivatePageState extends State<AccountDeactivatePage> {
    padding: const EdgeInsets.all(16),
    decoration: BoxDecoration(
      color: AppColors.card,
-      borderRadius: BorderRadius.circular(14),
+      borderRadius: BorderRadius.circular(AppDimens.cardRadius),
    ),
    child: Text(
      l10n.accountScheduledFor(
@@ -161,7 +165,10 @@ class _AccountDeactivatePageState extends State<AccountDeactivatePage> {

  Widget _errorText(String value) => Text(
    value,
-    style: TextStyle(color: Theme.of(context).colorScheme.error, fontSize: 12),
+    style: TextStyle(
+      color: Theme.of(context).colorScheme.error,
+      fontSize: AppDimens.caption,
+    ),
  );

  Future<void> _confirm() async {
@@ -11,6 +11,7 @@ import '../../core/data/services/auth_controller.dart';
 import '../../core/formatting/error_text.dart';
 import '../../core/formatting/localized_date_time.dart';
 import '../../core/theme/app_colors.dart';
+import '../../core/theme/app_dimens.dart';
 import '../../core/theme/app_theme.dart';
 import '../../core/widgets/auth_gate.dart';
 import '../../core/widgets/empty_state.dart';
@@ -58,12 +59,15 @@ class _AccountDevicesPageState extends State<AccountDevicesPage> {
          foregroundColor: AppColors.onPrimary,
          title: Text(l10n.accountDevices),
        ),
-        body: signedIn
-            ? ListenableBuilder(
-                listenable: _logic,
-                builder: (context, _) => _body(l10n),
-              )
-            : const AuthGatePanel(),
+        body: SafeArea(
+          top: false,
+          child: signedIn
+              ? ListenableBuilder(
+                  listenable: _logic,
+                  builder: (context, _) => _body(l10n),
+                )
+              : const AuthGatePanel(),
+        ),
      ),
    );
  }
@@ -109,10 +113,10 @@ class _DeviceTile extends StatelessWidget {
  Widget build(BuildContext context) {
    return Container(
      key: ValueKey('account-device-${device.id}'),
-      padding: const EdgeInsets.all(14),
+      padding: const EdgeInsets.all(AppDimens.cardPadding),
      decoration: BoxDecoration(
        color: AppColors.card,
-        borderRadius: BorderRadius.circular(14),
+        borderRadius: BorderRadius.circular(AppDimens.cardRadius),
        border: Border.all(color: AppColors.outlineVariantDark),
      ),
      child: Column(
@@ -131,7 +135,7 @@ class _DeviceTile extends StatelessWidget {
                      ? device.platform
                      : device.deviceModel,
                  style: const TextStyle(
-                    fontSize: 15,
+                    fontSize: AppDimens.listTitle,
                    fontWeight: FontWeight.w700,
                  ),
                ),
@@ -164,14 +168,17 @@ class _DeviceTile extends StatelessWidget {
        Expanded(
          child: Text(
            label,
-            style: const TextStyle(color: AppColors.muted, fontSize: 12),
+            style: const TextStyle(
+              color: AppColors.muted,
+              fontSize: AppDimens.caption,
+            ),
          ),
        ),
        Flexible(
          child: Text(
            value.isEmpty ? '-' : value,
            textAlign: TextAlign.right,
-            style: const TextStyle(fontSize: 12),
+            style: const TextStyle(fontSize: AppDimens.caption),
          ),
        ),
      ],
@@ -188,20 +195,19 @@ class _StatusChip extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final active = status.toLowerCase() == 'active';
-    final scheme = Theme.of(context).colorScheme;
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 3),
      decoration: BoxDecoration(
        color: active
-            ? scheme.tertiary.withValues(alpha: 0.16)
+            ? AppColors.gold.withValues(alpha: 0.16)
            : AppColors.raised,
-        borderRadius: BorderRadius.circular(10),
+        borderRadius: BorderRadius.circular(AppDimens.pillRadius),
      ),
      child: Text(
        active ? l10n.accountDeviceActive : l10n.accountDeviceInactive,
        style: TextStyle(
-          color: active ? scheme.tertiary : AppColors.muted,
-          fontSize: 11,
+          color: active ? AppColors.gold : AppColors.muted,
+          fontSize: AppDimens.caption,
        ),
      ),
    );
@@ -3,13 +3,13 @@
 import 'package:flutter/material.dart';

 import '../../core/theme/app_colors.dart';
+import '../../core/theme/app_dimens.dart';
 import '../../l10n/app_localizations.dart';
 import 'account_deactivate_page.dart';
 import 'account_devices_page.dart';
 import 'account_export_page.dart';
 import 'account_profile_page.dart';

-const _accountCardHeight = 48.0;
 const _accountTitleWidth = 64.0;

 /// 我的页账号入口卡；只在登录态由父页面展示。
@@ -25,7 +25,7 @@ class AccountEntryCard extends StatelessWidget {
      borderRadius: BorderRadius.circular(16),
      clipBehavior: Clip.antiAlias,
      child: SizedBox(
-        height: _accountCardHeight,
+        height: AppDimens.accountCardHeight,
        child: Row(
          children: [
            SizedBox(
@@ -35,7 +35,7 @@ class AccountEntryCard extends StatelessWidget {
                child: Text(
                  l10n.accountCenter,
                  style: const TextStyle(
-                    fontSize: 12,
+                    fontSize: AppDimens.caption,
                    fontWeight: FontWeight.w800,
                  ),
                ),
@@ -109,14 +109,21 @@ class AccountEntryCard extends StatelessWidget {
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
-                  Icon(icon, color: AppColors.blueSoft, size: 16),
+                  Icon(
+                    icon,
+                    color: AppColors.blueSoft,
+                    size: AppDimens.accountIcon,
+                  ),
                  const SizedBox(height: 2),
                  Text(
                    title,
                    maxLines: 2,
                    overflow: TextOverflow.ellipsis,
                    textAlign: TextAlign.center,
-                    style: const TextStyle(fontSize: 9.5, height: 1.05),
+                    style: const TextStyle(
+                      fontSize: AppDimens.accountLabel,
+                      height: 1.15,
+                    ),
                  ),
                ],
              ),
@@ -11,6 +11,7 @@ import '../../core/data/repositories/account_repository.dart';
 import '../../core/data/services/auth_controller.dart';
 import '../../core/formatting/error_text.dart';
 import '../../core/theme/app_colors.dart';
+import '../../core/theme/app_dimens.dart';
 import '../../core/theme/app_theme.dart';
 import '../../core/widgets/auth_gate.dart';
 import '../../core/widgets/empty_state.dart';
@@ -59,12 +60,15 @@ class _AccountExportPageState extends State<AccountExportPage> {
          foregroundColor: AppColors.onPrimary,
          title: Text(l10n.accountDataExport),
        ),
-        body: signedIn
-            ? ListenableBuilder(
-                listenable: _logic,
-                builder: (context, _) => _body(l10n),
-              )
-            : const AuthGatePanel(),
+        body: SafeArea(
+          top: false,
+          child: signedIn
+              ? ListenableBuilder(
+                  listenable: _logic,
+                  builder: (context, _) => _body(l10n),
+                )
+              : const AuthGatePanel(),
+        ),
      ),
    );
  }
@@ -106,7 +110,10 @@ class _AccountExportPageState extends State<AccountExportPage> {
      const SizedBox(height: 4),
      Text(
        '${l10n.accountUid}: ${data.profile.uid}',
-        style: const TextStyle(color: AppColors.muted, fontSize: 12),
+        style: const TextStyle(
+          color: AppColors.muted,
+          fontSize: AppDimens.caption,
+        ),
      ),
    ],
  );
@@ -115,7 +122,10 @@ class _AccountExportPageState extends State<AccountExportPage> {
    children: [
      Text(
        l10n.accountCredentials,
-        style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w700),
+        style: const TextStyle(
+          fontSize: AppDimens.listTitle,
+          fontWeight: FontWeight.w700,
+        ),
      ),
      for (final credential in data.credentials)
        ListTile(
@@ -128,7 +138,10 @@ class _AccountExportPageState extends State<AccountExportPage> {
          subtitle: Text(credential.type),
          trailing: Text(
            credential.verified ? l10n.accountVerified : l10n.accountUnverified,
-            style: const TextStyle(color: AppColors.muted, fontSize: 11),
+            style: const TextStyle(
+              color: AppColors.muted,
+              fontSize: AppDimens.caption,
+            ),
          ),
        ),
      _summary(l10n.accountConsentRecords, '${data.consentCount}'),
@@ -144,10 +157,10 @@ class _AccountExportPageState extends State<AccountExportPage> {
  );

  Widget _card({required List<Widget> children}) => Container(
-    padding: const EdgeInsets.all(16),
+    padding: const EdgeInsets.all(AppDimens.cardPadding),
    decoration: BoxDecoration(
      color: AppColors.card,
-      borderRadius: BorderRadius.circular(16),
+      borderRadius: BorderRadius.circular(AppDimens.cardRadius),
      border: Border.all(color: AppColors.outlineVariantDark),
    ),
    child: Column(
@@ -163,7 +176,10 @@ class _AccountExportPageState extends State<AccountExportPage> {
        Expanded(
          child: Text(
            label,
-            style: const TextStyle(color: AppColors.muted, fontSize: 12),
+            style: const TextStyle(
+              color: AppColors.muted,
+              fontSize: AppDimens.caption,
+            ),
          ),
        ),
        Text(value, style: const TextStyle(fontWeight: FontWeight.w700)),
@@ -11,6 +11,7 @@ import '../../core/data/services/auth_controller.dart';
 import '../../core/formatting/error_text.dart';
 import '../../core/formatting/localized_date_time.dart';
 import '../../core/theme/app_colors.dart';
+import '../../core/theme/app_dimens.dart';
 import '../../core/theme/app_theme.dart';
 import '../../core/widgets/auth_gate.dart';
 import '../../core/widgets/empty_state.dart';
@@ -79,12 +80,15 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
          foregroundColor: AppColors.onPrimary,
          title: Text(l10n.accountProfile),
        ),
-        body: signedIn
-            ? ListenableBuilder(
-                listenable: _logic,
-                builder: (context, _) => _body(l10n),
-              )
-            : const AuthGatePanel(),
+        body: SafeArea(
+          top: false,
+          child: signedIn
+              ? ListenableBuilder(
+                  listenable: _logic,
+                  builder: (context, _) => _body(l10n),
+                )
+              : const AuthGatePanel(),
+        ),
      ),
    );
  }
@@ -139,14 +143,17 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
              Text(
                profile.nickname,
                style: const TextStyle(
-                  fontSize: 20,
+                  fontSize: AppDimens.pageTitle,
                  fontWeight: FontWeight.w700,
                ),
              ),
              const SizedBox(height: 4),
              Text(
                '${l10n.accountUid}: ${profile.uid}',
-                style: const TextStyle(color: AppColors.muted, fontSize: 12),
+                style: const TextStyle(
+                  color: AppColors.muted,
+                  fontSize: AppDimens.caption,
+                ),
              ),
            ],
          ),
@@ -211,7 +218,10 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
      const SizedBox(height: 6),
      Text(
        l10n.accountBirthdayHint,
-        style: const TextStyle(color: AppColors.muted, fontSize: 12),
+        style: const TextStyle(
+          color: AppColors.muted,
+          fontSize: AppDimens.caption,
+        ),
      ),
    ],
  );
@@ -222,7 +232,7 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
      errorText(l10n, _logic.error, l10n.accountProfileSaveFailed),
      style: TextStyle(
        color: Theme.of(context).colorScheme.error,
-        fontSize: 12,
+        fontSize: AppDimens.caption,
      ),
    ),
  );
@@ -250,7 +260,10 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
        children: [
          Text(
            l10n.accountReadOnlyInfo,
-            style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w700),
+            style: const TextStyle(
+              fontSize: AppDimens.listTitle,
+              fontWeight: FontWeight.w700,
+            ),
          ),
          const SizedBox(height: 10),
          _info(l10n.accountMaskedAccount, profile.maskedTarget),
@@ -283,14 +296,17 @@ class _AccountProfilePageState extends State<AccountProfilePage> {
        Expanded(
          child: Text(
            label,
-            style: const TextStyle(color: AppColors.muted, fontSize: 12),
+            style: const TextStyle(
+              color: AppColors.muted,
+              fontSize: AppDimens.caption,
+            ),
          ),
        ),
        Flexible(
          child: Text(
            value.isEmpty ? '-' : value,
            textAlign: TextAlign.right,
-            style: const TextStyle(fontSize: 13),
+            style: const TextStyle(fontSize: AppDimens.body),
          ),
        ),
      ],
@@ -337,10 +353,10 @@ class _AccountCard extends StatelessWidget {

  @override
  Widget build(BuildContext context) => Container(
-    padding: const EdgeInsets.all(16),
+    padding: const EdgeInsets.all(AppDimens.cardPadding),
    decoration: BoxDecoration(
      color: AppColors.card,
-      borderRadius: BorderRadius.circular(16),
+      borderRadius: BorderRadius.circular(AppDimens.cardRadius),
      border: Border.all(color: AppColors.outlineVariantDark),
    ),
    child: child,