前段时间有分享一篇flutter3+deepseek搭建手机端ai对话模板。
flutter3.27接入deepseek-v3跨平台ai流式聊天问答系统
今天再分享一款最新研发的flutter3.32接入deepseek电脑端ai对话系统Flutter3-Winseek。
使用技术
- 开发工具：vscode
- 技术框架：flutter3.32.0+dart3.8.0
- 对话大模型：deepseek-v3
- 流请求：dio^5.8.0+1
- 窗口管理：window_manager^0.5.0
- 托盘管理：system_tray^2.0.3
- 路由/状态管理：get^4.7.2
- 存储服务：get_storage^2.1.1
- markdown解析：flutter_markdown^0.7.7
- 高亮组件：flutter_highlight^0.7.0
- 环境变量配置：flutter_dotenv^5.2.1
项目特性
- 支持侧边栏收缩/展开
- 支持上下文多轮对话、代码高亮、本地存储会话
- 支持代码块横向滚动、复制代码功能
- 支持图片100%宽度渲染、在线图片预览
- 支持网络链接跳转、表格功能
- 采用自定义无边框窗口、托盘图标
项目结构目录
通过 flutter create flutter_winseek 命令即可快速创建一个flutter空项目模板。
通过 flutter run -d windows 命令即可运行到windows桌面。
flutter自定义环境变量.env
# 项目名称 APP_NAME = 'Flutter3-WinSeek' # DeepSeek API配置 DEEPSEEK_API_KEY = apikey DEEPSEEK_BASE_URL = https://api.deepseek.com
通过如下方式获取：
// 获取.env环境变量baseUrl和apiKey String baseURL = dotenv.get('DEEPSEEK_BASE_URL'); String apiKEY = dotenv.get('DEEPSEEK_API_KEY');
项目通用布局
return Scaffold( backgroundColor: Colors.grey[50], body: DragToResizeArea( child: Row( children: [ // 侧边栏 AnimatedSize( duration: const Duration(milliseconds: 300), curve: Curves.easeInOut, child: Container( width: collapsed ? 0 : 260, decoration: BoxDecoration( border: Border(right: BorderSide(color: Colors.grey.withAlpha(50))) ), child: Material( color: Color(0xFFF3F3F3), child: Sidebar(), ), ), ), // 主体容器 Expanded( child: Column( children: [ // 自定义导航栏 SizedBox( height: 30.0, child: Row( children: [ IconButton( onPressed: () { setState(() { collapsed = !collapsed; }); }, icon: Icon(collapsed ? Icons.format_indent_increase : Icons.format_indent_decrease, size: 16.0,), tooltip: collapsed ? '展开' : '收缩', ), Expanded( child: DragToMoveArea( child: SizedBox( height: double.infinity, ), ), ), // 右上角操作按钮 WinBtns( leading: Row( children: [ ], ), ), ], ), ), // 右侧主面板 Expanded( child: Container( child: widget.child, ), ), ], ), ), ], ), ), );
侧边栏支持展开/收缩，历史记录支持右键菜单，超过高度有滚动条。
return ScrollConfiguration( behavior: CustomScrollBehavior(), child: Column( children: [ Container( padding: EdgeInsets.all(10.0), child: Column( spacing: 10.0, children: [ ], ), ), Container( margin: EdgeInsets.only(bottom: 10.0), padding: EdgeInsets.symmetric(horizontal: 20.0), child: Row( spacing: 5.0, children: [ Icon(Icons.history, size: 18.0,), Text('历史对话'), Spacer(), SizedBox( height: 25.0, width: 25.0, child: Transform.translate( offset: Offset(3.0, 0), child: IconButton( onPressed: () => handleClear(), tooltip: '清空会话', icon: Icon(Icons.delete_sweep_outlined, size: 14.0), padding: EdgeInsets.zero, style: ButtonStyle(backgroundColor: WidgetStateProperty.all(Colors.grey[50])), ), ) ) ], ), ), Expanded( child: Obx(() { if(chatStore.sessions.isEmpty) { return Column( spacing: 5.0, children: [ SizedBox(height: 20.0,), Image.asset('assets/images/empty.png', height: 40.0, width: 40.0,), Text('暂无对话', style: TextStyle(color: Colors.black38), overflow: TextOverflow.ellipsis,), ], ); } return ListView.separated( padding: EdgeInsets.symmetric(horizontal: 10.0), separatorBuilder: (context, index) => SizedBox(height: 2.0), itemCount: chatStore.sessions.length, itemBuilder: (context, index) { // ... }, ); }), ), Container( margin: EdgeInsets.symmetric(vertical: 10.0), padding: EdgeInsets.symmetric(horizontal: 10.0), child: InkWell( borderRadius: BorderRadius.circular(10.0), child: Container( padding: EdgeInsets.symmetric(horizontal: 10.0, vertical: 5.0), child: Row( spacing: 5.0, children: [ Image.asset('assets/images/avatar.png',height: 30.0,width: 30.0,fit: BoxFit.cover), Text('Andy'), Spacer(), Icon(Icons.arrow_forward_ios_rounded, color: Colors.grey, size: 10.0,) ], ), ), onTap: () { Get.toNamed('/setting'); }, ), ), ], ), );
flutter3+dio请求流式输出
通过dio调用deepseek api接口，实现流式输出对话。
final response = await dio.post( '$baseURL/v1/chat/completions', options: Options( // 响应超时 receiveTimeout: const Duration(seconds: 60), headers: { "Content-Type": "application/json", "Authorization": "Bearer $apiKEY", }, // 设置响应类型为流式响应 responseType: ResponseType.stream, ), data: { // 多轮会话 'messages': widget.multiConversation ? chatStore.historySession : [{'role': 'user', 'content': editorValue}], 'model': 'deepseek-chat', // deepseek-chat对话模型 deepseek-reasoner推理模型 'stream': true, // 流式输出 'max_tokens': 8192, // 限制一次请求中模型生成 completion 的最大 token 数(默认使用 4096) 'temperature': 0.4, // 严谨采样 越低越严谨(默认1) } );
好了，以上就是flutter3.32调用deepseek搭建客户端ai对话的一些知识分享，希望对大家有点帮助！
