From ba3e96c606dde977519469c37e84fb6d49852333 Mon Sep 17 00:00:00 2001
From: hailin <hailin.zhao@gdzx.xyz>
Date: Wed, 24 Dec 2025 03:26:24 -0800
Subject: [PATCH] =?UTF-8?q?fix(mobile):=20=E4=BF=AE=E5=A4=8DSVG=E5=A4=B4?=
 =?UTF-8?q?=E5=83=8F=E6=B8=B2=E6=9F=93=E5=AF=BC=E8=87=B4=E7=9A=84=E5=B8=83?=
 =?UTF-8?q?=E5=B1=80=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 使用RepaintBoundary隔离SVG渲染
- 添加placeholderBuilder防止加载时闪烁
- 确保SizedBox固定尺寸约束

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../presentation/pages/edit_profile_page.dart | 22 ++++++++++++++-----
 .../presentation/pages/profile_page.dart      | 22 ++++++++++++++-----
 2 files changed, 34 insertions(+), 10 deletions(-)

diff --git a/frontend/mobile-app/lib/features/profile/presentation/pages/edit_profile_page.dart b/frontend/mobile-app/lib/features/profile/presentation/pages/edit_profile_page.dart
index 5f16541d..027843ef 100644
--- a/frontend/mobile-app/lib/features/profile/presentation/pages/edit_profile_page.dart
+++ b/frontend/mobile-app/lib/features/profile/presentation/pages/edit_profile_page.dart
@@ -482,11 +482,23 @@ class _EditProfilePageState extends ConsumerState<EditProfilePage> {
   /// 构建SVG或默认头像
   Widget _buildSvgOrDefaultAvatar() {
     if (_avatarSvg != null) {
-      return SvgPicture.string(
-        _avatarSvg!,
-        width: 128,
-        height: 128,
-        fit: BoxFit.cover,
+      // 使用 SizedBox + RepaintBoundary 包装确保固定尺寸并隔离渲染，避免布局问题
+      return RepaintBoundary(
+        child: SizedBox(
+          width: 128,
+          height: 128,
+          child: SvgPicture.string(
+            _avatarSvg!,
+            width: 128,
+            height: 128,
+            fit: BoxFit.cover,
+            placeholderBuilder: (context) => const Icon(
+              Icons.person,
+              size: 64,
+              color: Color(0xFF8B5A2B),
+            ),
+          ),
+        ),
       );
     }
     return const Icon(
diff --git a/frontend/mobile-app/lib/features/profile/presentation/pages/profile_page.dart b/frontend/mobile-app/lib/features/profile/presentation/pages/profile_page.dart
index ccc6ce4e..9462f804 100644
--- a/frontend/mobile-app/lib/features/profile/presentation/pages/profile_page.dart
+++ b/frontend/mobile-app/lib/features/profile/presentation/pages/profile_page.dart
@@ -1665,11 +1665,23 @@ class _ProfilePageState extends ConsumerState<ProfilePage> {
       // 检测是否是 SVG 字符串（随机生成的 SVG 头像）
       if (_avatarSvg!.contains('<svg') || _avatarSvg!.startsWith('<?xml')) {
         debugPrint('[ProfilePage] _buildSvgOrDefaultAvatar() - 检测到是SVG字符串，使用SvgPicture');
-        return SvgPicture.string(
-          _avatarSvg!,
-          width: 80,
-          height: 80,
-          fit: BoxFit.cover,
+        // 使用 SizedBox + RepaintBoundary 包装确保固定尺寸并隔离渲染，避免布局问题
+        return RepaintBoundary(
+          child: SizedBox(
+            width: 80,
+            height: 80,
+            child: SvgPicture.string(
+              _avatarSvg!,
+              width: 80,
+              height: 80,
+              fit: BoxFit.cover,
+              placeholderBuilder: (context) => const Icon(
+                Icons.person,
+                size: 40,
+                color: Color(0xFF8B5A2B),
+              ),
+            ),
+          ),
         );
       }