桌面端UI现代化与页面切换优化

1.1 现代桌面UI趋势研究（2024-2025）

根据调研，主要趋势包括：

• 微交互动画：悬浮、点击的平滑过渡
• Glassmorphism/Acrylic：半透明毛玻璃效果
• 更精致的悬浮反馈：轻微阴影、背景色变化
• 清晰的视觉层次：表头、选中状态更明显

1.2 文件列表行悬浮效果

文件: file_tiles.dart

修改内容：

• Container 改为 AnimatedContainer，120ms 平滑过渡
• 悬浮背景色更明显（深色模式 8%、浅色模式 5%）
• 使用 Curves.easeOut 曲线

// 之前
child: Container(
  height: 44,
  decoration: BoxDecoration(color: rowColor, ...),
 
// 之后
child: AnimatedContainer(
  duration: const Duration(milliseconds: 120),
  curve: Curves.easeOut,
  height: 44,
  decoration: BoxDecoration(color: rowColor, ...),

1.3 侧边栏悬浮效果

文件: home_page.dart

修改内容：

• StatelessWidget 改为 StatefulWidget
• 添加 _hoveredIndex 状态管理
• 非选中项悬浮时显示背景高亮 + 文字颜色加亮

1.4 表头样式优化

文件: file_tiles.dart

新增组件: _HoverableHeaderCell

特性：

• 表头文字加粗（非激活 FontWeight.w500，激活 w600）
• 悬浮时背景色变化 + 文字颜色变亮
• 排序指示器使用 AnimatedRotation 动画（0.5 圈）
• AnimatedOpacity 控制排序图标显示/隐藏

1.5 文件名 Tooltip

文件: file_tiles.dart

为文件名添加 Tooltip，长文件名悬浮 500ms 后显示完整名称。

1.6 传输面板标签页动画

文件: transfer_floating_panel.dart

• 标签页切换使用 AnimatedContainer，120ms 过渡
• 添加 MouseRegion 显示手型光标

2.1 问题分析

问题：

1. 切换到聊天界面时短暂显示加载界面
2. 切换不同界面会重新渲染

原因：

• 使用 PageView 切换页面，非活跃页面会被销毁
• 每次切换都要重新构建和加载
• SendPage 的 _loading 初始值为 true

2.2 解决方案

文件: home_page.dart

用 IndexedStack 替代 PageView：

// 之前：PageView（切换时销毁/重建）
PageView(
  controller: _pageController,
  onPageChanged: _onPageChanged,
  children: _pages,
)
 
// 之后：IndexedStack（预渲染并保持状态）
IndexedStack(
  index: _navIndex,
  children: _pages,
)

优势：

• 所有页面同时渲染并保持状态
• 切换只改变显示的页面，不销毁其他页面
• 删除了不再需要的 PageController

2.3 加载状态优化

文件: send_page.dart

// 之前
bool _loading = true;
 
// 之后
bool _loading = false;  // 避免初始化时闪现加载界面
bool _initialLoadDone = false;  // 标记首次加载是否完成

逻辑：只有在首次加载且没有缓存数据时才显示加载动画。

3.1 问题

1. 选中项背景色太深（Colors.grey[400]!）
2. 悬浮背景不是正方形（高度 bgSize - 8）

3.2 修复

文件: home_page.dart

// 选中项背景色改为与悬浮一致
color: isDark
    ? Colors.white.withValues(alpha: 0.08)
    : Colors.black.withValues(alpha: 0.05),
 
// 悬浮背景高度修正
height: bgSize,  // 之前是 bgSize - 8
borderRadius: BorderRadius.circular(12),  // 之前是 8