Flutter + dart_mcp + AI Desktop App Demo
@leehack
About Flutter + dart_mcp + AI Desktop App Demo
Demonstrate how to implement MCP Client in Flutter application with AI.
Overview
What is Flutter + dart_mcp + AI Desktop App Demo?
Flutter + dart_mcp + AI Desktop App Demo is a Flutter-based desktop application that manages and configures MCP (Model Context Protocol) servers. It uses the mcp_dart package for communication and integrates with Google’s Gemini model via an API key. This demo is designed for developers exploring MCP and building AI‑powered chat applications.
How to use Flutter + dart_mcp + AI Desktop App Demo?
Clone the repository, run flutter pub get to install dependencies, then flutter run to launch the app. Obtain a Gemini API key from Google AI Studio and enter it in the Settings screen. Use the MCP server management screen to add, edit, delete, and toggle stdio‑based MCP servers, define custom environment variables per server, and apply changes.
Key features of Flutter + dart_mcp + AI Desktop App Demo
- API key management (save/clear/secure) via SharedPreferences
- Add, edit, delete, and toggle MCP server connections
- Custom environment variables for each server configuration
- Display settings to toggle code block visibility
- Supports stdio‑based MCP servers only
- Built with Flutter and the dart_mcp package
Use cases of Flutter + dart_mcp + AI Desktop App Demo
- Manage multiple MCP server configs in a graphical interface
- Test and debug custom stdio‑based MCP servers
- Experiment with Gemini AI chat combined with MCP tool calls
- Customize server arguments and environment variables for different protocols
- Learn how to integrate MCP into a Flutter desktop app
FAQ from Flutter + dart_mcp + AI Desktop App Demo
What is this application?
It is a Flutter desktop demo for managing MCP servers and using them with Google’s Gemini AI model via an API key.
Which MCP servers are supported?
Currently only stdio‑based MCP servers are supported. You can find example servers in the official MCP servers repository.
How do I get an API key?
You can obtain a Gemini API key from Google AI Studio (aistudio.google.com/apikey) and save it in the app’s Settings screen.
How do I add a new MCP server?
Click the “Add New MCP Server” button, fill in the name, command, arguments, and optional custom environment variables, then save. Use the toggle switch to enable the connection and click “Apply” to synchronize.
Is this application free and open‑source?
Yes, it is licensed under the MIT License. No pricing or usage limits are mentioned.
Basic information
More Desktop Chat MCP clients
HomunculAi
KrookedLillyA transparent desktop overlay that gives your AI agent a visual presence on screen. Your AI picks its own body from a library of avatars, colors, and expressions or draws it's own in SVG. Windows, $4.99, 7-day free trial, no account required.
UI-TARS Desktop
bytedanceA GUI Agent application based on UI-TARS(Vision-Language Model) that allows you to control your computer using natural language.
Console Chat Gpt
amidabuddhaPython CLI for AI Chat with MCP support
PROTON-MCP
just-an-oldsaltA local-only macOS Model Context Protocol server that exposes your Proton Mail account to Claude Desktop and Claude Code via Touch-ID-gated tool calls.
STATIONONE
KochavaStationOne is a local-first, model-agnostic AI client and orchestration layer that enables users to build, run, and manage agentic workflows across multiple LLMs and MCP connectors. It provides a unified workspace for integrating AI models, tools, and data sources through the Mod
Comments