You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1004 lines
29 KiB

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'dart:ui';
import '../controllers/home_controller.dart';
import '../../../routes/app_pages.dart';
import '../../../routes/app_routes.dart';
import '../../../core/widgets/common_bottom_nav.dart';
// 导入枚举
import '../controllers/home_controller.dart' show ConnectionStatus;
// 呼吸光动画组件
class AnimatedPulsing extends StatefulWidget {
@override
_AnimatedPulsingState createState() => _AnimatedPulsingState();
}
class _AnimatedPulsingState extends State<AnimatedPulsing>
with SingleTickerProviderStateMixin {
late AnimationController _controller;
late Animation<double> _animation;
@override
void initState() {
super.initState();
_controller = AnimationController(
duration: Duration(seconds: 2),
vsync: this,
)..repeat(reverse: true);
_animation = Tween<double>(begin: 0.5, end: 0.8).animate(
CurvedAnimation(
parent: _controller,
curve: Curves.easeInOut,
),
);
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: _animation,
builder: (context, child) {
return Opacity(
opacity: _animation.value,
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16.r),
gradient: RadialGradient(
colors: [
Colors.white.withOpacity(0.3),
Colors.transparent,
],
center: Alignment.topRight,
radius: 0.8,
stops: [0.0, 1.0],
),
),
),
);
},
);
}
}
//首页视图
class HomeView extends GetView<HomeController> {
const HomeView({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final bool isDarkMode = Theme.of(context).brightness == Brightness.dark;
return Scaffold(
backgroundColor: isDarkMode ? Colors.black : Color(0xFFF9FAFC),
body: SafeArea(
child: SingleChildScrollView(
padding: EdgeInsets.all(16.w),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 顶部标题栏
_buildAppBar(isDarkMode),
// 顶部图片
_buildEarbudsImage(),
SizedBox(height: 20.h),
// 设备状态卡片
_buildDeviceStatusCard(isDarkMode),
SizedBox(height: 20.h),
// 热门AI体验
_buildSectionTitle(isDarkMode),
SizedBox(height: 16.h),
_buildPremiumAILayout(),
],
),
),
),
bottomNavigationBar: const CommonBottomNav(currentIndex: 0),
);
}
// 顶部标题栏
Widget _buildAppBar(bool isDarkMode) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'DeepSound',
style: TextStyle(
fontSize: 20.sp,
fontWeight: FontWeight.bold,
color: isDarkMode ? Colors.white : Colors.grey[800],
),
),
Container(
width: 32.w,
height: 32.w,
decoration: BoxDecoration(
color: isDarkMode ? Colors.grey[800] : Colors.grey[200],
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(0.2),
blurRadius: 4,
offset: const Offset(0, 2),
),
],
),
child: IconButton(
icon: Icon(Icons.settings_outlined,
size: 16.sp,
color: isDarkMode ? Colors.white70 : Colors.grey[600]),
padding: EdgeInsets.zero,
onPressed: () {
Get.toNamed(Routes.settings);
},
),
),
],
);
}
// 耳机图片
Widget _buildEarbudsImage() {
final bool isDarkMode = Get.isDarkMode;
return SizedBox(
height: 220.h,
child: PageView(
children: [
Center(
child: SizedBox(
width: double.infinity,
height: 200.h,
child: Image.asset(
isDarkMode
? 'assets/images/robot_light.png'
: 'assets/images/robot_light.png',
fit: BoxFit.fitWidth,
),
),
),
Center(
child: Image.asset(
isDarkMode
? 'assets/images/headphone_dark.png'
: 'assets/images/headphone_light.png',
height: 180.h,
fit: BoxFit.contain,
),
),
Center(
child: SizedBox(
width: double.infinity,
height: 200.h,
child: Image.asset(
isDarkMode
? 'assets/images/glasses_light.png'
: 'assets/images/glasses_light.png',
fit: BoxFit.fitWidth,
),
),
),
],
),
);
}
// 设备状态卡片
Widget _buildDeviceStatusCard(bool isDarkMode) {
return Container(
decoration: BoxDecoration(
color: isDarkMode ? Color(0xFF1A1A1A) : Colors.white,
borderRadius: BorderRadius.circular(16.r),
boxShadow: [
BoxShadow(
color: Colors.grey.withOpacity(isDarkMode ? 0.05 : 0.1),
blurRadius: 10,
offset: const Offset(0, 4),
),
],
),
padding: EdgeInsets.all(16.w),
child: Column(
children: [
// 状态标题行
_buildDeviceStatusHeader(isDarkMode),
// 设备信息
SizedBox(height: 12.h),
Obx(() {
// 如果连接失败且有错误信息,显示错误提示
if (controller.connectionStatus == ConnectionStatus.failed &&
controller.connectionErrorMsg.isNotEmpty) {
return _buildConnectionErrorSection(isDarkMode);
}
// 如果正在连接中,显示连接中提示
if (controller.connectionStatus == ConnectionStatus.connecting) {
return _buildConnectingIndicator();
}
return controller.isConnected
? _buildConnectedDeviceInfo(isDarkMode)
: _buildDisconnectedInfo(isDarkMode);
}),
// 连接按钮(仅在未连接时显示)
SizedBox(height: 12.h),
Obx(() {
if (controller.connectionStatus == ConnectionStatus.disconnected) {
return _buildConnectButton();
} else {
return const SizedBox();
}
}),
],
),
);
}
// 设备状态头部
Widget _buildDeviceStatusHeader(bool isDarkMode) {
return Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Icon(
Icons.headset_outlined,
size: 18.sp,
color: isDarkMode ? Colors.grey[300] : Colors.grey[700],
),
SizedBox(width: 8.w),
Text(
'deviceStatus'.tr, // 设备状态
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
color: isDarkMode ? Colors.grey[300] : Colors.grey[700],
),
),
],
),
Obx(() => Row(
children: [
Container(
width: 8.w,
height: 8.w,
decoration: BoxDecoration(
color: controller.getConnectionStatusColor(),
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: controller.getConnectionStatusColor().withOpacity(0.3),
blurRadius: 4,
spreadRadius: 1,
),
],
),
),
SizedBox(width: 4.w),
Text(
controller.getConnectionStatusText(),
style: TextStyle(
fontSize: 12.sp,
color: controller.getConnectionStatusColor(),
),
),
// 添加刷新按钮
SizedBox(width: 8.w),
InkWell(
onTap: () => controller.refreshDeviceConnection(),
borderRadius: BorderRadius.circular(12.r),
child: Container(
padding: EdgeInsets.all(4.w),
decoration: BoxDecoration(
color: isDarkMode ? Colors.grey[800] : Colors.grey[200],
shape: BoxShape.circle,
),
child: Icon(
Icons.refresh,
size: 14.sp,
color: isDarkMode ? Colors.grey[400] : Colors.grey[600],
),
),
),
],
)),
],
);
}
// 连接错误部分
Widget _buildConnectionErrorSection(bool isDarkMode) {
return Column(
children: [
Container(
padding: EdgeInsets.all(12.w),
decoration: BoxDecoration(
color: isDarkMode
? Colors.red[900]!.withOpacity(0.2)
: Colors.red[50],
borderRadius: BorderRadius.circular(12.r),
border: Border.all(
color: isDarkMode ? Colors.red[800]! : Colors.red[200]!),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Icon(
Icons.error_outline,
color: Colors.red,
size: 18.sp,
),
SizedBox(width: 8.w),
Expanded(
child: Text(
controller.connectionErrorMsg,
style: TextStyle(
fontSize: 12.sp,
height: 1.4,
color: isDarkMode ? Colors.red[300] : Colors.red[800],
),
),
),
],
),
),
SizedBox(height: 12.h),
// 连接按钮
ElevatedButton(
onPressed: controller.rescanDevices,
style: ElevatedButton.styleFrom(
backgroundColor: Colors.blue,
foregroundColor: Colors.white,
minimumSize: Size(double.infinity, 40.h),
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.r),
),
),
child: Text(
'reconnect'.tr, // 重新连接
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
),
),
),
],
);
}
// 连接中指示器
Widget _buildConnectingIndicator() {
return Container(
padding: EdgeInsets.symmetric(vertical: 20.h),
child: Center(
child: Column(
children: [
SizedBox(
width: 30.w,
height: 30.w,
child: CircularProgressIndicator(
strokeWidth: 2.5.w,
valueColor: AlwaysStoppedAnimation<Color>(Colors.blue),
),
),
SizedBox(height: 12.h),
Text(
'connectingDevice'.tr, // 正在连接设备...
style: TextStyle(
fontSize: 13.sp,
color: Colors.blue,
fontWeight: FontWeight.w500,
),
),
],
),
),
);
}
// 已连接设备信息
Widget _buildConnectedDeviceInfo(bool isDarkMode) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 电池状态网格布局
_buildBatteryInfoGrid(isDarkMode),
],
);
}
// 电池信息网格布局
Widget _buildBatteryInfoGrid(bool isDarkMode) {
return Obx(() {
// 获取各部分电池电量
final leftBattery = controller.leftEarBattery;
final rightBattery = controller.rightEarBattery;
final caseBattery = controller.caseBattery;
// 获取充电状态
final leftEarCharging = controller.leftEarCharging;
final rightEarCharging = controller.rightEarCharging;
final caseCharging = controller.caseCharging;
return GridView.count(
crossAxisCount: 3,
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
crossAxisSpacing: 12.w,
childAspectRatio: 0.85,
children: [
// 左耳机
_buildBatteryGridItem(
icon: Icons.headphones,
label: '左耳机',
batteryLevel: leftBattery,
isCharging: leftEarCharging,
isDarkMode: isDarkMode,
),
// 右耳机
_buildBatteryGridItem(
icon: Icons.headphones,
label: '右耳机',
batteryLevel: rightBattery,
isCharging: rightEarCharging,
isDarkMode: isDarkMode,
),
// 充电盒
_buildBatteryGridItem(
icon: Icons.charging_station,
label: '充电盒',
batteryLevel: caseBattery,
isCharging: caseCharging,
isDarkMode: isDarkMode,
),
],
);
});
}
// 单个电池网格项
Widget _buildBatteryGridItem({
required IconData icon,
required String label,
required int batteryLevel,
required bool isDarkMode,
bool isCharging = false,
}) {
// 获取电池图标和颜色
IconData batteryIcon;
Color batteryColor;
if (batteryLevel > 75) {
batteryIcon = Icons.battery_full;
batteryColor = Colors.green[600]!;
} else if (batteryLevel > 50) {
batteryIcon = Icons.battery_6_bar;
batteryColor = Colors.green[600]!;
} else if (batteryLevel > 25) {
batteryIcon = Icons.battery_4_bar;
batteryColor = Colors.yellow[600]!;
} else if (batteryLevel > 10) {
batteryIcon = Icons.battery_3_bar;
batteryColor = Colors.orange[600]!;
} else {
batteryIcon = Icons.battery_alert;
batteryColor = Colors.red[600]!;
}
return Container(
decoration: BoxDecoration(
color: isDarkMode ? Colors.grey[900] : Colors.grey[100],
borderRadius: BorderRadius.circular(12.r),
boxShadow: [
BoxShadow(
color: isDarkMode ?
Colors.black.withOpacity(0.1) :
Colors.grey.withOpacity(0.1),
blurRadius: 4,
spreadRadius: 0,
offset: Offset(0, 2),
),
],
),
padding: EdgeInsets.all(10.w),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// 设备图标
Container(
padding: EdgeInsets.all(8.w),
decoration: BoxDecoration(
shape: BoxShape.circle,
),
child: Icon(
icon,
size: 24.sp,
color: isDarkMode ? Colors.grey[300] : Colors.grey[800],
),
),
SizedBox(height: 6.h),
// 标签
Text(
label,
style: TextStyle(
fontSize: 12.sp,
color: isDarkMode ? Colors.grey[400] : Colors.grey[500],
fontWeight: FontWeight.normal,
),
textAlign: TextAlign.center,
),
SizedBox(height: 6.h),
// 电池指示器
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
batteryIcon,
size: 14.sp,
color: batteryColor,
),
SizedBox(width: 4.w),
Text(
'$batteryLevel%',
style: TextStyle(
fontSize: 12.sp,
fontWeight: FontWeight.w500,
color: batteryColor,
),
),
if (isCharging) ...[
SizedBox(width: 2.w),
Icon(
Icons.bolt,
size: 12.sp,
color: Colors.green[600],
),
],
],
),
],
),
);
}
// 设备详情卡片
Widget _buildDeviceDetailsCard(bool isDarkMode) {
return Container(
padding: EdgeInsets.all(12.w),
decoration: BoxDecoration(
color: isDarkMode ? Colors.grey[900] : Colors.grey[50],
borderRadius: BorderRadius.circular(12.r),
border: Border.all(
color: isDarkMode ? Colors.grey[800]! : Colors.grey[200]!,
width: 1,
),
),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 设备ID
_buildInfoRow(
icon: Icons.perm_device_info,
label: 'deviceId'.tr,
value: controller.getDeviceId(),
isDarkMode: isDarkMode,
),
SizedBox(height: 8.h),
// 固件版本
_buildInfoRow(
icon: Icons.info_outline,
label: 'firmwareVersion'.tr,
value: controller.firmwareVersion,
isDarkMode: isDarkMode,
),
// 连接状态标签
SizedBox(height: 10.h),
Container(
padding: EdgeInsets.symmetric(horizontal: 8.w, vertical: 4.h),
decoration: BoxDecoration(
color: controller.getConnectionStatusColor().withOpacity(0.1),
borderRadius: BorderRadius.circular(6.r),
border: Border.all(
color: controller.getConnectionStatusColor().withOpacity(0.3),
width: 1,
),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Icon(
Icons.check_circle_outline,
size: 12.sp,
color: controller.getConnectionStatusColor(),
),
SizedBox(width: 4.w),
Text(
controller.getConnectionStatusText(),
style: TextStyle(
fontSize: 11.sp,
color: controller.getConnectionStatusColor(),
fontWeight: FontWeight.w500,
),
),
],
),
),
],
),
);
}
// 信息行
Widget _buildInfoRow({
required IconData icon,
required String label,
required String value,
required bool isDarkMode,
}) {
return Row(
children: [
Icon(
icon,
size: 14.sp,
color: isDarkMode ? Colors.grey[400] : Colors.grey[600],
),
SizedBox(width: 6.w),
Text(
'$label: ',
style: TextStyle(
fontSize: 11.sp,
color: isDarkMode ? Colors.grey[400] : Colors.grey[600],
),
),
Expanded(
child: Text(
value.isEmpty ? 'unknown'.tr : value,
style: TextStyle(
fontSize: 11.sp,
fontWeight: FontWeight.w500,
color: isDarkMode ? Colors.grey[300] : Colors.grey[700],
),
overflow: TextOverflow.ellipsis,
),
),
],
);
}
// 未连接信息
Widget _buildDisconnectedInfo(bool isDarkMode) {
return Container(
padding: EdgeInsets.symmetric(vertical: 16.h, horizontal: 12.w),
alignment: Alignment.center,
decoration: BoxDecoration(
color: isDarkMode ? Colors.grey[900] : Colors.grey[100],
borderRadius: BorderRadius.circular(12.r),
border: Border.all(
color: isDarkMode ? Colors.grey[800]! : Colors.grey[300]!,
width: 1,
),
),
child: Column(
children: [
Icon(
Icons.bluetooth_disabled,
size: 32.sp,
color: isDarkMode ? Colors.grey[600] : Colors.grey[500],
),
SizedBox(height: 12.h),
Text(
'disconnectedDevice'.tr, // 未连接设备,点击下方按钮连接
style: TextStyle(
fontSize: 13.sp,
color: isDarkMode ? Colors.grey[400] : Colors.grey[700],
height: 1.4,
fontWeight: FontWeight.w500,
),
textAlign: TextAlign.center,
),
],
),
);
}
// 连接按钮
Widget _buildConnectButton() {
return ElevatedButton(
onPressed: controller.rescanDevices,
style: ElevatedButton.styleFrom(
backgroundColor: Colors.blue,
foregroundColor: Colors.white,
minimumSize: Size(double.infinity, 44.h),
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.r),
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.bluetooth_searching, size: 18.sp),
SizedBox(width: 8.w),
Text(
'connectDevice'.tr, // 连接设备
style: TextStyle(
fontSize: 14.sp,
fontWeight: FontWeight.w500,
),
),
],
),
);
}
// 热门AI体验标题
Widget _buildSectionTitle(bool isDarkMode) {
return Row(
children: [
Text(
'topAiExperiences'.tr, // 热门AI体验
style: TextStyle(
fontSize: 18.sp,
fontWeight: FontWeight.bold,
color: isDarkMode ? Colors.white : Colors.grey[800],
),
),
SizedBox(width: 8.w),
Icon(
Icons.star,
color: Colors.amber,
size: 20.w,
),
],
);
}
// 优质AI体验布局(左1右2)
Widget _buildPremiumAILayout() {
final bool isDarkMode = Get.isDarkMode;
return Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// 左侧大卡片 - AI助理
Expanded(
flex: 1,
child: _buildFeatureCard(
title: 'aiAssistant'.tr, // AI全能助手
description: 'aiAssistantInfo'.tr, // 24小时专属顾问,解答问题、提供建议
icon: Icons.assistant,
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
Color(0xFF0066CC).withOpacity(0.3),
Color(0xFF5E5CE6).withOpacity(0.3),
],
),
onTap: controller.exploreAIFeatures,
iconOnTop: true,
height: 175.h, // 增加高度
isDarkMode: isDarkMode,
iconColor: const Color(0xFF0066CC),
),
),
SizedBox(width: 16.w),
// 右侧两个卡片
Expanded(
flex: 1,
child: Column(
children: [
// 右上卡片 - 同声翻译
_buildFeatureCard(
title: 'simultaneousInterpretation'.tr, // 同声传译
description:
'simultaneousInterpretationInfo'.tr, // 80+语言实时翻译,出国无忧
icon: Icons.translate,
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
Color(0xFF4CAF50).withOpacity(0.3),
Color(0xFF009688).withOpacity(0.3),
],
),
onTap: controller.openTranslation,
height: 83.h, // 增加高度
isDarkMode: isDarkMode,
iconColor: const Color(0xFF4CAF50),
),
SizedBox(height: 5.h), // 减少间距
// 右下卡片 - AI女友
_buildFeatureCard(
title: 'aiCompanion'.tr, // 亲子陪伴
description: 'aiCompanionInfo'.tr, // 懂你心意,温暖陪伴
icon: Icons.favorite,
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
Color(0xFFE91E63).withOpacity(0.3),
Color(0xFFFF5252).withOpacity(0.3),
],
),
onTap: controller.openAIGirlfriend,
height: 85.h, // 增加高度
isDarkMode: isDarkMode,
iconColor: const Color(0xFFE91E63),
),
],
),
),
],
);
}
// 特性卡片构建方法
Widget _buildFeatureCard({
required String title,
required String description,
required IconData icon,
required LinearGradient gradient,
required VoidCallback onTap,
double? height,
bool iconOnTop = false,
bool isDarkMode = false,
Color iconColor = Colors.white,
}) {
return GestureDetector(
onTap: onTap,
child: Container(
height: height ?? 175.h,
padding: EdgeInsets.all(14.w),
decoration: BoxDecoration(
gradient: gradient,
borderRadius: BorderRadius.circular(16.r),
boxShadow: [
BoxShadow(
color: isDarkMode
? Colors.black.withOpacity(0.2)
: Colors.grey.withOpacity(0.1),
blurRadius: 8,
offset: const Offset(0, 4),
),
],
),
child: Stack(
children: [
// 图标
if (iconOnTop)
// 大卡片布局
Align(
alignment: Alignment.topLeft,
child: Container(
width: 45.w,
height: 45.w,
decoration: BoxDecoration(
color: iconColor.withOpacity(0.2),
shape: BoxShape.circle,
),
child: Icon(
icon,
color: iconColor,
size: 24.w,
),
),
)
else
// 小卡片布局 - 图标
Align(
alignment: Alignment.topLeft,
child: Container(
width: 34.w,
height: 34.w,
decoration: BoxDecoration(
color: iconColor.withOpacity(0.2),
shape: BoxShape.circle,
),
child: Icon(
icon,
color: iconColor,
size: 18.w,
),
),
),
// 文本内容
if (iconOnTop)
// 大卡片布局 - 文本
Padding(
padding: EdgeInsets.only(top: 55.h),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
title,
style: TextStyle(
color: isDarkMode ? Colors.white : Colors.grey[800],
fontSize: 16.sp,
fontWeight: FontWeight.bold,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
SizedBox(height: 4.h),
Flexible(
child: Text(
description,
style: TextStyle(
color:
isDarkMode ? Colors.grey[400] : Colors.grey[600],
fontSize: 12.sp,
),
maxLines: 3,
overflow: TextOverflow.ellipsis,
),
),
],
),
)
else
// 小卡片布局 - 文本
Padding(
padding: EdgeInsets.only(left: 44.w),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
title,
style: TextStyle(
color: isDarkMode ? Colors.white : Colors.grey[800],
fontSize: 14.sp,
fontWeight: FontWeight.bold,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
SizedBox(height: 2.h),
Flexible(
child: Text(
description,
style: TextStyle(
color:
isDarkMode ? Colors.grey[400] : Colors.grey[600],
fontSize: 10.sp,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
],
),
),
],
),
),
);
}
}