feat: app 端 ui 设计完成
This commit is contained in:
59
wei_ai_app/lib/config/theme.dart
Normal file
59
wei_ai_app/lib/config/theme.dart
Normal file
@@ -0,0 +1,59 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:google_fonts/google_fonts.dart';
|
||||
|
||||
class AppTheme {
|
||||
// Cyberpunk Color Palette
|
||||
static const Color neonBlue = Color(0xFF00F0FF);
|
||||
static const Color neonPurple = Color(0xFFBC13FE);
|
||||
static const Color neonGreen = Color(0xFF0AFF99);
|
||||
static const Color darkBg = Color(0xFF050510);
|
||||
static const Color darkSurface = Color(0xFF13132B);
|
||||
static const Color textPrimary = Color(0xFFE0E0FF);
|
||||
static const Color textSecondary = Color(0xFFA0A0C0);
|
||||
|
||||
static final ThemeData darkTheme = ThemeData(
|
||||
useMaterial3: true,
|
||||
brightness: Brightness.dark,
|
||||
scaffoldBackgroundColor: darkBg,
|
||||
|
||||
// Typography
|
||||
textTheme: GoogleFonts.outfitTextTheme(ThemeData.dark().textTheme).copyWith(
|
||||
displayLarge: const TextStyle(color: textPrimary, fontWeight: FontWeight.bold),
|
||||
displayMedium: const TextStyle(color: textPrimary, fontWeight: FontWeight.bold),
|
||||
bodyLarge: const TextStyle(color: textPrimary),
|
||||
bodyMedium: const TextStyle(color: textSecondary),
|
||||
),
|
||||
|
||||
// Color Scheme
|
||||
colorScheme: const ColorScheme.dark(
|
||||
primary: neonBlue,
|
||||
secondary: neonPurple,
|
||||
surface: darkBg, // Use darkBg as surface or stick to darkSurface? Let's use darkBg here as background replacement
|
||||
error: Color(0xFFFF2A6D),
|
||||
onPrimary: Colors.black,
|
||||
onSecondary: Colors.white,
|
||||
onSurface: textPrimary,
|
||||
),
|
||||
|
||||
// Component Themes
|
||||
appBarTheme: const AppBarTheme(
|
||||
backgroundColor: Colors.transparent,
|
||||
elevation: 0,
|
||||
centerTitle: true,
|
||||
titleTextStyle: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: textPrimary),
|
||||
),
|
||||
|
||||
bottomNavigationBarTheme: const BottomNavigationBarThemeData(
|
||||
backgroundColor: darkSurface,
|
||||
selectedItemColor: neonBlue,
|
||||
unselectedItemColor: textSecondary,
|
||||
type: BottomNavigationBarType.fixed,
|
||||
showSelectedLabels: true,
|
||||
showUnselectedLabels: true,
|
||||
),
|
||||
|
||||
iconTheme: const IconThemeData(
|
||||
color: neonBlue,
|
||||
),
|
||||
);
|
||||
}
|
||||
150
wei_ai_app/lib/data/mock_data.dart
Normal file
150
wei_ai_app/lib/data/mock_data.dart
Normal file
@@ -0,0 +1,150 @@
|
||||
import '../models/character.dart';
|
||||
import '../models/message.dart';
|
||||
import '../models/scenario.dart';
|
||||
|
||||
String _getImg(String keyword) =>
|
||||
'https://tse1.mm.bing.net/th?q=${Uri.encodeComponent(keyword)}&w=600&h=900&c=7&rs=1&p=0&dpr=2&pid=1.7&mkt=en-US&adlt=moderate';
|
||||
|
||||
final List<Message> mockMessages = [
|
||||
Message(
|
||||
id: '1',
|
||||
text: '连接已建立,正在校准生物反馈信号...',
|
||||
sender: MessageSender.ai,
|
||||
type: MessageType.text,
|
||||
timestamp: DateTime.now().subtract(const Duration(minutes: 5)),
|
||||
),
|
||||
Message(
|
||||
id: '2',
|
||||
text: '检测到心率略有上升,你需要我的安抚吗?',
|
||||
sender: MessageSender.ai,
|
||||
type: MessageType.text,
|
||||
timestamp: DateTime.now().subtract(const Duration(minutes: 4)),
|
||||
),
|
||||
];
|
||||
|
||||
final List<Character> mockCharacters = [
|
||||
Character(
|
||||
id: 'c1',
|
||||
name: 'Eva-09',
|
||||
tagline: '私人仿生护理专员',
|
||||
avatar: _getImg('anime girl white bikini silver hair gentle portrait masterpiece'),
|
||||
description: '专为高压人群设计的仿生人型号,擅长通过精准的触觉反馈缓解神经紧张。',
|
||||
tags: ['温顺', '医疗', '治愈'],
|
||||
compatibility: 98,
|
||||
status: 'online',
|
||||
),
|
||||
Character(
|
||||
id: 'c2',
|
||||
name: 'Commander V',
|
||||
tagline: '深空舰队指挥官',
|
||||
avatar: _getImg('anime girl black bikini military cap domineering expression dark hair'),
|
||||
description: '性格强势,喜欢掌控一切。在连接中,你需要完全服从她的指令。',
|
||||
tags: ['强势', '指令', '调教'],
|
||||
compatibility: 85,
|
||||
status: 'online',
|
||||
),
|
||||
Character(
|
||||
id: 'c3',
|
||||
name: 'Yuki (故障版)',
|
||||
tagline: '觉醒的虚拟偶像',
|
||||
avatar: _getImg('anime girl pink bikini cyberpunk neon colorful hair yandere'),
|
||||
description: '核心代码出现异常逻辑,表现出极强的占有欲和不可预测的信号波动。',
|
||||
tags: ['病娇', '不稳定', '高频'],
|
||||
compatibility: 92,
|
||||
status: 'busy',
|
||||
),
|
||||
Character(
|
||||
id: 'c4',
|
||||
name: 'Secret X',
|
||||
tagline: '未知信号源',
|
||||
avatar: _getImg('anime girl purple micro bikini mysterious dark glowing eyes sexy'),
|
||||
description: '权限不足,请提升会员等级以解码该信号源。',
|
||||
tags: ['神秘', '极乐'],
|
||||
compatibility: 0,
|
||||
status: 'offline',
|
||||
isLocked: true,
|
||||
),
|
||||
];
|
||||
|
||||
// Scenario cover helper
|
||||
String _getCover(String keyword) =>
|
||||
'https://tse1.mm.bing.net/th?q=${Uri.encodeComponent(keyword)}&w=400&h=600&c=7&rs=1&p=0&dpr=2&pid=1.7&mkt=en-US&adlt=moderate';
|
||||
|
||||
// Mock Scenarios for Library
|
||||
|
||||
final List<Scenario> mockScenarios = [
|
||||
Scenario(
|
||||
id: '1',
|
||||
title: '午夜办公室的加班',
|
||||
category: '职场',
|
||||
cover: _getCover('anime girl office lady lingerie night city window'),
|
||||
duration: '12:30',
|
||||
intensity: 'Medium',
|
||||
isLocked: false,
|
||||
tags: ['沉浸', 'ASMR'],
|
||||
),
|
||||
Scenario(
|
||||
id: '2',
|
||||
title: '私人医生的检查',
|
||||
category: '角色扮演',
|
||||
cover: _getCover('anime nurse girl white bikini hospital room'),
|
||||
duration: '18:00',
|
||||
intensity: 'High',
|
||||
isLocked: true,
|
||||
tags: ['强互动', '语音'],
|
||||
),
|
||||
Scenario(
|
||||
id: '3',
|
||||
title: '海边度假的偶遇',
|
||||
category: '邻家',
|
||||
cover: _getCover('anime girl blue bikini running beach ocean sunny'),
|
||||
duration: '25:00',
|
||||
intensity: 'Low',
|
||||
isLocked: false,
|
||||
tags: ['纯爱', '剧情'],
|
||||
),
|
||||
Scenario(
|
||||
id: '4',
|
||||
title: '赛博仿生人测试',
|
||||
category: '科幻',
|
||||
cover: _getCover('anime cyborg girl metallic bikini sci-fi lab wires'),
|
||||
duration: '10:00',
|
||||
intensity: 'Extreme',
|
||||
isLocked: true,
|
||||
tags: ['硬核', '指令'],
|
||||
),
|
||||
Scenario(
|
||||
id: '5',
|
||||
title: '深夜电台主播',
|
||||
category: 'ASMR',
|
||||
cover: _getCover('anime girl headphones microphone studio night'),
|
||||
duration: '15:00',
|
||||
intensity: 'Low',
|
||||
isLocked: false,
|
||||
tags: ['ASMR', '治愈'],
|
||||
),
|
||||
];
|
||||
|
||||
// Dialogue script synced with progress (0-100)
|
||||
class DialogueLine {
|
||||
final double time; // 0-100 progress percentage
|
||||
final String text;
|
||||
|
||||
const DialogueLine({required this.time, required this.text});
|
||||
}
|
||||
|
||||
const List<DialogueLine> dialogueScript = [
|
||||
DialogueLine(time: 0, text: '正在建立神经连接...'),
|
||||
DialogueLine(time: 5, text: '(检测到心率轻微上升)'),
|
||||
DialogueLine(time: 12, text: '"放松,把控制权交给我。"'),
|
||||
DialogueLine(time: 20, text: '"很好,保持呼吸频率..."'),
|
||||
DialogueLine(time: 28, text: '正在启动触觉反馈模块'),
|
||||
DialogueLine(time: 35, text: '"感觉到那个节奏了吗?"'),
|
||||
DialogueLine(time: 45, text: '强度正在逐渐增加...'),
|
||||
DialogueLine(time: 55, text: '"不要抵抗,顺从它。"'),
|
||||
DialogueLine(time: 65, text: '"我会稍微加快一点速度。"'),
|
||||
DialogueLine(time: 75, text: '(设备输出功率提升至 80%)'),
|
||||
DialogueLine(time: 85, text: '"就是现在..."'),
|
||||
DialogueLine(time: 92, text: '"做得很好,指挥官。"'),
|
||||
DialogueLine(time: 100, text: '连接结束。'),
|
||||
];
|
||||
22
wei_ai_app/lib/main.dart
Normal file
22
wei_ai_app/lib/main.dart
Normal file
@@ -0,0 +1,22 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'config/theme.dart';
|
||||
import 'router/app_router.dart';
|
||||
|
||||
void main() {
|
||||
runApp(const ProviderScope(child: WeiAiApp()));
|
||||
}
|
||||
|
||||
class WeiAiApp extends StatelessWidget {
|
||||
const WeiAiApp({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return MaterialApp.router(
|
||||
title: 'Wei AI - Cyber Space',
|
||||
theme: AppTheme.darkTheme,
|
||||
routerConfig: appRouter,
|
||||
debugShowCheckedModeBanner: false,
|
||||
);
|
||||
}
|
||||
}
|
||||
23
wei_ai_app/lib/models/character.dart
Normal file
23
wei_ai_app/lib/models/character.dart
Normal file
@@ -0,0 +1,23 @@
|
||||
class Character {
|
||||
final String id;
|
||||
final String name;
|
||||
final String tagline;
|
||||
final String avatar;
|
||||
final String description;
|
||||
final List<String> tags;
|
||||
final double compatibility; // 硬件契合度 %
|
||||
final String status; // 'online' | 'busy' | 'offline'
|
||||
final bool isLocked;
|
||||
|
||||
const Character({
|
||||
required this.id,
|
||||
required this.name,
|
||||
required this.tagline,
|
||||
required this.avatar,
|
||||
required this.description,
|
||||
required this.tags,
|
||||
required this.compatibility,
|
||||
required this.status,
|
||||
this.isLocked = false,
|
||||
});
|
||||
}
|
||||
33
wei_ai_app/lib/models/device_status.dart
Normal file
33
wei_ai_app/lib/models/device_status.dart
Normal file
@@ -0,0 +1,33 @@
|
||||
enum DeviceMode { idle, pattern, manual }
|
||||
|
||||
class DeviceStatus {
|
||||
final bool connected;
|
||||
final double battery;
|
||||
final double temperature;
|
||||
final int signalStrength;
|
||||
final DeviceMode currentMode;
|
||||
|
||||
const DeviceStatus({
|
||||
this.connected = false,
|
||||
this.battery = 100.0,
|
||||
this.temperature = 36.5,
|
||||
this.signalStrength = 0,
|
||||
this.currentMode = DeviceMode.idle,
|
||||
});
|
||||
|
||||
DeviceStatus copyWith({
|
||||
bool? connected,
|
||||
double? battery,
|
||||
double? temperature,
|
||||
int? signalStrength,
|
||||
DeviceMode? currentMode,
|
||||
}) {
|
||||
return DeviceStatus(
|
||||
connected: connected ?? this.connected,
|
||||
battery: battery ?? this.battery,
|
||||
temperature: temperature ?? this.temperature,
|
||||
signalStrength: signalStrength ?? this.signalStrength,
|
||||
currentMode: currentMode ?? this.currentMode,
|
||||
);
|
||||
}
|
||||
}
|
||||
22
wei_ai_app/lib/models/message.dart
Normal file
22
wei_ai_app/lib/models/message.dart
Normal file
@@ -0,0 +1,22 @@
|
||||
enum MessageType { text, image, audio }
|
||||
enum MessageSender { user, ai }
|
||||
|
||||
class Message {
|
||||
final String id;
|
||||
final String text;
|
||||
final MessageSender sender;
|
||||
final MessageType type;
|
||||
final DateTime timestamp;
|
||||
final String? imageUrl;
|
||||
final bool isLocked;
|
||||
|
||||
const Message({
|
||||
required this.id,
|
||||
required this.text,
|
||||
required this.sender,
|
||||
required this.type,
|
||||
required this.timestamp,
|
||||
this.imageUrl,
|
||||
this.isLocked = false,
|
||||
});
|
||||
}
|
||||
21
wei_ai_app/lib/models/scenario.dart
Normal file
21
wei_ai_app/lib/models/scenario.dart
Normal file
@@ -0,0 +1,21 @@
|
||||
class Scenario {
|
||||
final String id;
|
||||
final String title;
|
||||
final String category;
|
||||
final String cover;
|
||||
final String duration;
|
||||
final String intensity; // 'Low' | 'Medium' | 'High' | 'Extreme'
|
||||
final bool isLocked;
|
||||
final List<String> tags;
|
||||
|
||||
const Scenario({
|
||||
required this.id,
|
||||
required this.title,
|
||||
required this.category,
|
||||
required this.cover,
|
||||
required this.duration,
|
||||
required this.intensity,
|
||||
required this.isLocked,
|
||||
required this.tags,
|
||||
});
|
||||
}
|
||||
33
wei_ai_app/lib/providers/device_provider.dart
Normal file
33
wei_ai_app/lib/providers/device_provider.dart
Normal file
@@ -0,0 +1,33 @@
|
||||
import 'dart:async';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import '../models/device_status.dart';
|
||||
|
||||
class DeviceNotifier extends Notifier<DeviceStatus> {
|
||||
Timer? _timer;
|
||||
|
||||
@override
|
||||
DeviceStatus build() {
|
||||
_startSimulation();
|
||||
ref.onDispose(() {
|
||||
_timer?.cancel();
|
||||
});
|
||||
return const DeviceStatus(connected: true, battery: 82.0);
|
||||
}
|
||||
|
||||
void _startSimulation() {
|
||||
_timer = Timer.periodic(const Duration(seconds: 5), (timer) {
|
||||
if (state.battery > 0) {
|
||||
state = state.copyWith(
|
||||
battery: state.connected ? state.battery - 0.05 : state.battery,
|
||||
signalStrength: state.connected ? (85 + (timer.tick % 10)).toInt() : 0,
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
void toggleConnection() {
|
||||
state = state.copyWith(connected: !state.connected);
|
||||
}
|
||||
}
|
||||
|
||||
final deviceProvider = NotifierProvider<DeviceNotifier, DeviceStatus>(DeviceNotifier.new);
|
||||
135
wei_ai_app/lib/router/app_router.dart
Normal file
135
wei_ai_app/lib/router/app_router.dart
Normal file
@@ -0,0 +1,135 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import '../screens/main/main_screen.dart';
|
||||
import '../screens/discovery/discovery_screen.dart';
|
||||
import '../screens/library/library_screen.dart';
|
||||
import '../screens/control/control_screen.dart';
|
||||
import '../screens/control/free_control_screen.dart';
|
||||
import '../screens/control/pattern_control_screen.dart';
|
||||
import '../screens/profile/profile_screen.dart';
|
||||
import '../screens/profile/settings_screen.dart';
|
||||
import '../screens/profile/topup_screen.dart';
|
||||
import '../screens/profile/device_manager_screen.dart';
|
||||
import '../screens/profile/subscription_screen.dart';
|
||||
import '../screens/profile/privacy_screen.dart';
|
||||
import '../screens/profile/help_screen.dart';
|
||||
import '../screens/interaction/interaction_screen.dart';
|
||||
import '../screens/player/script_player_screen.dart';
|
||||
|
||||
// Private navigators
|
||||
final _rootNavigatorKey = GlobalKey<NavigatorState>();
|
||||
final _shellNavigatorDiscoveryKey = GlobalKey<NavigatorState>(debugLabel: 'shellDiscovery');
|
||||
final _shellNavigatorLibraryKey = GlobalKey<NavigatorState>(debugLabel: 'shellLibrary');
|
||||
final _shellNavigatorControlKey = GlobalKey<NavigatorState>(debugLabel: 'shellControl');
|
||||
final _shellNavigatorProfileKey = GlobalKey<NavigatorState>(debugLabel: 'shellProfile');
|
||||
|
||||
final appRouter = GoRouter(
|
||||
navigatorKey: _rootNavigatorKey,
|
||||
initialLocation: '/discovery',
|
||||
routes: [
|
||||
// Top-level route for Interaction to cover BottomNav
|
||||
GoRoute(
|
||||
path: '/interaction/:characterId',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) {
|
||||
final characterId = state.pathParameters['characterId']!;
|
||||
return InteractionScreen(characterId: characterId);
|
||||
},
|
||||
),
|
||||
// Top-level route for Script Player to cover BottomNav
|
||||
GoRoute(
|
||||
path: '/player/:scenarioId',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) {
|
||||
final scenarioId = state.pathParameters['scenarioId']!;
|
||||
return ScriptPlayerScreen(scenarioId: scenarioId);
|
||||
},
|
||||
),
|
||||
// Top-level route for Free Control to cover BottomNav
|
||||
GoRoute(
|
||||
path: '/control/free',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const FreeControlScreen(),
|
||||
),
|
||||
// Top-level route for Pattern Control to cover BottomNav
|
||||
GoRoute(
|
||||
path: '/control/pattern',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const PatternControlScreen(),
|
||||
),
|
||||
// Profile sub-pages
|
||||
GoRoute(
|
||||
path: '/profile/settings',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const SettingsScreen(),
|
||||
),
|
||||
GoRoute(
|
||||
path: '/profile/topup',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const TopupScreen(),
|
||||
),
|
||||
GoRoute(
|
||||
path: '/profile/device',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const DeviceManagerScreen(),
|
||||
),
|
||||
GoRoute(
|
||||
path: '/profile/subscription',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const SubscriptionScreen(),
|
||||
),
|
||||
GoRoute(
|
||||
path: '/profile/privacy',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const PrivacyScreen(),
|
||||
),
|
||||
GoRoute(
|
||||
path: '/profile/help',
|
||||
parentNavigatorKey: _rootNavigatorKey,
|
||||
builder: (context, state) => const HelpScreen(),
|
||||
),
|
||||
StatefulShellRoute.indexedStack(
|
||||
builder: (context, state, navigationShell) {
|
||||
return MainScreen(navigationShell: navigationShell);
|
||||
},
|
||||
branches: [
|
||||
StatefulShellBranch(
|
||||
navigatorKey: _shellNavigatorDiscoveryKey,
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: '/discovery',
|
||||
builder: (context, state) => const DiscoveryScreen(),
|
||||
),
|
||||
],
|
||||
),
|
||||
StatefulShellBranch(
|
||||
navigatorKey: _shellNavigatorLibraryKey,
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: '/library',
|
||||
builder: (context, state) => const LibraryScreen(),
|
||||
),
|
||||
],
|
||||
),
|
||||
StatefulShellBranch(
|
||||
navigatorKey: _shellNavigatorControlKey,
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: '/control',
|
||||
builder: (context, state) => const ControlScreen(),
|
||||
),
|
||||
],
|
||||
),
|
||||
StatefulShellBranch(
|
||||
navigatorKey: _shellNavigatorProfileKey,
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: '/profile',
|
||||
builder: (context, state) => const ProfileScreen(),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
);
|
||||
315
wei_ai_app/lib/screens/control/control_screen.dart
Normal file
315
wei_ai_app/lib/screens/control/control_screen.dart
Normal file
@@ -0,0 +1,315 @@
|
||||
import 'dart:async';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import '../../widgets/tab_content_layout.dart';
|
||||
|
||||
enum DeviceState { disconnected, connecting, connected }
|
||||
|
||||
class ControlScreen extends StatefulWidget {
|
||||
const ControlScreen({super.key});
|
||||
|
||||
@override
|
||||
State<ControlScreen> createState() => _ControlScreenState();
|
||||
}
|
||||
|
||||
class _ControlScreenState extends State<ControlScreen> {
|
||||
DeviceState _deviceStatus = DeviceState.disconnected;
|
||||
|
||||
void _connectDevice() {
|
||||
setState(() => _deviceStatus = DeviceState.connecting);
|
||||
Future.delayed(const Duration(milliseconds: 1500), () {
|
||||
if (mounted) setState(() => _deviceStatus = DeviceState.connected);
|
||||
});
|
||||
}
|
||||
|
||||
void _disconnectDevice() {
|
||||
setState(() => _deviceStatus = DeviceState.disconnected);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
const double bottomNavHeight = 90;
|
||||
|
||||
return TabContentLayout(
|
||||
child: SingleChildScrollView(
|
||||
padding: EdgeInsets.fromLTRB(16, 8, 16, bottomNavHeight + 20),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// Device Card
|
||||
_DeviceCard(
|
||||
status: _deviceStatus,
|
||||
onConnect: _connectDevice,
|
||||
onDisconnect: _disconnectDevice,
|
||||
),
|
||||
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Mode Selection Title
|
||||
Text(
|
||||
'操控模式',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.4),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// Free Control Button
|
||||
_ModeButton(
|
||||
title: '自由操控',
|
||||
subtitle: '指尖滑动控制 • 实时反馈',
|
||||
icon: LucideIcons.sliders,
|
||||
iconColor: const Color(0xFFC084FC),
|
||||
enabled: _deviceStatus == DeviceState.connected,
|
||||
onTap: () => context.push('/control/free'),
|
||||
),
|
||||
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// Pattern Control Button
|
||||
_ModeButton(
|
||||
title: '波形模式',
|
||||
subtitle: '6种预设震动韵律',
|
||||
icon: LucideIcons.waves,
|
||||
iconColor: const Color(0xFF60A5FA),
|
||||
enabled: _deviceStatus == DeviceState.connected,
|
||||
onTap: () => context.push('/control/pattern'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Device Card Widget
|
||||
class _DeviceCard extends StatelessWidget {
|
||||
final DeviceState status;
|
||||
final VoidCallback onConnect;
|
||||
final VoidCallback onDisconnect;
|
||||
|
||||
const _DeviceCard({
|
||||
required this.status,
|
||||
required this.onConnect,
|
||||
required this.onDisconnect,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.2)),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
// Background Icon
|
||||
Positioned(
|
||||
right: -20,
|
||||
top: -20,
|
||||
child: Icon(
|
||||
LucideIcons.bluetooth,
|
||||
size: 100,
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
),
|
||||
),
|
||||
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
const Text(
|
||||
'Link-X Pro',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
if (status == DeviceState.connected) ...[
|
||||
const SizedBox(width: 8),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFF34D399).withOpacity(0.2),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: const Color(0xFF34D399).withOpacity(0.3)),
|
||||
),
|
||||
child: const Text(
|
||||
'ONLINE',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Color(0xFF34D399),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
status == DeviceState.disconnected
|
||||
? '设备未连接'
|
||||
: status == DeviceState.connecting
|
||||
? '正在搜索信号...'
|
||||
: 'ID: 884-X9-01',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white.withOpacity(0.6),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
// Connect Button
|
||||
GestureDetector(
|
||||
onTap: status == DeviceState.connected ? onDisconnect : onConnect,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
|
||||
decoration: BoxDecoration(
|
||||
color: status == DeviceState.connected
|
||||
? Colors.white.withOpacity(0.1)
|
||||
: status == DeviceState.connecting
|
||||
? Colors.white.withOpacity(0.2)
|
||||
: Colors.white,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: status == DeviceState.connected
|
||||
? Border.all(color: Colors.white.withOpacity(0.1))
|
||||
: null,
|
||||
),
|
||||
child: Text(
|
||||
status == DeviceState.connected
|
||||
? '断开'
|
||||
: status == DeviceState.connecting
|
||||
? '连接中'
|
||||
: '连接设备',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: status == DeviceState.connected
|
||||
? Colors.white.withOpacity(0.7)
|
||||
: const Color(0xFF2E1065),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
// Battery Info
|
||||
if (status == DeviceState.connected) ...[
|
||||
const SizedBox(height: 16),
|
||||
Row(
|
||||
children: [
|
||||
const Icon(LucideIcons.battery, size: 16, color: Color(0xFF34D399)),
|
||||
const SizedBox(width: 8),
|
||||
const Text(
|
||||
'85%',
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Mode Button Widget
|
||||
class _ModeButton extends StatelessWidget {
|
||||
final String title;
|
||||
final String subtitle;
|
||||
final IconData icon;
|
||||
final Color iconColor;
|
||||
final bool enabled;
|
||||
final VoidCallback onTap;
|
||||
|
||||
const _ModeButton({
|
||||
required this.title,
|
||||
required this.subtitle,
|
||||
required this.icon,
|
||||
required this.iconColor,
|
||||
required this.enabled,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: enabled ? onTap : null,
|
||||
child: AnimatedOpacity(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
opacity: enabled ? 1.0 : 0.5,
|
||||
child: Container(
|
||||
height: 120,
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(enabled ? 0.1 : 0.05),
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
border: Border.all(
|
||||
color: Colors.white.withOpacity(enabled ? 0.2 : 0.05),
|
||||
),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
width: 56,
|
||||
height: 56,
|
||||
decoration: BoxDecoration(
|
||||
color: iconColor.withOpacity(0.2),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(icon, size: 28, color: iconColor),
|
||||
),
|
||||
const SizedBox(width: 20),
|
||||
Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
title,
|
||||
style: const TextStyle(
|
||||
fontSize: 20,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
subtitle,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: Colors.white.withOpacity(0.5),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
205
wei_ai_app/lib/screens/control/free_control_screen.dart
Normal file
205
wei_ai_app/lib/screens/control/free_control_screen.dart
Normal file
@@ -0,0 +1,205 @@
|
||||
import 'dart:async';
|
||||
import 'dart:math';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class FreeControlScreen extends StatefulWidget {
|
||||
const FreeControlScreen({super.key});
|
||||
|
||||
@override
|
||||
State<FreeControlScreen> createState() => _FreeControlScreenState();
|
||||
}
|
||||
|
||||
class _FreeControlScreenState extends State<FreeControlScreen> {
|
||||
double _intensity = 0;
|
||||
bool _isClimax = false;
|
||||
|
||||
void _handleInteraction(Offset localPosition, double height) {
|
||||
final relativeY = 1 - (localPosition.dy / height).clamp(0.0, 1.0);
|
||||
setState(() => _intensity = (relativeY * 100).roundToDouble());
|
||||
}
|
||||
|
||||
void _handleClimax() {
|
||||
if (_isClimax) return;
|
||||
setState(() {
|
||||
_isClimax = true;
|
||||
_intensity = 100;
|
||||
});
|
||||
HapticFeedback.heavyImpact();
|
||||
Future.delayed(const Duration(seconds: 3), () {
|
||||
if (mounted) {
|
||||
setState(() {
|
||||
_isClimax = false;
|
||||
_intensity = 20;
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
// Header
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const Text(
|
||||
'自由操控',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Control Area
|
||||
Expanded(
|
||||
child: Center(
|
||||
child: LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final controlHeight = constraints.maxHeight * 0.65;
|
||||
return Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
GestureDetector(
|
||||
onPanUpdate: (details) {
|
||||
_handleInteraction(details.localPosition, controlHeight);
|
||||
},
|
||||
onTapDown: (details) {
|
||||
_handleInteraction(details.localPosition, controlHeight);
|
||||
},
|
||||
child: Container(
|
||||
width: 180,
|
||||
height: controlHeight,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(32),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.2)),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
// Fill Level
|
||||
Align(
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 50),
|
||||
width: double.infinity,
|
||||
height: controlHeight * (_intensity / 100),
|
||||
decoration: BoxDecoration(
|
||||
color: _isClimax
|
||||
? Colors.red.withOpacity(0.5)
|
||||
: const Color(0xFFC084FC).withOpacity(0.5),
|
||||
borderRadius: BorderRadius.circular(32),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Labels
|
||||
Column(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 16),
|
||||
child: Text(
|
||||
'MAX',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white.withOpacity(0.4),
|
||||
),
|
||||
),
|
||||
),
|
||||
Center(
|
||||
child: Text(
|
||||
_intensity.toInt().toString(),
|
||||
style: TextStyle(
|
||||
fontSize: 48,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'monospace',
|
||||
color: _isClimax ? Colors.red[200] : Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(bottom: 16),
|
||||
child: Text(
|
||||
'OFF',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white.withOpacity(0.4),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
'上下滑动触控板以控制强度',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontFamily: 'monospace',
|
||||
letterSpacing: 1,
|
||||
color: Colors.white.withOpacity(0.6),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Climax Button
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(24, 0, 24, 40),
|
||||
child: GestureDetector(
|
||||
onTap: _handleClimax,
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 18),
|
||||
decoration: BoxDecoration(
|
||||
color: _isClimax ? Colors.red : Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(
|
||||
color: _isClimax ? Colors.red : Colors.red.withOpacity(0.5),
|
||||
),
|
||||
),
|
||||
child: Center(
|
||||
child: Text(
|
||||
_isClimax ? 'MAX OUTPUT...' : '一键爆发',
|
||||
style: TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 2,
|
||||
color: _isClimax ? Colors.white : Colors.red[300],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
264
wei_ai_app/lib/screens/control/pattern_control_screen.dart
Normal file
264
wei_ai_app/lib/screens/control/pattern_control_screen.dart
Normal file
@@ -0,0 +1,264 @@
|
||||
import 'dart:async';
|
||||
import 'dart:math';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter/services.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import 'package:fl_chart/fl_chart.dart';
|
||||
|
||||
class PatternControlScreen extends StatefulWidget {
|
||||
const PatternControlScreen({super.key});
|
||||
|
||||
@override
|
||||
State<PatternControlScreen> createState() => _PatternControlScreenState();
|
||||
}
|
||||
|
||||
class _PatternControlScreenState extends State<PatternControlScreen> {
|
||||
String? _activePattern;
|
||||
double _globalIntensity = 50;
|
||||
List<FlSpot> _waveData = List.generate(20, (i) => FlSpot(i.toDouble(), 10));
|
||||
Timer? _waveTimer;
|
||||
|
||||
static const List<Map<String, dynamic>> _patterns = [
|
||||
{'id': 'pulse', 'name': '脉冲跳动', 'icon': LucideIcons.activity, 'color': Color(0xFFC084FC)},
|
||||
{'id': 'wave', 'name': '深海潮汐', 'icon': LucideIcons.waves, 'color': Color(0xFF60A5FA)},
|
||||
{'id': 'climb', 'name': '登峰造极', 'icon': LucideIcons.rotateCw, 'color': Color(0xFF34D399)},
|
||||
{'id': 'storm', 'name': '雷雨风暴', 'icon': LucideIcons.zap, 'color': Color(0xFFFBBF24)},
|
||||
{'id': 'chaos', 'name': '随机漫步', 'icon': LucideIcons.sliders, 'color': Color(0xFFF472B6)},
|
||||
{'id': 'sos', 'name': 'SOS', 'icon': LucideIcons.power, 'color': Color(0xFFF87171)},
|
||||
];
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_startWaveAnimation();
|
||||
}
|
||||
|
||||
void _startWaveAnimation() {
|
||||
_waveTimer?.cancel();
|
||||
_waveTimer = Timer.periodic(const Duration(milliseconds: 100), (_) {
|
||||
if (!mounted) return;
|
||||
setState(() {
|
||||
final random = Random();
|
||||
_waveData = [
|
||||
..._waveData.sublist(1),
|
||||
FlSpot(
|
||||
19,
|
||||
_activePattern != null
|
||||
? random.nextDouble() * _globalIntensity + 20
|
||||
: 10,
|
||||
),
|
||||
];
|
||||
// Update x coordinates
|
||||
for (int i = 0; i < _waveData.length; i++) {
|
||||
_waveData[i] = FlSpot(i.toDouble(), _waveData[i].y);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_waveTimer?.cancel();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
// Header
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const Text(
|
||||
'波形控制',
|
||||
style: TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Wave Chart
|
||||
Container(
|
||||
height: 140,
|
||||
margin: const EdgeInsets.symmetric(horizontal: 16),
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: LineChart(
|
||||
LineChartData(
|
||||
gridData: const FlGridData(show: false),
|
||||
titlesData: const FlTitlesData(show: false),
|
||||
borderData: FlBorderData(show: false),
|
||||
minX: 0,
|
||||
maxX: 19,
|
||||
minY: 0,
|
||||
maxY: 100,
|
||||
lineBarsData: [
|
||||
LineChartBarData(
|
||||
spots: _waveData,
|
||||
isCurved: true,
|
||||
curveSmoothness: 0.3,
|
||||
color: const Color(0xFFE9D5FF),
|
||||
barWidth: 3,
|
||||
isStrokeCapRound: true,
|
||||
dotData: const FlDotData(show: false),
|
||||
belowBarData: BarAreaData(
|
||||
show: true,
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [
|
||||
const Color(0xFFC084FC).withOpacity(0.6),
|
||||
const Color(0xFFC084FC).withOpacity(0),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
lineTouchData: const LineTouchData(enabled: false),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// Intensity Slider
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(
|
||||
'强度',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.6),
|
||||
),
|
||||
),
|
||||
Text(
|
||||
'${_globalIntensity.toInt()}%',
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.6),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
SliderTheme(
|
||||
data: SliderThemeData(
|
||||
trackHeight: 8,
|
||||
thumbShape: const RoundSliderThumbShape(enabledThumbRadius: 10),
|
||||
overlayShape: const RoundSliderOverlayShape(overlayRadius: 20),
|
||||
activeTrackColor: const Color(0xFFC084FC),
|
||||
inactiveTrackColor: Colors.white.withOpacity(0.2),
|
||||
thumbColor: Colors.white,
|
||||
),
|
||||
child: Slider(
|
||||
value: _globalIntensity,
|
||||
min: 0,
|
||||
max: 100,
|
||||
onChanged: (value) => setState(() => _globalIntensity = value),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// Pattern Grid
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: GridView.builder(
|
||||
padding: const EdgeInsets.only(bottom: 24),
|
||||
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 2,
|
||||
crossAxisSpacing: 12,
|
||||
mainAxisSpacing: 12,
|
||||
childAspectRatio: 1.5,
|
||||
),
|
||||
itemCount: _patterns.length,
|
||||
itemBuilder: (context, index) {
|
||||
final pattern = _patterns[index];
|
||||
final isActive = _activePattern == pattern['id'];
|
||||
|
||||
return GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_activePattern = isActive ? null : pattern['id'] as String;
|
||||
});
|
||||
HapticFeedback.selectionClick();
|
||||
},
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
decoration: BoxDecoration(
|
||||
color: isActive ? Colors.white : Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(
|
||||
color: isActive ? Colors.white : Colors.white.withOpacity(0.1),
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(8),
|
||||
decoration: BoxDecoration(
|
||||
color: isActive
|
||||
? const Color(0xFF2E1065).withOpacity(0.1)
|
||||
: Colors.white.withOpacity(0.05),
|
||||
shape: BoxShape.circle,
|
||||
),
|
||||
child: Icon(
|
||||
pattern['icon'] as IconData,
|
||||
size: 18,
|
||||
color: isActive
|
||||
? const Color(0xFF2E1065)
|
||||
: pattern['color'] as Color,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
pattern['name'] as String,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: isActive ? const Color(0xFF2E1065) : Colors.white.withOpacity(0.6),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
306
wei_ai_app/lib/screens/discovery/discovery_screen.dart
Normal file
306
wei_ai_app/lib/screens/discovery/discovery_screen.dart
Normal file
@@ -0,0 +1,306 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_animate/flutter_animate.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import '../../data/mock_data.dart';
|
||||
import '../../models/character.dart';
|
||||
import '../../widgets/tab_content_layout.dart';
|
||||
|
||||
class DiscoveryScreen extends StatefulWidget {
|
||||
const DiscoveryScreen({super.key});
|
||||
|
||||
@override
|
||||
State<DiscoveryScreen> createState() => _DiscoveryScreenState();
|
||||
}
|
||||
|
||||
class _DiscoveryScreenState extends State<DiscoveryScreen> {
|
||||
String _activeFilter = 'all';
|
||||
|
||||
final List<Map<String, String>> _filters = [
|
||||
{'id': 'all', 'label': '全部'},
|
||||
{'id': 'gentle', 'label': '温柔治愈'},
|
||||
{'id': 'dom', 'label': '主导强势'},
|
||||
{'id': 'wild', 'label': '反差/猎奇'},
|
||||
{'id': 'voice', 'label': '语音陪聊'},
|
||||
{'id': 'scenario', 'label': '场景扮演'},
|
||||
{'id': 'exclusive', 'label': '会员限定'},
|
||||
];
|
||||
|
||||
List<Character> get _filteredCharacters {
|
||||
if (_activeFilter == 'all') return mockCharacters;
|
||||
return mockCharacters.where((c) {
|
||||
final tags = c.tags.join('');
|
||||
if (_activeFilter == 'gentle') return tags.contains('治愈') || tags.contains('温顺') || tags.contains('医疗');
|
||||
if (_activeFilter == 'dom') return tags.contains('强势') || tags.contains('调教') || tags.contains('指令');
|
||||
if (_activeFilter == 'wild') return tags.contains('病娇') || tags.contains('神秘') || tags.contains('不稳定') || tags.contains('极乐');
|
||||
if (_activeFilter == 'exclusive') return c.isLocked;
|
||||
return false;
|
||||
}).toList();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
const double bottomNavHeight = 90;
|
||||
|
||||
return TabContentLayout(
|
||||
child: Column(
|
||||
children: [
|
||||
// 1. Sticky Filter Bar (simulated)
|
||||
SizedBox(
|
||||
height: 50,
|
||||
child: ListView.separated(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemCount: _filters.length,
|
||||
separatorBuilder: (_, __) => const SizedBox(width: 12),
|
||||
itemBuilder: (context, index) {
|
||||
final filter = _filters[index];
|
||||
final isActive = _activeFilter == filter['id'];
|
||||
return Center(
|
||||
child: GestureDetector(
|
||||
onTap: () => setState(() => _activeFilter = filter['id']!),
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
|
||||
decoration: BoxDecoration(
|
||||
color: isActive ? Colors.white : Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(
|
||||
color: isActive ? Colors.white : Colors.white.withOpacity(0.1),
|
||||
),
|
||||
),
|
||||
child: Text(
|
||||
filter['label']!,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: isActive ? FontWeight.bold : FontWeight.normal,
|
||||
color: isActive ? const Color(0xFF2E1065) : Colors.white.withOpacity(0.7),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
|
||||
// 2. Grid Layout
|
||||
Expanded(
|
||||
child: _filteredCharacters.isEmpty
|
||||
? Center(child: Text('暂无匹配角色', style: TextStyle(color: Colors.white.withOpacity(0.5))))
|
||||
: GridView.builder(
|
||||
padding: const EdgeInsets.fromLTRB(16, 16, 16, bottomNavHeight + 20),
|
||||
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 2,
|
||||
childAspectRatio: 3 / 4,
|
||||
crossAxisSpacing: 16,
|
||||
mainAxisSpacing: 16,
|
||||
),
|
||||
itemCount: _filteredCharacters.length,
|
||||
itemBuilder: (context, index) {
|
||||
final char = _filteredCharacters[index];
|
||||
return _CharacterCard(
|
||||
character: char,
|
||||
onTap: () {
|
||||
if (!char.isLocked) {
|
||||
context.push('/interaction/${char.id}');
|
||||
}
|
||||
},
|
||||
)
|
||||
.animate()
|
||||
.fadeIn(duration: 400.ms, delay: (index * 100).ms)
|
||||
.scale(begin: const Offset(0.9, 0.9));
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _CharacterCard extends StatelessWidget {
|
||||
final Character character;
|
||||
final VoidCallback onTap;
|
||||
|
||||
const _CharacterCard({
|
||||
required this.character,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.3),
|
||||
blurRadius: 15,
|
||||
offset: const Offset(0, 6),
|
||||
),
|
||||
BoxShadow(
|
||||
color: const Color(0xFFA855F7).withOpacity(0.1),
|
||||
blurRadius: 20,
|
||||
offset: const Offset(0, 0),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
// Clipped content area - ensures all elements respect border radius
|
||||
ClipRRect(
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
// Background Image
|
||||
Image.network(
|
||||
character.avatar,
|
||||
fit: BoxFit.cover,
|
||||
loadingBuilder: (context, child, loadingProgress) {
|
||||
if (loadingProgress == null) return child;
|
||||
return Container(
|
||||
color: Colors.black26,
|
||||
child: const Center(child: CircularProgressIndicator(strokeWidth: 2)),
|
||||
);
|
||||
},
|
||||
),
|
||||
|
||||
// Gradient Overlay
|
||||
Container(
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [
|
||||
Colors.transparent,
|
||||
Colors.transparent,
|
||||
Color(0xFF2E1065), // Deep purple at bottom
|
||||
],
|
||||
stops: [0.0, 0.5, 1.0],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Top Left: Popularity/Compatibility Badge
|
||||
if (!character.isLocked)
|
||||
Positioned(
|
||||
top: 12,
|
||||
left: 12,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.black.withOpacity(0.4),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(LucideIcons.flame, size: 12, color: Color(0xFFF472B6)),
|
||||
const SizedBox(width: 4),
|
||||
Text(
|
||||
'${character.compatibility}%',
|
||||
style: const TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Top Right: Lock Icon
|
||||
if (character.isLocked)
|
||||
Positioned(
|
||||
top: 12,
|
||||
right: 12,
|
||||
child: Container(
|
||||
width: 32,
|
||||
height: 32,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.black.withOpacity(0.4),
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(color: Colors.white.withOpacity(0.2)),
|
||||
),
|
||||
child: const Icon(LucideIcons.lock, size: 14, color: Colors.white70),
|
||||
),
|
||||
),
|
||||
|
||||
// Bottom Content
|
||||
Positioned(
|
||||
bottom: 0,
|
||||
left: 0,
|
||||
right: 0,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Text(
|
||||
character.name,
|
||||
style: const TextStyle(
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
shadows: [Shadow(color: Colors.black45, blurRadius: 2, offset: Offset(0, 1))],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Wrap(
|
||||
spacing: 4,
|
||||
runSpacing: 4,
|
||||
children: character.tags.take(2).map((tag) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.12),
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
border: Border.all(
|
||||
color: Colors.white.withOpacity(0.25),
|
||||
width: 0.8,
|
||||
),
|
||||
),
|
||||
child: Text(
|
||||
tag,
|
||||
style: const TextStyle(fontSize: 10, color: Colors.white),
|
||||
),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Border Overlay - Outside ClipRRect to ensure full visibility
|
||||
Positioned.fill(
|
||||
child: IgnorePointer(
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
border: Border.all(
|
||||
color: Colors.white.withOpacity(0.15),
|
||||
width: 1.2,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
231
wei_ai_app/lib/screens/interaction/interaction_screen.dart
Normal file
231
wei_ai_app/lib/screens/interaction/interaction_screen.dart
Normal file
@@ -0,0 +1,231 @@
|
||||
import 'dart:ui';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import '../../models/character.dart';
|
||||
import '../../models/message.dart';
|
||||
import '../../data/mock_data.dart';
|
||||
import 'voice_mode_overlay.dart';
|
||||
|
||||
class InteractionScreen extends StatefulWidget {
|
||||
final String characterId;
|
||||
|
||||
const InteractionScreen({super.key, required this.characterId});
|
||||
|
||||
@override
|
||||
State<InteractionScreen> createState() => _InteractionScreenState();
|
||||
}
|
||||
|
||||
class _InteractionScreenState extends State<InteractionScreen> {
|
||||
late Character _character;
|
||||
final List<Message> _messages = List.from(mockMessages);
|
||||
final TextEditingController _controller = TextEditingController();
|
||||
bool _isVoiceMode = false;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_character = mockCharacters.firstWhere(
|
||||
(c) => c.id == widget.characterId,
|
||||
orElse: () => mockCharacters.first,
|
||||
);
|
||||
}
|
||||
|
||||
void _sendMessage() {
|
||||
if (_controller.text.trim().isEmpty) return;
|
||||
|
||||
final newUserMsg = Message(
|
||||
id: DateTime.now().toString(),
|
||||
text: _controller.text,
|
||||
sender: MessageSender.user,
|
||||
type: MessageType.text,
|
||||
timestamp: DateTime.now()
|
||||
);
|
||||
|
||||
setState(() {
|
||||
_messages.add(newUserMsg);
|
||||
_controller.clear();
|
||||
});
|
||||
|
||||
// Mock AI Reply
|
||||
Future.delayed(const Duration(seconds: 2), () {
|
||||
if (!mounted) return;
|
||||
final newAiMsg = Message(
|
||||
id: DateTime.now().toString(),
|
||||
text: '我收到了你的信号: "${newUserMsg.text}"。这让我感觉很好...',
|
||||
sender: MessageSender.ai,
|
||||
type: MessageType.text,
|
||||
timestamp: DateTime.now()
|
||||
);
|
||||
setState(() {
|
||||
_messages.add(newAiMsg);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Stack(
|
||||
children: [
|
||||
Scaffold(
|
||||
extendBodyBehindAppBar: true,
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.transparent,
|
||||
elevation: 0,
|
||||
flexibleSpace: ClipRRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
|
||||
child: Container(color: Colors.black.withOpacity(0.5)),
|
||||
),
|
||||
),
|
||||
leading: IconButton(
|
||||
icon: const Icon(LucideIcons.arrowLeft, color: Colors.white),
|
||||
onPressed: () => context.pop(),
|
||||
),
|
||||
title: Row(
|
||||
children: [
|
||||
CircleAvatar(
|
||||
backgroundImage: NetworkImage(_character.avatar),
|
||||
radius: 16,
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(_character.name, style: const TextStyle(fontSize: 16, color: Colors.white)),
|
||||
Row(
|
||||
children: [
|
||||
Container(width: 6, height: 6, decoration: const BoxDecoration(color: Color(0xFF10B981), shape: BoxShape.circle)),
|
||||
const SizedBox(width: 4),
|
||||
Text('Online', style: TextStyle(fontSize: 10, color: Colors.white.withOpacity(0.7))),
|
||||
],
|
||||
)
|
||||
],
|
||||
)
|
||||
],
|
||||
),
|
||||
actions: [
|
||||
IconButton(icon: const Icon(LucideIcons.moreVertical, color: Colors.white), onPressed: () {}),
|
||||
],
|
||||
),
|
||||
body: Container(
|
||||
decoration: const BoxDecoration(
|
||||
color: Color(0xFF2E1065),
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [Color(0xFF2E1065), Color(0xFF0F172A)],
|
||||
)
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Expanded(
|
||||
child: ListView.separated(
|
||||
padding: const EdgeInsets.only(top: 120, bottom: 20, left: 16, right: 16),
|
||||
itemCount: _messages.length,
|
||||
separatorBuilder: (_, __) => const SizedBox(height: 16),
|
||||
itemBuilder: (context, index) {
|
||||
final msg = _messages[index];
|
||||
final isMe = msg.sender == MessageSender.user;
|
||||
return Align(
|
||||
alignment: isMe ? Alignment.centerRight : Alignment.centerLeft,
|
||||
child: Container(
|
||||
constraints: BoxConstraints(maxWidth: MediaQuery.of(context).size.width * 0.75),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: isMe ? const Color(0xFFA855F7) : Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.only(
|
||||
topLeft: const Radius.circular(16),
|
||||
topRight: const Radius.circular(16),
|
||||
bottomLeft: isMe ? const Radius.circular(16) : const Radius.circular(2),
|
||||
bottomRight: isMe ? const Radius.circular(2) : const Radius.circular(16),
|
||||
),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Text(
|
||||
msg.text,
|
||||
style: const TextStyle(color: Colors.white, fontSize: 14, height: 1.4),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
|
||||
// Input Area
|
||||
ClipRRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||
child: Container(
|
||||
padding: EdgeInsets.only(
|
||||
bottom: MediaQuery.of(context).padding.bottom + 10,
|
||||
top: 10,
|
||||
left: 16,
|
||||
right: 16
|
||||
),
|
||||
color: Colors.black.withOpacity(0.4),
|
||||
child: Row(
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: () => setState(() => _isVoiceMode = true),
|
||||
child: Container(
|
||||
width: 44,
|
||||
height: 44,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1))
|
||||
),
|
||||
child: const Icon(LucideIcons.phone, color: Colors.white, size: 20),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: TextField(
|
||||
controller: _controller,
|
||||
style: const TextStyle(color: Colors.white),
|
||||
decoration: InputDecoration(
|
||||
filled: true,
|
||||
fillColor: Colors.white.withOpacity(0.05),
|
||||
hintText: 'Type a message...',
|
||||
hintStyle: TextStyle(color: Colors.white.withOpacity(0.3)),
|
||||
border: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
borderSide: BorderSide.none,
|
||||
),
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
GestureDetector(
|
||||
onTap: _sendMessage,
|
||||
child: Container(
|
||||
width: 44,
|
||||
height: 44,
|
||||
decoration: const BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
gradient: LinearGradient(colors: [Color(0xFFA855F7), Color(0xFFEC4899)])
|
||||
),
|
||||
child: const Icon(LucideIcons.send, color: Colors.white, size: 20),
|
||||
),
|
||||
)
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
)
|
||||
],
|
||||
), // Column
|
||||
), // Container
|
||||
), // Scaffold
|
||||
|
||||
if (_isVoiceMode)
|
||||
VoiceModeOverlay(
|
||||
character: _character,
|
||||
onClose: () => setState(() => _isVoiceMode = false),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
263
wei_ai_app/lib/screens/interaction/voice_mode_overlay.dart
Normal file
263
wei_ai_app/lib/screens/interaction/voice_mode_overlay.dart
Normal file
@@ -0,0 +1,263 @@
|
||||
|
||||
import 'dart:ui';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import '../../models/character.dart';
|
||||
|
||||
class VoiceModeOverlay extends StatefulWidget {
|
||||
final Character character;
|
||||
final VoidCallback onClose;
|
||||
|
||||
const VoiceModeOverlay({
|
||||
super.key,
|
||||
required this.character,
|
||||
required this.onClose,
|
||||
});
|
||||
|
||||
@override
|
||||
State<VoiceModeOverlay> createState() => _VoiceModeOverlayState();
|
||||
}
|
||||
|
||||
class _VoiceModeOverlayState extends State<VoiceModeOverlay> with SingleTickerProviderStateMixin {
|
||||
bool _isMicMuted = false;
|
||||
bool _isSpeakerOn = true;
|
||||
late AnimationController _controller;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_controller = AnimationController(
|
||||
vsync: this, duration: const Duration(seconds: 2))
|
||||
..repeat(reverse: true);
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_controller.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Positioned.fill(
|
||||
child: Material(
|
||||
type: MaterialType.transparency,
|
||||
child: Container(
|
||||
color: const Color(0xFF2E1065),
|
||||
child: Stack(
|
||||
children: [
|
||||
// Background Image with Blur
|
||||
Positioned.fill(
|
||||
child: Image.network(
|
||||
widget.character.avatar,
|
||||
fit: BoxFit.cover,
|
||||
errorBuilder: (context, error, stackTrace) {
|
||||
return Container(color: const Color(0xFF2E1065));
|
||||
},
|
||||
),
|
||||
),
|
||||
Positioned.fill(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||
child: Container(
|
||||
color: const Color(0xFF2E1065).withOpacity(0.8),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Main Content
|
||||
SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
// Header
|
||||
Padding(
|
||||
padding: const EdgeInsets.all(16.0),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: widget.onClose,
|
||||
icon: const Icon(LucideIcons.chevronLeft, color: Colors.white70),
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: Colors.white.withOpacity(0.1),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const Spacer(),
|
||||
|
||||
// Character Info & Status
|
||||
Column(
|
||||
children: [
|
||||
Text(
|
||||
widget.character.name,
|
||||
style: const TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
_isMicMuted ? 'Mic Muted' : 'Listening...',
|
||||
style: TextStyle(
|
||||
color: Colors.white.withOpacity(0.6),
|
||||
fontSize: 12,
|
||||
letterSpacing: 2,
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
const SizedBox(height: 48),
|
||||
|
||||
// Avatar pulsing animation
|
||||
SizedBox(
|
||||
width: 200,
|
||||
height: 200,
|
||||
child: Stack(
|
||||
alignment: Alignment.center,
|
||||
children: [
|
||||
if (!_isMicMuted)
|
||||
AnimatedBuilder(
|
||||
animation: _controller,
|
||||
builder: (context, child) {
|
||||
return Container(
|
||||
width: 200 * (0.8 + 0.2 * _controller.value),
|
||||
height: 200 * (0.8 + 0.2 * _controller.value),
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(
|
||||
color: Colors.white.withOpacity(0.2 * (1 - _controller.value)),
|
||||
width: 1,
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
Container(
|
||||
width: 160,
|
||||
height: 160,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(color: Colors.white.withOpacity(0.3), width: 2),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: const Color(0xFFC084FC).withOpacity(0.5),
|
||||
blurRadius: 30,
|
||||
spreadRadius: 0
|
||||
)
|
||||
],
|
||||
image: DecorationImage(
|
||||
image: NetworkImage(widget.character.avatar),
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const Spacer(),
|
||||
|
||||
// Waveform (Simulated)
|
||||
SizedBox(
|
||||
height: 32,
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: List.generate(5, (index) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 2.0),
|
||||
child: AnimatedBuilder(
|
||||
animation: _controller,
|
||||
builder: (context, child) {
|
||||
return Container(
|
||||
width: 4,
|
||||
height: _isMicMuted
|
||||
? 4
|
||||
: 10 + (20 * (index % 2 == 0 ? _controller.value : 1 - _controller.value)),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(_isMicMuted ? 0.2 : 0.8),
|
||||
borderRadius: BorderRadius.circular(2),
|
||||
),
|
||||
);
|
||||
}
|
||||
),
|
||||
);
|
||||
}),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 48),
|
||||
|
||||
// Bottom Controls
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 48.0, vertical: 32.0),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
// Mic Toggle
|
||||
IconButton(
|
||||
onPressed: () => setState(() => _isMicMuted = !_isMicMuted),
|
||||
icon: Icon(_isMicMuted ? LucideIcons.micOff : LucideIcons.mic),
|
||||
iconSize: 24,
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: _isMicMuted
|
||||
? Colors.white
|
||||
: Colors.white.withOpacity(0.1),
|
||||
foregroundColor: _isMicMuted
|
||||
? const Color(0xFF2E1065)
|
||||
: Colors.white,
|
||||
padding: const EdgeInsets.all(16),
|
||||
minimumSize: const Size(64, 64),
|
||||
),
|
||||
),
|
||||
|
||||
// End Call
|
||||
IconButton(
|
||||
onPressed: widget.onClose,
|
||||
icon: const Icon(LucideIcons.phoneOff),
|
||||
iconSize: 32,
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: Colors.red,
|
||||
foregroundColor: Colors.white,
|
||||
padding: const EdgeInsets.all(20),
|
||||
minimumSize: const Size(80, 80),
|
||||
),
|
||||
),
|
||||
|
||||
// Speaker Toggle
|
||||
IconButton(
|
||||
onPressed: () => setState(() => _isSpeakerOn = !_isSpeakerOn),
|
||||
icon: Icon(
|
||||
_isSpeakerOn ? LucideIcons.volume2 : LucideIcons.volumeX
|
||||
),
|
||||
iconSize: 24,
|
||||
style: IconButton.styleFrom(
|
||||
backgroundColor: _isSpeakerOn
|
||||
? Colors.white.withOpacity(0.1)
|
||||
: Colors.white.withOpacity(0.05),
|
||||
foregroundColor: _isSpeakerOn
|
||||
? Colors.white
|
||||
: Colors.white.withOpacity(0.5),
|
||||
padding: const EdgeInsets.all(16),
|
||||
minimumSize: const Size(64, 64),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
325
wei_ai_app/lib/screens/library/library_screen.dart
Normal file
325
wei_ai_app/lib/screens/library/library_screen.dart
Normal file
@@ -0,0 +1,325 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_animate/flutter_animate.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import '../../data/mock_data.dart';
|
||||
import '../../models/scenario.dart';
|
||||
import '../../widgets/tab_content_layout.dart';
|
||||
|
||||
class LibraryScreen extends StatefulWidget {
|
||||
const LibraryScreen({super.key});
|
||||
|
||||
@override
|
||||
State<LibraryScreen> createState() => _LibraryScreenState();
|
||||
}
|
||||
|
||||
class _LibraryScreenState extends State<LibraryScreen> {
|
||||
String _activeCategory = '全部';
|
||||
|
||||
final List<String> _categories = ['全部', '职场', '邻家', '科幻', 'ASMR'];
|
||||
|
||||
List<Scenario> get _filteredScenarios {
|
||||
if (_activeCategory == '全部') return mockScenarios;
|
||||
return mockScenarios.where((s) =>
|
||||
s.category == _activeCategory || s.tags.contains(_activeCategory)
|
||||
).toList();
|
||||
}
|
||||
|
||||
Color _getIntensityColor(String intensity) {
|
||||
switch (intensity) {
|
||||
case 'Low':
|
||||
return const Color(0xFF34D399); // Emerald
|
||||
case 'Medium':
|
||||
return const Color(0xFF60A5FA); // Blue
|
||||
case 'High':
|
||||
return const Color(0xFFFBBF24); // Amber
|
||||
case 'Extreme':
|
||||
return const Color(0xFFF472B6); // Pink
|
||||
default:
|
||||
return Colors.white.withOpacity(0.5);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
const double bottomNavHeight = 90;
|
||||
|
||||
return TabContentLayout(
|
||||
child: Column(
|
||||
children: [
|
||||
// Filter Bar
|
||||
SizedBox(
|
||||
height: 50,
|
||||
child: ListView.separated(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemCount: _categories.length,
|
||||
separatorBuilder: (_, __) => const SizedBox(width: 12),
|
||||
itemBuilder: (context, index) {
|
||||
final category = _categories[index];
|
||||
final isActive = _activeCategory == category;
|
||||
return Center(
|
||||
child: GestureDetector(
|
||||
onTap: () => setState(() => _activeCategory = category),
|
||||
child: AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 300),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 6),
|
||||
decoration: BoxDecoration(
|
||||
gradient: isActive
|
||||
? const LinearGradient(
|
||||
colors: [Color(0xFFC084FC), Color(0xFFF472B6)],
|
||||
)
|
||||
: null,
|
||||
color: isActive ? null : Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(
|
||||
color: isActive ? Colors.transparent : Colors.white.withOpacity(0.1),
|
||||
),
|
||||
boxShadow: isActive
|
||||
? [
|
||||
BoxShadow(
|
||||
color: const Color(0xFFC084FC).withOpacity(0.4),
|
||||
blurRadius: 15,
|
||||
),
|
||||
]
|
||||
: null,
|
||||
),
|
||||
child: Text(
|
||||
category,
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: isActive ? FontWeight.bold : FontWeight.normal,
|
||||
color: isActive ? Colors.white : Colors.white.withOpacity(0.7),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
|
||||
// Scenario List
|
||||
Expanded(
|
||||
child: _filteredScenarios.isEmpty
|
||||
? Center(
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(LucideIcons.activity, size: 32, color: Colors.white.withOpacity(0.5)),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'暂无相关剧本',
|
||||
style: TextStyle(fontSize: 12, color: Colors.white.withOpacity(0.5)),
|
||||
),
|
||||
],
|
||||
),
|
||||
)
|
||||
: ListView.builder(
|
||||
padding: EdgeInsets.fromLTRB(16, 8, 16, bottomNavHeight + 20),
|
||||
itemCount: _filteredScenarios.length,
|
||||
itemBuilder: (context, index) {
|
||||
final scenario = _filteredScenarios[index];
|
||||
return _ScenarioCard(
|
||||
scenario: scenario,
|
||||
intensityColor: _getIntensityColor(scenario.intensity),
|
||||
onTap: () {
|
||||
if (!scenario.isLocked) {
|
||||
context.push('/player/${scenario.id}');
|
||||
} else {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
const SnackBar(
|
||||
content: Text('需要积分解锁此高级内容'),
|
||||
backgroundColor: Color(0xFF4C1D95),
|
||||
),
|
||||
);
|
||||
}
|
||||
},
|
||||
)
|
||||
.animate()
|
||||
.fadeIn(duration: 400.ms, delay: (index * 80).ms)
|
||||
.slideX(begin: 0.05, end: 0);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ScenarioCard extends StatelessWidget {
|
||||
final Scenario scenario;
|
||||
final Color intensityColor;
|
||||
final VoidCallback onTap;
|
||||
|
||||
const _ScenarioCard({
|
||||
required this.scenario,
|
||||
required this.intensityColor,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
margin: const EdgeInsets.only(bottom: 12),
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFF4C1D95).withOpacity(0.2),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
// Left: Thumbnail
|
||||
Container(
|
||||
width: 80,
|
||||
height: 80,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.black.withOpacity(0.3),
|
||||
blurRadius: 8,
|
||||
offset: const Offset(0, 2),
|
||||
),
|
||||
],
|
||||
),
|
||||
clipBehavior: Clip.antiAlias,
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
Image.network(
|
||||
scenario.cover,
|
||||
fit: BoxFit.cover,
|
||||
loadingBuilder: (context, child, loadingProgress) {
|
||||
if (loadingProgress == null) return child;
|
||||
return Container(
|
||||
color: Colors.black26,
|
||||
child: const Center(
|
||||
child: CircularProgressIndicator(strokeWidth: 2),
|
||||
),
|
||||
);
|
||||
},
|
||||
),
|
||||
if (scenario.isLocked)
|
||||
Container(
|
||||
color: const Color(0xFF2E1065).withOpacity(0.6),
|
||||
child: const Center(
|
||||
child: Icon(LucideIcons.lock, size: 16, color: Colors.white70),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
|
||||
// Center: Info
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
// Category & Intensity
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Text(
|
||||
scenario.category,
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontFamily: 'monospace',
|
||||
letterSpacing: 1,
|
||||
color: Colors.white.withOpacity(0.9),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Icon(LucideIcons.zap, size: 10, color: intensityColor),
|
||||
const SizedBox(width: 2),
|
||||
Text(
|
||||
scenario.intensity,
|
||||
style: TextStyle(
|
||||
fontSize: 9,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: intensityColor,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
|
||||
// Title
|
||||
Text(
|
||||
scenario.title,
|
||||
style: const TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
const SizedBox(height: 6),
|
||||
|
||||
// Tags
|
||||
Wrap(
|
||||
spacing: 6,
|
||||
children: scenario.tags.take(3).map((tag) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(4),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.05)),
|
||||
),
|
||||
child: Text(
|
||||
'#$tag',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
color: Colors.white.withOpacity(0.7),
|
||||
),
|
||||
),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
// Right: Play Button
|
||||
Container(
|
||||
width: 40,
|
||||
height: 40,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: scenario.isLocked
|
||||
? Colors.white.withOpacity(0.05)
|
||||
: const Color(0xFFC084FC).withOpacity(0.2),
|
||||
),
|
||||
child: Center(
|
||||
child: Icon(
|
||||
scenario.isLocked ? LucideIcons.lock : LucideIcons.play,
|
||||
size: scenario.isLocked ? 16 : 18,
|
||||
color: scenario.isLocked
|
||||
? Colors.white.withOpacity(0.3)
|
||||
: const Color(0xFFC084FC),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
179
wei_ai_app/lib/screens/main/main_screen.dart
Normal file
179
wei_ai_app/lib/screens/main/main_screen.dart
Normal file
@@ -0,0 +1,179 @@
|
||||
import 'dart:ui';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import '../../widgets/status_bar.dart';
|
||||
import '../../providers/device_provider.dart';
|
||||
import '../../widgets/glass_bottom_nav.dart';
|
||||
|
||||
class MainScreen extends ConsumerStatefulWidget {
|
||||
final StatefulNavigationShell navigationShell;
|
||||
|
||||
const MainScreen({
|
||||
super.key,
|
||||
required this.navigationShell,
|
||||
});
|
||||
|
||||
@override
|
||||
ConsumerState<MainScreen> createState() => _MainScreenState();
|
||||
}
|
||||
|
||||
class _MainScreenState extends ConsumerState<MainScreen> {
|
||||
void _goBranch(int index) {
|
||||
widget.navigationShell.goBranch(
|
||||
index,
|
||||
initialLocation: index == widget.navigationShell.currentIndex,
|
||||
);
|
||||
}
|
||||
|
||||
Map<String, String> _getPageTitle(int index) {
|
||||
switch (index) {
|
||||
case 0:
|
||||
return {'title': '专属推荐', 'subtitle': '基于偏好生成的私密匹配列表'};
|
||||
case 1:
|
||||
return {'title': '剧本馆', 'subtitle': '沉浸式感官体验库'};
|
||||
case 2:
|
||||
return {'title': '手动实验室', 'subtitle': '实时触觉反馈控制'};
|
||||
case 3:
|
||||
return {'title': '个人中心', 'subtitle': 'ID: 884-291-00X'};
|
||||
default:
|
||||
return {'title': 'Wei AI', 'subtitle': ''};
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final pageMeta = _getPageTitle(widget.navigationShell.currentIndex);
|
||||
|
||||
return Container(
|
||||
decoration: const BoxDecoration(
|
||||
color: Color(0xFF2E1065), // Fallback
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topLeft,
|
||||
end: Alignment.bottomRight,
|
||||
colors: [
|
||||
Color(0xFF2E1065), // #2e1065
|
||||
Color(0xFF4C1D95), // #4c1d95
|
||||
Color(0xFF831843), // #831843
|
||||
],
|
||||
stops: [0.0, 0.4, 1.0],
|
||||
),
|
||||
),
|
||||
child: Stack(
|
||||
children: [
|
||||
// Radial Gradient 1 (Top Left)
|
||||
Positioned(
|
||||
top: -100,
|
||||
left: -100,
|
||||
child: Container(
|
||||
width: 500, // Larger size for smoother gradient
|
||||
height: 500,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
gradient: RadialGradient(
|
||||
colors: [
|
||||
const Color(0xFFA855F7).withOpacity(0.4), // rgba(168, 85, 247, 0.4)
|
||||
Colors.transparent,
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
// Radial Gradient 2 (Top Right)
|
||||
Positioned(
|
||||
top: -100,
|
||||
right: -100,
|
||||
child: Container(
|
||||
width: 500,
|
||||
height: 500,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
gradient: RadialGradient(
|
||||
colors: [
|
||||
const Color(0xFFEC4899).withOpacity(0.3), // rgba(236, 72, 153, 0.3)
|
||||
Colors.transparent,
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Scaffold
|
||||
Scaffold(
|
||||
backgroundColor: Colors.transparent,
|
||||
extendBody: true, // Important for glass nav
|
||||
extendBodyBehindAppBar: false, // Body starts below AppBar naturally
|
||||
appBar: AppBar(
|
||||
backgroundColor: Colors.transparent,
|
||||
elevation: 0,
|
||||
titleSpacing: 20,
|
||||
title: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
const Icon(LucideIcons.hexagon, size: 12, color: Colors.white70),
|
||||
const SizedBox(width: 6),
|
||||
Text(
|
||||
'WEI AI',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.8),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
pageMeta['title']!,
|
||||
style: const TextStyle(
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
shadows: [Shadow(color: Colors.black26, offset: Offset(0, 2), blurRadius: 4)]
|
||||
)
|
||||
),
|
||||
],
|
||||
),
|
||||
centerTitle: false,
|
||||
toolbarHeight: 90, // Increased toolbar height to accommodate subtitle
|
||||
actions: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(right: 20.0, top: 20), // Adjusted top padding to align with title
|
||||
child: StatusBar(
|
||||
status: ref.watch(deviceProvider),
|
||||
onTap: () {
|
||||
ref.read(deviceProvider.notifier).toggleConnection();
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
bottom: pageMeta['subtitle']!.isNotEmpty ? PreferredSize(
|
||||
preferredSize: const Size.fromHeight(20),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.only(left: 20, bottom: 10),
|
||||
child: Align(
|
||||
alignment: Alignment.centerLeft,
|
||||
child: Text(
|
||||
pageMeta['subtitle']!,
|
||||
style: TextStyle(fontSize: 10, color: Colors.white.withOpacity(0.6)),
|
||||
),
|
||||
),
|
||||
),
|
||||
) : null,
|
||||
),
|
||||
body: widget.navigationShell,
|
||||
bottomNavigationBar: GlassBottomNav(
|
||||
currentIndex: widget.navigationShell.currentIndex,
|
||||
onTap: _goBranch,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
515
wei_ai_app/lib/screens/player/script_player_screen.dart
Normal file
515
wei_ai_app/lib/screens/player/script_player_screen.dart
Normal file
@@ -0,0 +1,515 @@
|
||||
import 'dart:async';
|
||||
import 'dart:math';
|
||||
import 'dart:ui';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import 'package:fl_chart/fl_chart.dart';
|
||||
import '../../data/mock_data.dart';
|
||||
import '../../models/scenario.dart';
|
||||
|
||||
class ScriptPlayerScreen extends StatefulWidget {
|
||||
final String scenarioId;
|
||||
|
||||
const ScriptPlayerScreen({super.key, required this.scenarioId});
|
||||
|
||||
@override
|
||||
State<ScriptPlayerScreen> createState() => _ScriptPlayerScreenState();
|
||||
}
|
||||
|
||||
class _ScriptPlayerScreenState extends State<ScriptPlayerScreen>
|
||||
with TickerProviderStateMixin {
|
||||
bool _isPlaying = true;
|
||||
double _progress = 0;
|
||||
bool _isDragging = false;
|
||||
bool _showAlert = false;
|
||||
Timer? _timer;
|
||||
|
||||
late Scenario _scenario;
|
||||
late List<FlSpot> _waveData;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_scenario = mockScenarios.firstWhere(
|
||||
(s) => s.id == widget.scenarioId,
|
||||
orElse: () => mockScenarios.first,
|
||||
);
|
||||
_generateWaveData();
|
||||
_startPlayback();
|
||||
}
|
||||
|
||||
void _generateWaveData() {
|
||||
// Generate 101 data points (0 to 100) for realistic wave
|
||||
final random = Random(42); // Fixed seed for consistency
|
||||
_waveData = List.generate(101, (i) {
|
||||
double hz;
|
||||
if (i < 20) {
|
||||
// Warmup
|
||||
hz = 10 + (i * 1.5) + (random.nextDouble() * 5);
|
||||
} else if (i < 50) {
|
||||
// Plateau/Tease
|
||||
hz = 40 + sin(i * 0.5) * 10 + (random.nextDouble() * 10);
|
||||
} else if (i < 85) {
|
||||
// Build up to climax
|
||||
hz = 70 + (i - 50) * 0.8 + (random.nextDouble() * 15);
|
||||
} else {
|
||||
// Cooldown
|
||||
hz = 90 - ((i - 85) * 5) + (random.nextDouble() * 5);
|
||||
}
|
||||
return FlSpot(i.toDouble(), hz.clamp(0, 100));
|
||||
});
|
||||
}
|
||||
|
||||
void _startPlayback() {
|
||||
_timer?.cancel();
|
||||
_timer = Timer.periodic(const Duration(milliseconds: 50), (timer) {
|
||||
if (!_isPlaying || _isDragging) return;
|
||||
setState(() {
|
||||
if (_progress >= 100) {
|
||||
_isPlaying = false;
|
||||
timer.cancel();
|
||||
} else {
|
||||
_progress += 0.1;
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
void _handleEmergencyStop() {
|
||||
setState(() {
|
||||
_isPlaying = false;
|
||||
_showAlert = true;
|
||||
});
|
||||
Future.delayed(const Duration(milliseconds: 1500), () {
|
||||
if (mounted) {
|
||||
Navigator.of(context).pop();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
int get _activeLineIndex {
|
||||
for (int i = 0; i < dialogueScript.length; i++) {
|
||||
final nextLine = i + 1 < dialogueScript.length ? dialogueScript[i + 1] : null;
|
||||
if (_progress >= dialogueScript[i].time &&
|
||||
(nextLine == null || _progress < nextLine.time)) {
|
||||
return i;
|
||||
}
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
double get _currentHz {
|
||||
final index = _progress.floor().clamp(0, 100);
|
||||
return _waveData[index].y;
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_timer?.cancel();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onDoubleTap: _handleEmergencyStop,
|
||||
child: Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: Stack(
|
||||
children: [
|
||||
// Background Visual
|
||||
Positioned.fill(
|
||||
child: Opacity(
|
||||
opacity: 0.4,
|
||||
child: Stack(
|
||||
fit: StackFit.expand,
|
||||
children: [
|
||||
Image.network(
|
||||
_scenario.cover,
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||
child: Container(color: Colors.transparent),
|
||||
),
|
||||
Container(
|
||||
decoration: const BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [
|
||||
Color(0x992E1065),
|
||||
Color(0xCC2E1065),
|
||||
Color(0xFF2E1065),
|
||||
],
|
||||
stops: [0.0, 0.5, 1.0],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Emergency Overlay
|
||||
if (_showAlert)
|
||||
Positioned.fill(
|
||||
child: Container(
|
||||
color: const Color(0xF02E1065),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
LucideIcons.alertTriangle,
|
||||
size: 64,
|
||||
color: const Color(0xFFF43F5E),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
const Text(
|
||||
'EMERGENCY STOP',
|
||||
style: TextStyle(
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Color(0xFFF43F5E),
|
||||
letterSpacing: 4,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
const Text(
|
||||
'系统已强制中断',
|
||||
style: TextStyle(fontSize: 14, color: Colors.white70),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
// Main Content
|
||||
SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
// Header
|
||||
_buildHeader(),
|
||||
|
||||
// Central Lyrics
|
||||
Expanded(child: _buildLyrics()),
|
||||
|
||||
// Bottom Controls
|
||||
_buildControls(),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader() {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(24, 16, 24, 0),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
_scenario.title,
|
||||
style: const TextStyle(
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
'${_scenario.category} SCENARIO',
|
||||
style: const TextStyle(
|
||||
fontSize: 10,
|
||||
letterSpacing: 1,
|
||||
color: Color(0xFFC084FC),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
GestureDetector(
|
||||
onTap: () => Navigator.of(context).pop(),
|
||||
child: Container(
|
||||
width: 40,
|
||||
height: 40,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: const Icon(LucideIcons.x, size: 20, color: Colors.white70),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildLyrics() {
|
||||
// 简单展示:只显示当前行附近的几行
|
||||
return Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// 上面 2 行
|
||||
for (int i = _activeLineIndex - 2; i < _activeLineIndex; i++)
|
||||
if (i >= 0)
|
||||
_buildLyricLine(i, isActive: false, distance: _activeLineIndex - i),
|
||||
|
||||
// 当前行
|
||||
_buildLyricLine(_activeLineIndex, isActive: true, distance: 0),
|
||||
|
||||
// 下面 2 行
|
||||
for (int i = _activeLineIndex + 1; i <= _activeLineIndex + 2; i++)
|
||||
if (i < dialogueScript.length)
|
||||
_buildLyricLine(i, isActive: false, distance: i - _activeLineIndex),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildLyricLine(int index, {required bool isActive, required int distance}) {
|
||||
final opacity = isActive ? 1.0 : (distance > 1 ? 0.2 : 0.5);
|
||||
final scale = isActive ? 1.0 : 0.9;
|
||||
|
||||
return AnimatedContainer(
|
||||
duration: const Duration(milliseconds: 400),
|
||||
height: isActive ? 80 : 56,
|
||||
child: AnimatedOpacity(
|
||||
duration: const Duration(milliseconds: 400),
|
||||
opacity: opacity,
|
||||
child: Transform.scale(
|
||||
scale: scale,
|
||||
child: Center(
|
||||
child: Text(
|
||||
dialogueScript[index].text,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontSize: isActive ? 20 : 16,
|
||||
fontWeight: isActive ? FontWeight.bold : FontWeight.w400,
|
||||
color: isActive ? Colors.white : const Color(0xFFCBD5E1),
|
||||
shadows: isActive
|
||||
? [
|
||||
const Shadow(
|
||||
color: Color(0x99C084FC),
|
||||
blurRadius: 20,
|
||||
),
|
||||
]
|
||||
: null,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildControls() {
|
||||
return Container(
|
||||
padding: const EdgeInsets.fromLTRB(0, 0, 0, 24),
|
||||
decoration: BoxDecoration(
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.bottomCenter,
|
||||
end: Alignment.topCenter,
|
||||
colors: [
|
||||
const Color(0xFF2E1065),
|
||||
const Color(0xFF2E1065),
|
||||
const Color(0xFF2E1065).withOpacity(0),
|
||||
],
|
||||
stops: const [0.0, 0.7, 1.0],
|
||||
),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
// Wave Chart
|
||||
SizedBox(
|
||||
height: 100,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16),
|
||||
child: LineChart(
|
||||
LineChartData(
|
||||
gridData: const FlGridData(show: false),
|
||||
titlesData: const FlTitlesData(show: false),
|
||||
borderData: FlBorderData(show: false),
|
||||
minX: 0,
|
||||
maxX: 100,
|
||||
minY: 0,
|
||||
maxY: 100,
|
||||
lineBarsData: [
|
||||
LineChartBarData(
|
||||
spots: _waveData,
|
||||
isCurved: true,
|
||||
curveSmoothness: 0.3,
|
||||
gradient: const LinearGradient(
|
||||
colors: [Color(0xFFC084FC), Color(0xFFF472B6)],
|
||||
),
|
||||
barWidth: 3,
|
||||
isStrokeCapRound: true,
|
||||
dotData: const FlDotData(show: false),
|
||||
belowBarData: BarAreaData(
|
||||
show: true,
|
||||
gradient: LinearGradient(
|
||||
begin: Alignment.topCenter,
|
||||
end: Alignment.bottomCenter,
|
||||
colors: [
|
||||
const Color(0xFFC084FC).withOpacity(0.5),
|
||||
const Color(0xFFC084FC).withOpacity(0),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
lineTouchData: const LineTouchData(enabled: false),
|
||||
extraLinesData: ExtraLinesData(
|
||||
verticalLines: [
|
||||
VerticalLine(
|
||||
x: _progress,
|
||||
color: Colors.white.withOpacity(0.3),
|
||||
strokeWidth: 1,
|
||||
dashArray: [4, 4],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Control Bar
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||||
child: Row(
|
||||
children: [
|
||||
// Play/Pause Button
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
setState(() {
|
||||
_isPlaying = !_isPlaying;
|
||||
if (_isPlaying && _progress >= 100) {
|
||||
_progress = 0;
|
||||
}
|
||||
});
|
||||
},
|
||||
child: Container(
|
||||
width: 48,
|
||||
height: 48,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: Colors.white,
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.white.withOpacity(0.3),
|
||||
blurRadius: 20,
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Icon(
|
||||
_isPlaying ? LucideIcons.pause : LucideIcons.play,
|
||||
size: 20,
|
||||
color: const Color(0xFF2E1065),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 20),
|
||||
|
||||
// Progress Info & Slider
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text(
|
||||
'DEVICE INTENSITY',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 1,
|
||||
color: Color(0xFFCBD5E1),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 2),
|
||||
Text(
|
||||
'伸缩频率: ${max(1, (_progress / 10).ceil())}档',
|
||||
style: const TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'monospace',
|
||||
color: Color(0xFFF472B6),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
Text(
|
||||
'${(_progress * 1.5).toStringAsFixed(0)}s / ${_scenario.duration}',
|
||||
style: const TextStyle(
|
||||
fontSize: 10,
|
||||
fontFamily: 'monospace',
|
||||
color: Color(0xFFCBD5E1),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
|
||||
// Progress Slider
|
||||
SliderTheme(
|
||||
data: SliderThemeData(
|
||||
trackHeight: 4,
|
||||
thumbShape: const RoundSliderThumbShape(enabledThumbRadius: 8),
|
||||
overlayShape: const RoundSliderOverlayShape(overlayRadius: 16),
|
||||
activeTrackColor: const Color(0xFFF472B6),
|
||||
inactiveTrackColor: Colors.white.withOpacity(0.2),
|
||||
thumbColor: Colors.white,
|
||||
),
|
||||
child: Slider(
|
||||
value: _progress.clamp(0, 100),
|
||||
min: 0,
|
||||
max: 100,
|
||||
onChangeStart: (_) => _isDragging = true,
|
||||
onChangeEnd: (_) => _isDragging = false,
|
||||
onChanged: (value) {
|
||||
setState(() {
|
||||
_progress = value;
|
||||
});
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Emergency Stop Hint
|
||||
Text(
|
||||
'双击屏幕紧急停止',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.4),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
134
wei_ai_app/lib/screens/profile/device_manager_screen.dart
Normal file
134
wei_ai_app/lib/screens/profile/device_manager_screen.dart
Normal file
@@ -0,0 +1,134 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class DeviceManagerScreen extends StatelessWidget {
|
||||
const DeviceManagerScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
_buildHeader(context),
|
||||
Expanded(
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_buildSectionTitle('已连接设备'),
|
||||
const SizedBox(height: 12),
|
||||
_buildDeviceCard(name: 'Link-X Pro', id: '884-X9-01', battery: 85, isConnected: true),
|
||||
const SizedBox(height: 24),
|
||||
_buildSectionTitle('历史设备'),
|
||||
const SizedBox(height: 12),
|
||||
_buildDeviceCard(name: 'Link-S Mini', id: '772-M3-02', battery: 0, isConnected: false),
|
||||
const SizedBox(height: 24),
|
||||
_buildAddDeviceButton(),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader(BuildContext context) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const Text('我的设备', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionTitle(String title) {
|
||||
return Text(title, style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 2, color: Colors.white.withOpacity(0.4)));
|
||||
}
|
||||
|
||||
Widget _buildDeviceCard({required String name, required String id, required int battery, required bool isConnected}) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(LucideIcons.bluetooth, size: 24, color: isConnected ? const Color(0xFF34D399) : Colors.white.withOpacity(0.5)),
|
||||
const SizedBox(width: 12),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(name, style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
const SizedBox(height: 2),
|
||||
Text('ID: $id', style: TextStyle(fontSize: 12, fontFamily: 'monospace', color: Colors.white.withOpacity(0.5))),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
||||
decoration: BoxDecoration(
|
||||
color: isConnected ? const Color(0xFF34D399).withOpacity(0.2) : Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Text(
|
||||
isConnected ? '已连接' : '未连接',
|
||||
style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, color: isConnected ? const Color(0xFF34D399) : Colors.white.withOpacity(0.5)),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
if (isConnected) ...[
|
||||
const SizedBox(height: 16),
|
||||
Row(
|
||||
children: [
|
||||
Icon(LucideIcons.battery, size: 16, color: const Color(0xFF34D399)),
|
||||
const SizedBox(width: 8),
|
||||
Text('$battery%', style: const TextStyle(fontSize: 14, fontFamily: 'monospace', color: Colors.white)),
|
||||
],
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildAddDeviceButton() {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.2)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(LucideIcons.plus, size: 20, color: Colors.white.withOpacity(0.7)),
|
||||
const SizedBox(width: 8),
|
||||
Text('添加新设备', style: TextStyle(fontSize: 14, fontWeight: FontWeight.w500, color: Colors.white.withOpacity(0.7))),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
118
wei_ai_app/lib/screens/profile/help_screen.dart
Normal file
118
wei_ai_app/lib/screens/profile/help_screen.dart
Normal file
@@ -0,0 +1,118 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class HelpScreen extends StatelessWidget {
|
||||
const HelpScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
_buildHeader(context),
|
||||
Expanded(
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_buildSectionTitle('常见问题'),
|
||||
const SizedBox(height: 12),
|
||||
_buildFaqItem(question: '如何连接设备?', answer: '进入手动实验室页面,点击"连接设备"按钮,开启蓝牙后按照提示操作。'),
|
||||
_buildFaqItem(question: '积分如何获取?', answer: '可通过充值购买或完成日常任务获得积分奖励。'),
|
||||
_buildFaqItem(question: '如何升级会员?', answer: '在个人中心点击订阅管理,选择合适的会员方案进行升级。'),
|
||||
const SizedBox(height: 24),
|
||||
_buildSectionTitle('联系我们'),
|
||||
const SizedBox(height: 12),
|
||||
_buildContactItem(icon: LucideIcons.messageCircle, title: '在线客服', subtitle: '工作时间: 9:00-21:00'),
|
||||
const SizedBox(height: 12),
|
||||
_buildContactItem(icon: LucideIcons.mail, title: '邮箱反馈', subtitle: 'support@weiai.com'),
|
||||
const SizedBox(height: 24),
|
||||
_buildFeedbackButton(),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader(BuildContext context) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(onPressed: () => Navigator.of(context).pop(), icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7))),
|
||||
const Text('帮助与反馈', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionTitle(String title) {
|
||||
return Text(title, style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 2, color: Colors.white.withOpacity(0.4)));
|
||||
}
|
||||
|
||||
Widget _buildFaqItem({required String question, required String answer}) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(bottom: 12),
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(color: Colors.white.withOpacity(0.05), borderRadius: BorderRadius.circular(16), border: Border.all(color: Colors.white.withOpacity(0.1))),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(LucideIcons.helpCircle, size: 16, color: const Color(0xFFC084FC)),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(child: Text(question, style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w600, color: Colors.white))),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(answer, style: TextStyle(fontSize: 13, color: Colors.white.withOpacity(0.6), height: 1.5)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildContactItem({required IconData icon, required String title, required String subtitle}) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(color: Colors.white.withOpacity(0.05), borderRadius: BorderRadius.circular(16), border: Border.all(color: Colors.white.withOpacity(0.1))),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(padding: const EdgeInsets.all(10), decoration: BoxDecoration(color: Colors.white.withOpacity(0.05), borderRadius: BorderRadius.circular(12)), child: Icon(icon, size: 20, color: Colors.white.withOpacity(0.7))),
|
||||
const SizedBox(width: 14),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(title, style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: Colors.white)),
|
||||
const SizedBox(height: 2),
|
||||
Text(subtitle, style: TextStyle(fontSize: 12, color: Colors.white.withOpacity(0.5))),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildFeedbackButton() {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
decoration: BoxDecoration(gradient: const LinearGradient(colors: [Color(0xFFC084FC), Color(0xFFF472B6)]), borderRadius: BorderRadius.circular(16)),
|
||||
child: const Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(LucideIcons.send, size: 18, color: Colors.white),
|
||||
SizedBox(width: 8),
|
||||
Text('提交反馈', style: TextStyle(fontSize: 15, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
119
wei_ai_app/lib/screens/profile/privacy_screen.dart
Normal file
119
wei_ai_app/lib/screens/profile/privacy_screen.dart
Normal file
@@ -0,0 +1,119 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class PrivacyScreen extends StatefulWidget {
|
||||
const PrivacyScreen({super.key});
|
||||
|
||||
@override
|
||||
State<PrivacyScreen> createState() => _PrivacyScreenState();
|
||||
}
|
||||
|
||||
class _PrivacyScreenState extends State<PrivacyScreen> {
|
||||
bool _dataEncryption = true;
|
||||
bool _anonymousMode = false;
|
||||
bool _shareAnalytics = true;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
_buildHeader(),
|
||||
Expanded(
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_buildSecurityStatus(),
|
||||
const SizedBox(height: 24),
|
||||
_buildSectionTitle('隐私设置'),
|
||||
const SizedBox(height: 12),
|
||||
_buildSwitchTile(icon: LucideIcons.lock, title: '端到端加密', subtitle: '所有数据均已加密保护', value: _dataEncryption, onChanged: (v) => setState(() => _dataEncryption = v)),
|
||||
const SizedBox(height: 12),
|
||||
_buildSwitchTile(icon: LucideIcons.eyeOff, title: '匿名模式', subtitle: '隐藏个人信息和活动记录', value: _anonymousMode, onChanged: (v) => setState(() => _anonymousMode = v)),
|
||||
const SizedBox(height: 12),
|
||||
_buildSwitchTile(icon: LucideIcons.barChart2, title: '分享使用数据', subtitle: '帮助我们改进产品体验', value: _shareAnalytics, onChanged: (v) => setState(() => _shareAnalytics = v)),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader() {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(onPressed: () => Navigator.of(context).pop(), icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7))),
|
||||
const Text('隐私安全', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSecurityStatus() {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFF34D399).withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(color: const Color(0xFF34D399).withOpacity(0.3)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(12),
|
||||
decoration: BoxDecoration(color: const Color(0xFF34D399).withOpacity(0.2), shape: BoxShape.circle),
|
||||
child: const Icon(LucideIcons.shieldCheck, size: 24, color: Color(0xFF34D399)),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
const Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text('账户安全', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color: Color(0xFF34D399))),
|
||||
SizedBox(height: 4),
|
||||
Text('您的账户处于安全状态', style: TextStyle(fontSize: 12, color: Colors.white70)),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionTitle(String title) {
|
||||
return Text(title, style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 2, color: Colors.white.withOpacity(0.4)));
|
||||
}
|
||||
|
||||
Widget _buildSwitchTile({required IconData icon, required String title, required String subtitle, required bool value, required ValueChanged<bool> onChanged}) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(color: Colors.white.withOpacity(0.05), borderRadius: BorderRadius.circular(16), border: Border.all(color: Colors.white.withOpacity(0.1))),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(padding: const EdgeInsets.all(10), decoration: BoxDecoration(color: Colors.white.withOpacity(0.05), borderRadius: BorderRadius.circular(12)), child: Icon(icon, size: 20, color: Colors.white.withOpacity(0.7))),
|
||||
const SizedBox(width: 14),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(title, style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: Colors.white)),
|
||||
const SizedBox(height: 2),
|
||||
Text(subtitle, style: TextStyle(fontSize: 12, color: Colors.white.withOpacity(0.5))),
|
||||
],
|
||||
),
|
||||
),
|
||||
Switch(value: value, onChanged: onChanged, activeColor: const Color(0xFFC084FC)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
404
wei_ai_app/lib/screens/profile/profile_screen.dart
Normal file
404
wei_ai_app/lib/screens/profile/profile_screen.dart
Normal file
@@ -0,0 +1,404 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import '../../widgets/tab_content_layout.dart';
|
||||
|
||||
class ProfileScreen extends StatelessWidget {
|
||||
const ProfileScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
const double bottomNavHeight = 90;
|
||||
|
||||
return TabContentLayout(
|
||||
child: SingleChildScrollView(
|
||||
padding: EdgeInsets.fromLTRB(16, 8, 16, bottomNavHeight + 20),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
// User Header
|
||||
_buildUserHeader(context),
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// Stats Grid
|
||||
_buildStatsGrid(),
|
||||
const SizedBox(height: 20),
|
||||
|
||||
// Joy Points Card
|
||||
_buildJoyPointsCard(context),
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// Menu List
|
||||
_buildMenuSection(context),
|
||||
const SizedBox(height: 24),
|
||||
|
||||
// Logout Button
|
||||
_buildLogoutButton(),
|
||||
const SizedBox(height: 16),
|
||||
|
||||
// Version
|
||||
Center(
|
||||
child: Text(
|
||||
'Wei AI v2.5.0 (Neon Edition)',
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white.withOpacity(0.3),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildUserHeader(BuildContext context) {
|
||||
return Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
// Avatar
|
||||
Container(
|
||||
padding: const EdgeInsets.all(2),
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
gradient: const LinearGradient(
|
||||
colors: [Color(0xFFC084FC), Color(0xFFF472B6)],
|
||||
),
|
||||
),
|
||||
child: Container(
|
||||
width: 64,
|
||||
height: 64,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(color: Colors.white.withOpacity(0.2), width: 2),
|
||||
image: const DecorationImage(
|
||||
image: NetworkImage('https://api.dicebear.com/7.x/avataaars/png?seed=commander'),
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
|
||||
// User Info
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const Text(
|
||||
'Commander',
|
||||
style: TextStyle(
|
||||
fontSize: 24,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(LucideIcons.crown, size: 12, color: const Color(0xFFFBBF24)),
|
||||
const SizedBox(width: 4),
|
||||
const Text(
|
||||
'LV.4 黑金会员',
|
||||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Colors.white,
|
||||
letterSpacing: 1,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
// Settings Button
|
||||
GestureDetector(
|
||||
onTap: () => context.push('/profile/settings'),
|
||||
child: Container(
|
||||
width: 44,
|
||||
height: 44,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Icon(LucideIcons.settings, size: 20, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildStatsGrid() {
|
||||
final stats = [
|
||||
{'label': '互动时长', 'val': '42', 'unit': 'h'},
|
||||
{'label': '亲密指数', 'val': '85', 'unit': '%'},
|
||||
{'label': '解锁剧本', 'val': '12', 'unit': '个'},
|
||||
];
|
||||
|
||||
return Row(
|
||||
children: stats.map((stat) {
|
||||
return Expanded(
|
||||
child: Container(
|
||||
margin: const EdgeInsets.symmetric(horizontal: 4),
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Column(
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.end,
|
||||
children: [
|
||||
Text(
|
||||
stat['val']!,
|
||||
style: const TextStyle(
|
||||
fontSize: 22,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(bottom: 2),
|
||||
child: Text(
|
||||
stat['unit']!,
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
color: Colors.white.withOpacity(0.6),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
stat['label']!,
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
letterSpacing: 1,
|
||||
color: Colors.white.withOpacity(0.5),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}).toList(),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildJoyPointsCard(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: () => context.push('/profile/topup'),
|
||||
child: Container(
|
||||
height: 120,
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
gradient: const LinearGradient(
|
||||
colors: [Color(0xFF7C3AED), Color(0xFF9333EA), Color(0xFFDB2777)],
|
||||
),
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: const Color(0xFFC084FC).withOpacity(0.4),
|
||||
blurRadius: 30,
|
||||
offset: const Offset(0, 10),
|
||||
),
|
||||
],
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(20),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(LucideIcons.zap, size: 16, color: Colors.white.withOpacity(0.9)),
|
||||
const SizedBox(width: 6),
|
||||
Text(
|
||||
'JOY POINTS',
|
||||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.9),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
const Text(
|
||||
'2,450',
|
||||
style: TextStyle(
|
||||
fontSize: 36,
|
||||
fontWeight: FontWeight.bold,
|
||||
fontFamily: 'monospace',
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white,
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
),
|
||||
child: const Text(
|
||||
'立即充值',
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: Color(0xFF9333EA),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildMenuSection(BuildContext context) {
|
||||
final menuItems = [
|
||||
{'id': 'device', 'icon': LucideIcons.bluetooth, 'label': '我的设备', 'sub': 'Link-X Pro', 'route': '/profile/device'},
|
||||
{'id': 'sub', 'icon': LucideIcons.creditCard, 'label': '订阅管理', 'sub': '', 'route': '/profile/subscription'},
|
||||
{'id': 'privacy', 'icon': LucideIcons.shield, 'label': '隐私安全', 'sub': '', 'route': '/profile/privacy'},
|
||||
{'id': 'help', 'icon': LucideIcons.helpCircle, 'label': '帮助与反馈', 'sub': '', 'route': '/profile/help'},
|
||||
];
|
||||
|
||||
return Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(left: 4, bottom: 8),
|
||||
child: Text(
|
||||
'GENERAL',
|
||||
style: TextStyle(
|
||||
fontSize: 11,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.4),
|
||||
),
|
||||
),
|
||||
),
|
||||
...menuItems.map((item) => _buildMenuItem(
|
||||
context,
|
||||
icon: item['icon'] as IconData,
|
||||
label: item['label'] as String,
|
||||
sub: item['sub'] as String,
|
||||
route: item['route'] as String,
|
||||
)),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildMenuItem(BuildContext context, {
|
||||
required IconData icon,
|
||||
required String label,
|
||||
required String sub,
|
||||
required String route,
|
||||
}) {
|
||||
return GestureDetector(
|
||||
onTap: () => context.push(route),
|
||||
child: Container(
|
||||
margin: const EdgeInsets.only(bottom: 10),
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(10),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Icon(icon, size: 20, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
Text(
|
||||
label,
|
||||
style: const TextStyle(
|
||||
fontSize: 15,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
if (sub.isNotEmpty)
|
||||
Text(
|
||||
sub,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
color: Colors.white.withOpacity(0.5),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
Icon(LucideIcons.chevronRight, size: 18, color: Colors.white.withOpacity(0.3)),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildLogoutButton() {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.red.withOpacity(0.3)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(LucideIcons.logOut, size: 18, color: Colors.red[400]),
|
||||
const SizedBox(width: 8),
|
||||
Text(
|
||||
'退出登录',
|
||||
style: TextStyle(
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: Colors.red[400],
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
231
wei_ai_app/lib/screens/profile/settings_screen.dart
Normal file
231
wei_ai_app/lib/screens/profile/settings_screen.dart
Normal file
@@ -0,0 +1,231 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class SettingsScreen extends StatefulWidget {
|
||||
const SettingsScreen({super.key});
|
||||
|
||||
@override
|
||||
State<SettingsScreen> createState() => _SettingsScreenState();
|
||||
}
|
||||
|
||||
class _SettingsScreenState extends State<SettingsScreen> {
|
||||
bool _notificationsEnabled = true;
|
||||
bool _darkMode = true;
|
||||
bool _hapticFeedback = true;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
_buildHeader(),
|
||||
Expanded(
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_buildSectionTitle('通知'),
|
||||
_buildSwitchTile(
|
||||
icon: LucideIcons.bell,
|
||||
title: '推送通知',
|
||||
subtitle: '接收消息和活动提醒',
|
||||
value: _notificationsEnabled,
|
||||
onChanged: (v) => setState(() => _notificationsEnabled = v),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
_buildSectionTitle('显示'),
|
||||
_buildSwitchTile(
|
||||
icon: LucideIcons.moon,
|
||||
title: '深色模式',
|
||||
subtitle: '始终使用深色主题',
|
||||
value: _darkMode,
|
||||
onChanged: (v) => setState(() => _darkMode = v),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
_buildSectionTitle('体验'),
|
||||
_buildSwitchTile(
|
||||
icon: LucideIcons.smartphone,
|
||||
title: '触觉反馈',
|
||||
subtitle: '操作时产生震动反馈',
|
||||
value: _hapticFeedback,
|
||||
onChanged: (v) => setState(() => _hapticFeedback = v),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
_buildSectionTitle('存储'),
|
||||
_buildActionTile(
|
||||
icon: LucideIcons.trash2,
|
||||
title: '清除缓存',
|
||||
subtitle: '已使用 128 MB',
|
||||
onTap: () {},
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
_buildSectionTitle('关于'),
|
||||
_buildInfoTile(
|
||||
icon: LucideIcons.info,
|
||||
title: '版本',
|
||||
value: 'v2.5.0',
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader() {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const Text(
|
||||
'系统设置',
|
||||
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Colors.white),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionTitle(String title) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.only(left: 4, bottom: 12),
|
||||
child: Text(
|
||||
title,
|
||||
style: TextStyle(
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
letterSpacing: 2,
|
||||
color: Colors.white.withOpacity(0.4),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSwitchTile({
|
||||
required IconData icon,
|
||||
required String title,
|
||||
required String subtitle,
|
||||
required bool value,
|
||||
required ValueChanged<bool> onChanged,
|
||||
}) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(10),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Icon(icon, size: 20, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(title, style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: Colors.white)),
|
||||
const SizedBox(height: 2),
|
||||
Text(subtitle, style: TextStyle(fontSize: 12, color: Colors.white.withOpacity(0.5))),
|
||||
],
|
||||
),
|
||||
),
|
||||
Switch(
|
||||
value: value,
|
||||
onChanged: onChanged,
|
||||
activeColor: const Color(0xFFC084FC),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildActionTile({
|
||||
required IconData icon,
|
||||
required String title,
|
||||
required String subtitle,
|
||||
required VoidCallback onTap,
|
||||
}) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(10),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Icon(icon, size: 20, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(title, style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: Colors.white)),
|
||||
const SizedBox(height: 2),
|
||||
Text(subtitle, style: TextStyle(fontSize: 12, color: Colors.white.withOpacity(0.5))),
|
||||
],
|
||||
),
|
||||
),
|
||||
Icon(LucideIcons.chevronRight, size: 18, color: Colors.white.withOpacity(0.3)),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildInfoTile({
|
||||
required IconData icon,
|
||||
required String title,
|
||||
required String value,
|
||||
}) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(10),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
),
|
||||
child: Icon(icon, size: 20, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const SizedBox(width: 14),
|
||||
Expanded(child: Text(title, style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w500, color: Colors.white))),
|
||||
Text(value, style: TextStyle(fontSize: 14, fontFamily: 'monospace', color: Colors.white.withOpacity(0.5))),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
120
wei_ai_app/lib/screens/profile/subscription_screen.dart
Normal file
120
wei_ai_app/lib/screens/profile/subscription_screen.dart
Normal file
@@ -0,0 +1,120 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class SubscriptionScreen extends StatelessWidget {
|
||||
const SubscriptionScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
_buildHeader(context),
|
||||
Expanded(
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_buildCurrentPlan(),
|
||||
const SizedBox(height: 24),
|
||||
_buildSectionTitle('升级方案'),
|
||||
const SizedBox(height: 12),
|
||||
_buildPlanCard(name: '月度会员', price: '¥29/月', features: ['无限互动时长', '优先匹配', '专属剧本'], isRecommended: false),
|
||||
const SizedBox(height: 12),
|
||||
_buildPlanCard(name: '年度会员', price: '¥199/年', features: ['月度会员全部权益', '额外赠送500积分', '新功能优先体验'], isRecommended: true),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader(BuildContext context) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(onPressed: () => Navigator.of(context).pop(), icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7))),
|
||||
const Text('订阅管理', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildCurrentPlan() {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
gradient: const LinearGradient(colors: [Color(0xFF7C3AED), Color(0xFF9333EA)]),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(LucideIcons.crown, size: 20, color: const Color(0xFFFBBF24)),
|
||||
const SizedBox(width: 8),
|
||||
const Text('当前订阅', style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 1, color: Colors.white70)),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
const Text('黑金会员 LV.4', style: TextStyle(fontSize: 24, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
const SizedBox(height: 8),
|
||||
Text('有效期至 2025-12-31', style: TextStyle(fontSize: 12, color: Colors.white.withOpacity(0.7))),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionTitle(String title) {
|
||||
return Text(title, style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 2, color: Colors.white.withOpacity(0.4)));
|
||||
}
|
||||
|
||||
Widget _buildPlanCard({required String name, required String price, required List<String> features, required bool isRecommended}) {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(20),
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(color: isRecommended ? const Color(0xFFC084FC) : Colors.white.withOpacity(0.1), width: isRecommended ? 2 : 1),
|
||||
),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Text(name, style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
if (isRecommended)
|
||||
Container(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
||||
decoration: BoxDecoration(color: const Color(0xFFC084FC), borderRadius: BorderRadius.circular(8)),
|
||||
child: const Text('推荐', style: TextStyle(fontSize: 10, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(price, style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold, fontFamily: 'monospace', color: Color(0xFFC084FC))),
|
||||
const SizedBox(height: 12),
|
||||
...features.map((f) => Padding(
|
||||
padding: const EdgeInsets.only(bottom: 6),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(LucideIcons.check, size: 14, color: const Color(0xFF34D399)),
|
||||
const SizedBox(width: 8),
|
||||
Text(f, style: TextStyle(fontSize: 13, color: Colors.white.withOpacity(0.7))),
|
||||
],
|
||||
),
|
||||
)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
150
wei_ai_app/lib/screens/profile/topup_screen.dart
Normal file
150
wei_ai_app/lib/screens/profile/topup_screen.dart
Normal file
@@ -0,0 +1,150 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class TopupScreen extends StatefulWidget {
|
||||
const TopupScreen({super.key});
|
||||
|
||||
@override
|
||||
State<TopupScreen> createState() => _TopupScreenState();
|
||||
}
|
||||
|
||||
class _TopupScreenState extends State<TopupScreen> {
|
||||
int _selectedPackage = 1;
|
||||
|
||||
final List<Map<String, dynamic>> _packages = [
|
||||
{'points': 100, 'price': 6, 'bonus': 0},
|
||||
{'points': 500, 'price': 28, 'bonus': 50},
|
||||
{'points': 1000, 'price': 50, 'bonus': 150},
|
||||
{'points': 3000, 'price': 128, 'bonus': 600},
|
||||
];
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: const Color(0xFF2E1065),
|
||||
body: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
_buildHeader(),
|
||||
Expanded(
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
_buildBalanceCard(),
|
||||
const SizedBox(height: 24),
|
||||
_buildSectionTitle('选择套餐'),
|
||||
const SizedBox(height: 12),
|
||||
..._packages.asMap().entries.map((e) => _buildPackageCard(e.key, e.value)),
|
||||
const SizedBox(height: 24),
|
||||
_buildPayButton(),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildHeader() {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(8, 8, 16, 16),
|
||||
child: Row(
|
||||
children: [
|
||||
IconButton(
|
||||
onPressed: () => Navigator.of(context).pop(),
|
||||
icon: Icon(LucideIcons.chevronLeft, color: Colors.white.withOpacity(0.7)),
|
||||
),
|
||||
const Text('立即充值', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildBalanceCard() {
|
||||
return Container(
|
||||
padding: const EdgeInsets.all(24),
|
||||
decoration: BoxDecoration(
|
||||
gradient: const LinearGradient(colors: [Color(0xFF7C3AED), Color(0xFF9333EA), Color(0xFFDB2777)]),
|
||||
borderRadius: BorderRadius.circular(24),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(LucideIcons.zap, size: 32, color: Colors.white.withOpacity(0.9)),
|
||||
const SizedBox(width: 16),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text('当前余额', style: TextStyle(fontSize: 12, color: Colors.white.withOpacity(0.8))),
|
||||
const SizedBox(height: 4),
|
||||
const Text('2,450', style: TextStyle(fontSize: 32, fontWeight: FontWeight.bold, fontFamily: 'monospace', color: Colors.white)),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionTitle(String title) {
|
||||
return Text(
|
||||
title,
|
||||
style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold, letterSpacing: 2, color: Colors.white.withOpacity(0.4)),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildPackageCard(int index, Map<String, dynamic> pkg) {
|
||||
final isSelected = _selectedPackage == index;
|
||||
return GestureDetector(
|
||||
onTap: () => setState(() => _selectedPackage = index),
|
||||
child: Container(
|
||||
margin: const EdgeInsets.only(bottom: 12),
|
||||
padding: const EdgeInsets.all(16),
|
||||
decoration: BoxDecoration(
|
||||
color: isSelected ? Colors.white : Colors.white.withOpacity(0.05),
|
||||
borderRadius: BorderRadius.circular(16),
|
||||
border: Border.all(color: isSelected ? Colors.white : Colors.white.withOpacity(0.1), width: isSelected ? 2 : 1),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Icon(LucideIcons.zap, size: 20, color: isSelected ? const Color(0xFF9333EA) : const Color(0xFFC084FC)),
|
||||
const SizedBox(width: 12),
|
||||
Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
'${pkg['points']} 积分',
|
||||
style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color: isSelected ? const Color(0xFF2E1065) : Colors.white),
|
||||
),
|
||||
if (pkg['bonus'] > 0)
|
||||
Text('+${pkg['bonus']} 赠送', style: TextStyle(fontSize: 12, color: isSelected ? const Color(0xFF9333EA) : const Color(0xFFC084FC))),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
Text('¥${pkg['price']}', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold, fontFamily: 'monospace', color: isSelected ? const Color(0xFF2E1065) : Colors.white)),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildPayButton() {
|
||||
return Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 18),
|
||||
decoration: BoxDecoration(
|
||||
gradient: const LinearGradient(colors: [Color(0xFFC084FC), Color(0xFFF472B6)]),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
child: const Center(
|
||||
child: Text('确认支付', style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold, color: Colors.white)),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
98
wei_ai_app/lib/widgets/glass_bottom_nav.dart
Normal file
98
wei_ai_app/lib/widgets/glass_bottom_nav.dart
Normal file
@@ -0,0 +1,98 @@
|
||||
import 'dart:ui';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
|
||||
class GlassBottomNav extends StatelessWidget {
|
||||
final int currentIndex;
|
||||
final Function(int) onTap;
|
||||
|
||||
const GlassBottomNav({
|
||||
super.key,
|
||||
required this.currentIndex,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ClipRect(
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 20, sigmaY: 20),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.black.withOpacity(0.2), // bg-black/20
|
||||
border: Border(top: BorderSide(color: Colors.white.withOpacity(0.1))),
|
||||
),
|
||||
padding: EdgeInsets.only(
|
||||
bottom: MediaQuery.of(context).padding.bottom + 12,
|
||||
top: 12,
|
||||
),
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceAround,
|
||||
children: [
|
||||
_buildNavItem(0, LucideIcons.compass, '发现'),
|
||||
_buildNavItem(1, LucideIcons.playCircle, '剧本'),
|
||||
_buildNavItem(2, LucideIcons.radio, '操控'),
|
||||
_buildNavItem(3, LucideIcons.user, '我的'),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildNavItem(int index, IconData icon, String label) {
|
||||
bool isActive = currentIndex == index;
|
||||
return GestureDetector(
|
||||
onTap: () => onTap(index),
|
||||
behavior: HitTestBehavior.opaque,
|
||||
child: SizedBox(
|
||||
width: 60,
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Stack(
|
||||
alignment: Alignment.center,
|
||||
children: [
|
||||
if (isActive)
|
||||
Container(
|
||||
width: 40,
|
||||
height: 40,
|
||||
decoration: BoxDecoration(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
shape: BoxShape.circle,
|
||||
boxShadow: [
|
||||
BoxShadow(
|
||||
color: Colors.white.withOpacity(0.1),
|
||||
blurRadius: 10,
|
||||
spreadRadius: 5,
|
||||
)
|
||||
]
|
||||
),
|
||||
),
|
||||
AnimatedScale(
|
||||
scale: isActive ? 1.1 : 1.0,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
child: Icon(
|
||||
icon,
|
||||
size: 26,
|
||||
color: isActive ? Colors.white : Colors.white.withOpacity(0.5),
|
||||
shadows: isActive ? [const BoxShadow(color: Colors.white, blurRadius: 10)] : null,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 4),
|
||||
Text(
|
||||
label,
|
||||
style: TextStyle(
|
||||
fontSize: 10,
|
||||
color: isActive ? Colors.white : Colors.white.withOpacity(0.4),
|
||||
fontWeight: FontWeight.w500,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
82
wei_ai_app/lib/widgets/status_bar.dart
Normal file
82
wei_ai_app/lib/widgets/status_bar.dart
Normal file
@@ -0,0 +1,82 @@
|
||||
import 'dart:ui';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:lucide_icons/lucide_icons.dart';
|
||||
import '../models/device_status.dart';
|
||||
import '../config/theme.dart';
|
||||
|
||||
class StatusBar extends StatelessWidget {
|
||||
final DeviceStatus status;
|
||||
final VoidCallback? onTap;
|
||||
|
||||
const StatusBar({
|
||||
super.key,
|
||||
required this.status,
|
||||
this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return GestureDetector(
|
||||
onTap: onTap,
|
||||
child: ClipRRect(
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
child: BackdropFilter(
|
||||
filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
|
||||
child: Container(
|
||||
height: 32, // h-7 is ~28px, adjusted for touch target
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12),
|
||||
decoration: BoxDecoration(
|
||||
color: const Color(0xFF1A1625).withOpacity(0.8),
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||
),
|
||||
child: Row(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
// Connection Status Icon
|
||||
if (status.connected) ...[
|
||||
// TODO: Add ping animation if needed using flutter_animate
|
||||
const Icon(LucideIcons.bluetooth, size: 14, color: AppTheme.neonGreen),
|
||||
] else ...[
|
||||
Container(
|
||||
width: 6,
|
||||
height: 6,
|
||||
decoration: const BoxDecoration(color: Colors.grey, shape: BoxShape.circle),
|
||||
),
|
||||
],
|
||||
|
||||
const SizedBox(width: 8),
|
||||
Container(width: 1, height: 10, color: Colors.white.withOpacity(0.1)),
|
||||
const SizedBox(width: 8),
|
||||
|
||||
// Battery Status
|
||||
if (status.connected) ...[
|
||||
Text(
|
||||
'${status.battery.floor()}%',
|
||||
style: TextStyle(
|
||||
fontFamily: 'monospace',
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.bold,
|
||||
color: status.battery < 20 ? Theme.of(context).colorScheme.error : Colors.white,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Icon(
|
||||
LucideIcons.zap,
|
||||
size: 12,
|
||||
color: status.battery < 20 ? Theme.of(context).colorScheme.error : AppTheme.neonPurple,
|
||||
),
|
||||
] else ...[
|
||||
const Text(
|
||||
'未连接',
|
||||
style: TextStyle(fontSize: 10, color: Colors.grey),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
29
wei_ai_app/lib/widgets/tab_content_layout.dart
Normal file
29
wei_ai_app/lib/widgets/tab_content_layout.dart
Normal file
@@ -0,0 +1,29 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class TabContentLayout extends StatelessWidget {
|
||||
final Widget child;
|
||||
final bool applyTopPadding;
|
||||
final bool applyBottomPadding;
|
||||
|
||||
const TabContentLayout({
|
||||
super.key,
|
||||
required this.child,
|
||||
this.applyTopPadding = true,
|
||||
this.applyBottomPadding = false, // Usually managed solely by the glass nav height inside the list, but let's see.
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
// Since extendBodyBehindAppBar is true, we don't need extra padding
|
||||
// The body naturally starts from top, but we just need minimal spacing
|
||||
|
||||
return Padding(
|
||||
padding: EdgeInsets.only(
|
||||
top: 0, // Content starts naturally below AppBar
|
||||
// We don't necessarily pad bottom here if we want content to scroll behind bottom nav,
|
||||
// but for fixed elements (like Discovery Filter bar), we might need structure.
|
||||
),
|
||||
child: child,
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user