Flutter AI/ChatGPT API

Integrate AI chatbots in your Flutter apps

🤖 What is ChatGPT API in Flutter?

ChatGPT API integration brings conversational AI to Flutter apps, enabling intelligent chatbots, content generation, and natural language processing. Build smart assistants that understand and respond to user queries naturally.


// Add to pubspec.yaml
dependencies:
  chat_gpt_sdk: ^2.2.5
  
// Initialize ChatGPT
final openAI = OpenAI.instance.build(
  token: 'your_api_key',
);
                                    

AI Integration Features

💬

Chat Completion

Create conversational AI chatbots with context. Maintain conversation history, understand user intent, and provide intelligent responses for customer support or virtual assistants.

✍️

Text Generation

Generate creative content automatically. Create articles, product descriptions, emails, or any text content using AI, saving time and enhancing productivity in your app.

🎨

Image Generation

Create images from text descriptions using DALL-E. Generate custom artwork, illustrations, or design concepts directly within your Flutter application using AI models.

🔍

Text Analysis

Analyze sentiment, extract keywords, summarize content. Use AI to understand text meaning, classify content, or provide intelligent search and recommendation features.

🔹 Setup ChatGPT Package

Add the ChatGPT SDK to your Flutter project:

# pubspec.yaml
dependencies:
  flutter:
    sdk: flutter
  chat_gpt_sdk: ^2.2.5
  http: ^1.1.0

Initialize OpenAI in your app:

import 'package:chat_gpt_sdk/chat_gpt_sdk.dart';

class ChatGPTService {
  static OpenAI? _instance;
  
  static OpenAI get instance {
    _instance ??= OpenAI.instance.build(
      token: 'your_openai_api_key',
      baseOption: HttpSetup(
        receiveTimeout: const Duration(seconds: 30),
      ),
    );
    return _instance!;
  }
}

🔹 Simple Chat Completion

Send a message and get AI response:

import 'package:chat_gpt_sdk/chat_gpt_sdk.dart';

Future sendMessage(String userMessage) async {
  final openAI = ChatGPTService.instance;
  
  final request = ChatCompleteText(
    messages: [
      Messages(
        role: Role.user,
        content: userMessage,
      ),
    ],
    maxToken: 200,
    model: GptTurbo0301ChatModel(),
  );
  
  final response = await openAI.onChatCompletion(request: request);
  
  if (response != null) {
    return response.choices[0].message?.content ?? 'No response';
  }
  
  return 'Error getting response';
}

🔹 Chat UI Widget

Build a simple chat interface:

class ChatScreen extends StatefulWidget {
  @override
  _ChatScreenState createState() => _ChatScreenState();
}

class _ChatScreenState extends State {
  final TextEditingController _controller = TextEditingController();
  final List> _messages = [];
  bool _isLoading = false;
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('AI Chat')),
      body: Column(
        children: [
          Expanded(
            child: ListView.builder(
              itemCount: _messages.length,
              itemBuilder: (context, index) {
                final message = _messages[index];
                final isUser = message['role'] == 'user';
                
                return Align(
                  alignment: isUser 
                    ? Alignment.centerRight 
                    : Alignment.centerLeft,
                  child: Container(
                    margin: EdgeInsets.all(8),
                    padding: EdgeInsets.all(12),
                    decoration: BoxDecoration(
                      color: isUser ? Colors.blue : Colors.grey[300],
                      borderRadius: BorderRadius.circular(12),
                    ),
                    child: Text(
                      message['content'] ?? '',
                      style: TextStyle(
                        color: isUser ? Colors.white : Colors.black,
                      ),
                    ),
                  ),
                );
              },
            ),
          ),
          if (_isLoading)
            Padding(
              padding: EdgeInsets.all(8),
              child: CircularProgressIndicator(),
            ),
          _buildInputField(),
        ],
      ),
    );
  }
  
  Widget _buildInputField() {
    return Padding(
      padding: EdgeInsets.all(8),
      child: Row(
        children: [
          Expanded(
            child: TextField(
              controller: _controller,
              decoration: InputDecoration(
                hintText: 'Type a message...',
                border: OutlineInputBorder(),
              ),
            ),
          ),
          IconButton(
            icon: Icon(Icons.send),
            onPressed: _sendMessage,
          ),
        ],
      ),
    );
  }
  
  void _sendMessage() async {
    // Send message logic
  }
}

🔹 Conversation with Context

Maintain conversation history for context-aware responses:

class ConversationManager {
  final List _conversationHistory = [];
  
  Future sendMessageWithContext(String userMessage) async {
    // Add user message to history
    _conversationHistory.add(
      Messages(role: Role.user, content: userMessage),
    );
    
    final openAI = ChatGPTService.instance;
    
    final request = ChatCompleteText(
      messages: _conversationHistory,
      maxToken: 300,
      model: GptTurbo0301ChatModel(),
    );
    
    final response = await openAI.onChatCompletion(request: request);
    
    if (response != null) {
      final aiMessage = response.choices[0].message?.content ?? '';
      
      // Add AI response to history
      _conversationHistory.add(
        Messages(role: Role.assistant, content: aiMessage),
      );
      
      return aiMessage;
    }
    
    return 'Error getting response';
  }
  
  void clearHistory() {
    _conversationHistory.clear();
  }
}

🔹 Image Generation with DALL-E

Generate images from text descriptions:

import 'package:chat_gpt_sdk/chat_gpt_sdk.dart';

Future generateImage(String prompt) async {
  final openAI = ChatGPTService.instance;
  
  final request = GenerateImage(
    prompt: prompt,
    n: 1,
    size: '512x512',
  );
  
  final response = await openAI.generateImage(request);
  
  if (response != null && response.data != null) {
    return response.data!.first?.url;
  }
  
  return null;
}

// Usage in widget
class ImageGeneratorScreen extends StatefulWidget {
  @override
  _ImageGeneratorScreenState createState() => _ImageGeneratorScreenState();
}

class _ImageGeneratorScreenState extends State {
  String? _imageUrl;
  bool _isLoading = false;
  
  Future _generateImage(String prompt) async {
    setState(() => _isLoading = true);
    
    final imageUrl = await generateImage(prompt);
    
    setState(() {
      _imageUrl = imageUrl;
      _isLoading = false;
    });
  }
  
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('AI Image Generator')),
      body: Center(
        child: _isLoading
          ? CircularProgressIndicator()
          : _imageUrl != null
            ? Image.network(_imageUrl!)
            : Text('Enter a prompt to generate image'),
      ),
    );
  }
}

🔹 Text Summarization

Summarize long text content using AI:

Future summarizeText(String longText) async {
  final openAI = ChatGPTService.instance;
  
  final request = ChatCompleteText(
    messages: [
      Messages(
        role: Role.system,
        content: 'You are a helpful assistant that summarizes text.',
      ),
      Messages(
        role: Role.user,
        content: 'Please summarize this text: $longText',
      ),
    ],
    maxToken: 150,
    model: GptTurbo0301ChatModel(),
  );
  
  final response = await openAI.onChatCompletion(request: request);
  
  if (response != null) {
    return response.choices[0].message?.content ?? 'No summary';
  }
  
  return 'Error generating summary';
}

🔹 Streaming Responses

Get real-time streaming responses for better UX:

Stream streamChatResponse(String userMessage) async* {
  final openAI = ChatGPTService.instance;
  
  final request = ChatCompleteText(
    messages: [
      Messages(role: Role.user, content: userMessage),
    ],
    maxToken: 200,
    model: GptTurbo0301ChatModel(),
  );
  
  final stream = openAI.onChatCompletionSSE(request: request);
  
  await for (final response in stream) {
    if (response.choices.isNotEmpty) {
      final content = response.choices[0].message?.content;
      if (content != null) {
        yield content;
      }
    }
  }
}

🧠 Test Your Knowledge

What package is commonly used for ChatGPT in Flutter?