From 29a53a49a1607483acf69b38a61d7bfaeacffe96 Mon Sep 17 00:00:00 2001 From: lxm <1274844347@qq.com> Date: Sat, 1 Nov 2025 11:40:51 +0800 Subject: [PATCH] =?UTF-8?q?feat(translation):=20=E4=B8=BA=E7=BF=BB?= =?UTF-8?q?=E8=AF=91=E9=80=89=E9=A1=B9=E6=B7=BB=E5=8A=A0=E6=B8=90=E5=8F=98?= =?UTF-8?q?=E8=83=8C=E6=99=AF=E5=92=8C=E9=A2=9C=E8=89=B2=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 修改翻译选项卡片样式，使用渐变背景替代纯色背景 更新 TranslationOption 类新增 startColor/endColor/iconBgColor 字段 调整阴影偏移量和图标背景透明度以增强视觉效果 --- .../translation_middleware_controller.dart | 38 +++++++++++++++---- .../views/translation_middleware_view.dart | 26 ++++++++++--- 2 files changed, 51 insertions(+), 13 deletions(-) diff --git a/lib/modules/translation/middleware/controllers/translation_middleware_controller.dart b/lib/modules/translation/middleware/controllers/translation_middleware_controller.dart index 727ee76a7..614d8f811 100644 --- a/lib/modules/translation/middleware/controllers/translation_middleware_controller.dart +++ b/lib/modules/translation/middleware/controllers/translation_middleware_controller.dart @@ -16,7 +16,10 @@ class TranslationMiddlewareController extends GetxController { title: 'simultaneousTranslation'.tr, // 实时翻译 // description: 'realtimeTranslationDescription', // 实时语音翻译，支持多种语言 icon: Icons.record_voice_over, - iconColor: 0xFF2196F3, // 蓝色 + startColor: Colors.blue[400]!, // 亮蓝 + endColor: Colors.blue[600]!, //深蓝 + iconBgColor: Colors.white, // 白色 + iconColor: Colors.blue[500]!, // 主蓝 targetRoute: Routes.translation, ), TranslationOption( @@ -24,7 +27,10 @@ class TranslationMiddlewareController extends GetxController { title: 'callTranslation'.tr, // 通话翻译 // description: 'simultaneousTranslationInfo', // 双向对话翻译，面对面交流 icon: Icons.call, - iconColor: 0xFF4CAF50, // 绿色 + startColor: Colors.green[400]!, // 绿色 + endColor: Colors.green[600]!, // 深绿 + iconBgColor: Colors.white, // 白色 + iconColor: Colors.green[500]!, // 主绿 targetRoute: Routes.translation, ), TranslationOption( @@ -32,7 +38,10 @@ class TranslationMiddlewareController extends GetxController { title: 'faceToFaceTranslation'.tr, // 面对面翻译 // description: 'faceToFaceTranslationDescription', // 面对面交流，支持多种语言 icon: Icons.people, - iconColor: 0xFFFF9800, // 橙色 + startColor: Colors.orange[400]!, // 橙色 + endColor: Colors.orange[600]!, // 深橙 + iconBgColor: Colors.white, // 白色 + iconColor: Colors.orange[500]!, // 主橙 targetRoute: Routes.translation, ), TranslationOption( @@ -40,21 +49,30 @@ class TranslationMiddlewareController extends GetxController { title: 'audioVideoTranslation'.tr, // 多媒体翻译 //description: 'audioVideoTranslationDescription', // 支持音频和视频翻译 icon: Icons.videocam, - iconColor: 0xFF9C27B0, // 紫色 + startColor: Colors.purple[400]!, // 亮紫 + endColor: Colors.purple[600]!, // 深紫 + iconBgColor: Colors.white, // 白色 + iconColor: Colors.purple[500]!, // 主紫 targetRoute: Routes.translation, ), TranslationOption( translationId: 'picture_translator', title: 'pictureTranslation'.tr, // 图片翻译 icon: Icons.image, - iconColor: 0xFF009688, // 青色 + startColor: Colors.teal[400]!, // 青色 + endColor: Colors.teal[600]!, // 深青 + iconBgColor: Colors.white, // 白色 + iconColor: Colors.teal[500]!, // 主青 targetRoute: Routes.pictureTranslation, ), TranslationOption( translationId: 'text_translator', title: 'textTranslation'.tr, // 文本翻译 icon: Icons.text_fields, - iconColor: 0xFF3F51B5, // 棕色 + startColor: Colors.indigo[400]!, // 靛蓝 + endColor: Colors.indigo[600]!, // 深靛 + iconBgColor: Colors.white, // 白色 + iconColor: Colors.indigo[500]!, // 主靛 targetRoute: Routes.textTranslation, ), ]; @@ -103,7 +121,10 @@ class TranslationOption { final String title; // final String description; final IconData icon; - final int iconColor; + final Color startColor; + final Color endColor; + final Color iconBgColor; + final Color iconColor; final String targetRoute; TranslationOption({ @@ -111,6 +132,9 @@ class TranslationOption { required this.title, // required this.description, required this.icon, + required this.startColor, + required this.endColor, + required this.iconBgColor, required this.iconColor, required this.targetRoute, }); diff --git a/lib/modules/translation/middleware/views/translation_middleware_view.dart b/lib/modules/translation/middleware/views/translation_middleware_view.dart index 45804d334..1cdee57ed 100644 --- a/lib/modules/translation/middleware/views/translation_middleware_view.dart +++ b/lib/modules/translation/middleware/views/translation_middleware_view.dart @@ -91,7 +91,23 @@ class TranslationMiddlewareView onTap: () => controller.navigateToTranslationFeature(option), child: Container( decoration: BoxDecoration( - color: isDarkMode ? AppColors.cardBackground : Colors.white, + // 使用新的 startColor/endColor 构建渐变背景 + gradient: LinearGradient( + begin: Alignment.topLeft, + end: Alignment.bottomRight, + colors: [ + option.startColor.withOpacity( + isEnabled + ? (isDarkMode ? 0.3 : 0.3) + : (isDarkMode ? 0.15 : 0.08), + ), + option.endColor.withOpacity( + isEnabled + ? (isDarkMode ? 0.3 : 0.3) + : (isDarkMode ? 0.15 : 0.08), + ), + ], + ), borderRadius: BorderRadius.circular(16.r), boxShadow: [ BoxShadow( @@ -99,7 +115,7 @@ class TranslationMiddlewareView ? Colors.black.withOpacity(0.3) : Colors.grey.withOpacity(0.1), blurRadius: 8, - offset: const Offset(0, 2), + offset: const Offset(0, 4), ), ], ), @@ -113,15 +129,13 @@ class TranslationMiddlewareView width: 60.w, height: 60.h, decoration: BoxDecoration( - color: Color(option.iconColor) - .withOpacity(isEnabled ? 0.1 : 0.05), + color: option.iconBgColor.withOpacity(isEnabled ? 0.2 : 0.05), borderRadius: BorderRadius.circular(16.r), ), child: Icon( option.icon, size: 32.sp, - color: Color(option.iconColor) - .withOpacity(isEnabled ? 1.0 : 0.5), + color: option.iconColor.withOpacity(isEnabled ? 1.0 : 0.5), ), ), SizedBox(height: 16.h),