首页 > 基础资料 博客日记
Flutter3.41+DeepSeek智能AI应用|flutter3+getx+dio流式ai对话app模板
2026-04-07 12:30:02基础资料围观1次
2026重磅研发flutter3.41.5+dart3.11+deepseek api跨平台ai智能对话程序。
deepseek-flutter3-ai:最新跨平台技术Flutter3.41+Dart3+Dio+Getx+Markdown聚合DeepSeek-chat实战AI流式打字智能会话模板。新增深度思考模式、latex公式、mermaid图表,代码高亮/复制代码、图片预览、链接、表格等功能。


项目技术框架
- 编辑器:Vscode
- 跨平台框架:Flutter3.41.5+Dart3.11
- 大模型框架:DeepSeek-V3.2
- 网络请求:dio^5.9.2
- 路由/状态管理:get^4.7.3
- 本地存储:get_storage^2.1.1
- markdown解析:flutter_markdown_plus^1.0.7
- 高亮插件:flutter_highlight^0.7.0
- latex插件:flutter_markdown_plus_latex^1.0.5
- mermaid插件:flutter_mermaid^0.1.0
- 弹框组件:shirne_dialog^4.9.0
- 图片预览:easy_image_viewer^1.5.1
- 环境变量插件:flutter_dotenv^6.0.0



功能清单/支持性
- Flutter3.41搭建项目,接入DeepSeek-V3,对话丝滑流畅
- 新增深度思考
- 新增latex数学公式
- 新增mermaid图表渲染
- 支持代码块横向滚动、代码高亮/复制代码、多轮上下文会话、本地存储对话
- 支持图片预览、链接跳转、表格
- 支持手机端/桌面端750px显示


项目框架目录
flutter3_deepseek_ai基于最新跨平台框架 Flutter3.41 搭建项目,聚合DeepSeek聊天大模型。

flutter3-deepseek跨平台ai项目已经更新到我的原创作品小铺,欢迎下载使用。

Flutter环境变量配置
在项目根目录下新建一个.env文件,用于配置一些环境变量参数。

申请一个deepseek apikey,并替换.env文件里的key,即可体验流式对话功能。
# 项目名称 APP_NAME = 'Flutter3-DeepSeek' # DeepSeek API配置 DEEPSEEK_API_KEY = your apikey DEEPSEEK_BASE_URL = https://api.deepseek.com
项目入口配置main.dart
import 'dart:io'; import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; import 'package:get/get.dart'; import 'package:get_storage/get_storage.dart'; import 'package:shirne_dialog/shirne_dialog.dart'; import 'package:flutter_dotenv/flutter_dotenv.dart'; import 'controller/app.dart'; import 'controller/chat.dart'; // 引入路由配置 import 'router/index.dart'; void main() async { // 初始化存储服务 await GetStorage.init(); // 将.env文件内容加载到dotenv中 await dotenv.load(fileName: '.env'); // 注册GetxController Get.put(AppStore()); Get.put(ChatStore()); runApp(const MyApp()); } class MyApp extends StatelessWidget { const MyApp({super.key}); @override Widget build(BuildContext context) { // 获取AppStore实例 final appStore = AppStore.to; return AnnotatedRegion( value: SystemUiOverlayStyle( /** * 修复flutter3.32以上会出现底部导航栏背景黑色 * The bottom navigation bar is always black from flutter: 3.32.1. * It's working fine on flutter: 3.29.3 */ systemNavigationBarColor: Colors.transparent, systemNavigationBarIconBrightness: Brightness.dark, ), child: GetMaterialApp( title: 'Flutter3-DeepSeek', debugShowCheckedModeBanner: false, theme: ThemeData( colorScheme: ColorScheme.fromSeed(seedColor: Color(0xFF5842F2)), useMaterial3: true, fontFamily: Platform.isWindows ? 'Microsoft YaHei' : null, ), // 初始路由 initialRoute: appStore.isLogin ? '/' : '/login', // 路由页面 getPages: routePages, // 初始弹窗key navigatorKey: MyDialog.navigatorKey, localizationsDelegates: [ // Add your ShirneDialogLocalizations delegate here ShirneDialogLocalizations.delegate, ], ), ); } }
在项目开发过程中,发现flutter3.32以上会出现底部导航栏背景黑色,github上面已经有人提出相应问题。可以试试通过如下设置修复。
SystemUiOverlayStyle(
systemNavigationBarColor: Colors.transparent,
systemNavigationBarIconBrightness: Brightness.dark,
)


支持运行到桌面windows端,750px宽度展示布局。






项目通用布局

项目整体布局结构如上图所示
@override Widget build(BuildContext context) { return Scaffold( key: scaffoldKey, backgroundColor: Colors.white, appBar: AppBar( ... actions: [ IconButton(icon: Icon(Icons.try_sms_star_outlined), onPressed: () => handleCreate(),), ], ), body: Center( child: ConstrainedBox( constraints: BoxConstraints( maxWidth: 750.0, ), child: Flex( direction: Axis.vertical, crossAxisAlignment: CrossAxisAlignment.start, children: [ Expanded( child: Stack( children: [ GestureDetector( child: ScrollConfiguration( behavior: CustomScrollBehavior().copyWith(scrollbars: false), // GetBuilder响应流式输出 child: Obx(() { if (chatStore.currentMessages.isEmpty) { // 欢迎信息 return Welcome( onChanged: (value) { textEditingController.text = value; }, ); } return ListView.builder( keyboardDismissBehavior: ScrollViewKeyboardDismissBehavior.onDrag, // 当滚动时候隐藏键盘 controller: scrollController, padding: EdgeInsets.all(10.0), reverse: true, shrinkWrap: true, itemCount: chatStore.currentMessages.length, itemBuilder: (context, index) { ... } ); }), ), onTap: () { focusNode.unfocus(); }, ), // 滚动到底部 AnimatedPositioned( ... ), ], ), ), // 底部编辑器区域 ChatEditor(controller: textEditingController), ] ), ), ), // 侧边栏 drawer: Drawer( child: Sidebar(), ), ); }

Flutter3+Get路由配置
import 'package:flutter/material.dart'; import 'package:get/get.dart'; import '../controller/app.dart'; /* 引入路由页面 */ import '../pages/auth/login.dart'; import '../pages/auth/register.dart'; import '../pages/index/index.dart'; import '../pages/aihub/index.dart'; import '../pages/setting/index.dart'; // 路由地址集合 final Map<String, Widget> routes = { '/': Home(), '/aihub': Aihub(), '/setting': Setting(), }; final List<GetPage> routeList = routes.entries.map((e) => GetPage( name: e.key, // 路由名称 page: () => e.value, // 路由页面 transition: Transition.rightToLeftWithFade, // 跳转路由动画 middlewares: [RouteMiddleware()], // 路由中间件 )).toList(); final List<GetPage> routePages = [ GetPage(name: '/login', page: () => const Login()), GetPage(name: '/register', page: () => const Register()), ...routeList, ]; // 路由中间件拦截验证 class RouteMiddleware extends GetMiddleware { final appStore = AppStore.to; @override RouteSettings? redirect(String? route) { return appStore.isLogin ? null : const RouteSettings(name: '/login'); } }















Flutter3+Dio对接DeepSeek实现流式输出
// 调用deepseek接口 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': chatStore.getSetting('thinkingEnabled') ? 'deepseek-reasoner' : 'deepseek-chat', // deepseek-chat对话模型 deepseek-reasoner推理模型 'stream': true, // 流式输出 'max_tokens': 8192, // 限制一次请求中模型生成 completion 的最大 token 数(默认使用 4096) 'temperature': 0.4, // 严谨采样 越低越严谨(默认1) } );

Ok,以上就是Flutter3+Dart3对接Deepseek搭建跨平台AI流式对话应用的一些项目分享,希望对大家有点帮助!
附上一些最新项目实战项目
Electron41+Vite8.0+DeepSeek桌面端AI助手|electron+vue3流式ai系统
uniapp+deepseek流式ai助理|uniapp+vue3对接deepseek三端Ai问答模板
Vite8+DeepSeek网页版AI助手|vue3+arco本地web版ai流式打字问答系统
vite8.0+deepseek流式ai模板|vue3.5+vant4+markdown打字输出ai助手
tauri2.10+deepseek+vite7客户端ai系统|Tauri2+Vue3.5桌面AI程序Exe
Electron38-Vue3OS客户端OS系统|vite7+electron38+arco桌面os后台管理
electron38-admin桌面端后台|Electron38+Vue3+ElementPlus管理系统
Electron38-Wechat电脑端聊天|vite7+electron38仿微信桌面端聊天系统
最新版Flutter3.38+Dart3.10仿写抖音APP直播+短视频+聊天应用程序
最新版uniapp+vue3+uv-ui跨三端短视频+直播+聊天【H5+小程序+App端】
最新版uni-app+vue3+uv-ui跨三端仿微信app聊天应用【h5+小程序+app端】
Flutter3-MacOS桌面OS系统|flutter3.32+window_manager客户端OS模板

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:jacktools123@163.com进行投诉反馈,一经查实,立即删除!
标签:

