fix(mobile): 修复SVG头像渲染导致的布局问题

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

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

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
hailin 2025-12-24 03:26:24 -08:00
parent a38727eb7f
commit ba3e96c606
2 changed files with 34 additions and 10 deletions

View File

@ -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(

View File

@ -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),
),
),
),
);
}