本人的学习灵感源自 CSDN 博主 A 懿轩 A(博客链接:https://blog.csdn.net/2301_80035882?type=blog)。博主围绕【2025 版 OpenHarmony】GitCode 口袋工具系列开发内容,兼具实用性与指导性,极具参考和学习意义。在此基础上所有内容均为个人实操总结,尊重原作者知识产权,特此标注。
1、UI组件封装与复用优化
在lib/pages/main_navigation/intro_page.dart中的buildSection方法,我们可以把重复的 UI 做成模板,这个方法接收标题、图标和内容三个参数,就能生成一个带标题、图标和内容的区块。这样子看起来会更整齐,更好了解这些区块是一套风格,少写很多重复代码,省时间还不容易错。
//通用区块构建方法,统一生成图标+标题+内容风格的UI组件 //[context]:BuildContext上下文 //[title]:区块标题 //[icon]:区块图标 //[child]:区块内容组件 Widget _buildSection( BuildContext context, { required String title, required IconData icon, required Widget child, }) { final theme = Theme.of(context); return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [// 标题栏(图标+文字) Row( children: [ Icon(icon, color: theme.colorScheme.primary, size: 24), const SizedBox(width: 8), // 图标与文字间距 Text( title, style: theme.textTheme.titleLarge?.copyWith( fontWeight: FontWeight.bold, ), ), ], ), const SizedBox(height: 16), // 标题与内容间距 child, // 自定义内容区域 ], ); }2、头像加载容错优化
在gitcode_pocket_tool-master\lib\pages\main_navigation\profile_page.dart中,我们可以优化头像加载代码,加载头像的时候,先试本地图片,本地加载失败就试网络图片,网络也失败就显示一个默认图标,层层保底。
// 头像 Container( width: 120, height: 120, decoration: BoxDecoration( shape: BoxShape.circle,//圆形裁剪 border: Border.all( color: theme.colorScheme.primary.withValues(alpha: 0.3), // 半透明边框 width: 3, ), boxShadow: [ BoxShadow( color: theme.colorScheme.primary.withValues(alpha: 0.2), // 柔和阴影 blurRadius: 20, offset: const Offset(0, 10), ), ], ), child: ClipOval( child: Image.asset( avatarUrl, // 优先加载本地头像 fit: BoxFit.cover, errorBuilder: (context, error, stackTrace) { // 如果本地图片加载失败,尝试加载网络图片作为备用 return Image.network( fallbackAvatarUrl, fit: BoxFit.cover, errorBuilder: (context, error, stackTrace) { // 如果网络图片也加载失败,显示默认头像图标 return Container( color: theme.colorScheme.surfaceContainerHighest, child: Icon( Icons.person, size: 60, color: theme.colorScheme.onSurfaceVariant, ), ); }, ); }, ), ), ),3、输入参数预处理优化
在gitcode_pocket_tool-master\lib\core\gitcode_api.dart中,我们可以添加这个代码,因为用户可能不小心多打了空格,程序帮他处理掉,减少操作失误。
xx
// 统一去除空白,避免因为用户误输入空格导致请求 404。 final trimmed = username.trim(); if (trimmed.isEmpty) { throw const GitCodeApiException('用户名不能为空'); }在gitcode_pocket_tool-master\lib\core\gitcode_api.dart中,我们可以优化这个代码中的clamp(),因为分页中用到clamp(),所以我们可以将里面的数值改在合理的范围,这样就不会因为参数不合理导致服务器报错,也不会一次加载太多数据卡到爆。
final response = await _dio.get<List<dynamic>>( '/search/users', queryParameters: <String, dynamic>{ 'q': trimmed, 'access_token': personalToken, // clamp 可以阻止业务层传入不合法的分页参数,避免后端报错。 'per_page': perPage.clamp(1, 50), 'page': page.clamp(1, 100), },通过以上优化,可以提升了代码的可维护性和复用性,也可以增强了应用的稳定性和用户体验,减少因人为操作或参数异常导致的功能故障。