Flutter 教程概览¶

本系列教程将帮助你在 Flutter 应用中集成 API Nexus 的 AI 能力。

Flutter Demo 应用总览¶

我们提供了一个完整的示例应用，包含 5 大功能模块：

Flutter Demo 应用概览

左侧导航栏：5 个功能入口 → 点击即可切换页面

📚 推荐学习路径¶

基础入门:  快速入门 → 文本对话 → 图像生成 → 音频处理
           ↓
进阶应用:  向量计算 → 多模态识图

功能页面导航¶

	页面	截图位置	难度
💬	文本对话	`01-home-chat.png`	⭐ 基础
🖼️	图像生成	`02-image-generation.png`	⭐ 基础
🔗	向量计算	`03-embedding.png`	⭐⭐ 进阶
👁️	多模态识图	`04-vision.png`	⭐⭐ 进阶
🔊	音频处理	`05-audio.png`	⭐ 基础

目录导航¶

教程	主要功能	难度
快速入门	环境配置、项目初始化、首次 API 调用	基础
文本对话	ChatGPT 风格对话、流式输出、多轮上下文	基础
图像生成	DALL-E / Flux 图像生成，预览与下载	基础
向量计算	文本向量化、余弦相似度、语义搜索	进阶
多模态识图	图片理解、OCR 文字提取、本地图片上传	进阶
音频处理	TTS 文本转语音、音色选择、播放控制	基础

环境要求¶

Flutter 3.10+ / Dart 3.0+
有效的 API Nexus API Key
iOS 13.0+ / Android 6.0+ / Windows 10+ / macOS 11+ / Linux (Desktop)

快速开始三步¶

1. 添加依赖¶

dependencies:
  flutter:
    sdk: flutter
  http: ^1.2.0
  provider: ^6.1.0
  flutter_dotenv: ^5.1.0
  cached_network_image: ^3.4.0
  audioplayers: ^6.1.0
  fl_chart: ^0.68.0
  file_picker: ^8.0.0

2. 配置 API Key¶

在项目根目录创建 .env 文件：

APINEXUS_API_KEY=your_api_key_here
APINEXUS_BASE_URL=https://apinexus.net/v1

3. 初始化并调用¶

import 'package:flutter/material.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() async {
  await dotenv.load(fileName: ".env");
  runApp(const MyApp());
}

Future<String> callChatApi(String message) async {
  final response = await http.post(
    Uri.parse('${dotenv.env['APINEXUS_BASE_URL']!}/chat/completions'),
    headers: {
      'Content-Type': 'application/json',
      'Authorization': 'Bearer ${dotenv.env['APINEXUS_API_KEY']!}',
    },
    body: json.encode({
      'model': 'gpt-4o-mini',
      'messages': [{'role': 'user', 'content': message}],
    }),
  );
  final data = json.decode(response.body);
  return data['choices'][0]['message']['content'];
}

相关资源¶

下一步: 阅读快速入门完成项目初始化