codegeex 可根据中文描述一键生成可运行的 flutter 界面代码，支持注释驱动单页生成、侧边栏多页导航结构生成及在线体验版导入三种方式，需确保插件为 tongyi lab 官方版本并正确识别 flutter 环境。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你需要在 VSCode 里用 CodeGeeX 直接生成可运行的 Flutter 界面代码，而不是手动写 StatelessWidget 或 Scaffold 结构，也不希望反复调试布局错位或颜色不匹配——CodeGeeX 能根据中文描述一键输出带完整 Widget 树、主题色、响应式适配的 Dart 文件。
确认 CodeGeeX 插件已就绪且识别 Flutter 环境
打开 VSCode，点击左侧扩展图标 → 搜索“CodeGeeX” → 确保安装的是由“Tongyi Lab”发布的官方插件（图标为蓝白齿轮+AI），而非同名第三方插件。
在任意空白 .dart 文件中输入 import 'package:flutter/material.dart'; 后回车，观察右下角状态栏是否显示“Dart SDK 3.4+”和“Flutter SDK x.x.x”。若显示“unresolved import”或无 Flutter 版本号，【说明 CodeGeeX 尚未加载 Flutter 上下文，此时生成的代码可能缺失 MaterialApp 或 Scaffold 包裹，无法直接运行】。
重启 VSCode，再打开一个已有 Flutter 项目根目录（含 pubspec.yaml），让插件自动探测到 flutter 命令路径。
方法一：注释驱动生成单页界面（推荐新手）
步骤一：在 lib/main.dart 中删除原有 runApp() 及 MyApp 类，新建一个空文件命名为 login_page.dart。
步骤二：在文件顶部写一行清晰中文注释，例如：“生成一个带邮箱输入框、密码输入框、记住我复选框、蓝色登录按钮的 Flutter 登录页，使用深灰色背景和白色卡片，按钮点击后跳转到首页”。
步骤三：将光标置于注释正下方，按 Ctrl+Enter（Windows）或 Cmd+Enter（Mac）唤出 CodeGeeX 面板。
步骤四：点击“生成代码”，等待 3～8 秒，面板返回完整 Dart 类（含 StatefulWidget 或 StatelessWidget 声明、build 方法、必要 import）。确认代码无红色波浪线后，按 Tab 键插入当前文件。
这一步操作起来很简单，直接把文件拖进去就行。但注意：如果注释里没提“Flutter”或“Dart”，模型可能默认输出 HTML/CSS，必须明确限定技术栈。
方法二：侧边栏对话生成多页面导航结构
点击 VSCode 左侧活动栏 CodeGeeX 图标 → 切换到 “Ask CodeGeeX” 标签页 → 在输入框中输入：
“请生成一个 Flutter 电商 App 的首页 + 商品列表页 + 购物车页三页导航结构。首页含顶部搜索栏、轮播图、分类网格；商品列表页带下拉刷新、无限加载、每项含图片+标题+价格；购物车页显示商品缩略图、名称、数量增减按钮、结算总价。所有页面使用 CupertinoTabScaffold，底部 TabBar 固定，主题色为 #FF6B6B。”
按下回车，等待模型返回三个独立 .dart 文件代码块（home_page.dart / product_list.dart / cart_page.dart），每个文件都包含完整 import、class 定义和 build 方法。
复制第一个文件内容 → 新建 home_page.dart → 粘贴 → 重复操作创建另两个文件。不要合并到一个文件里，否则路由跳转会报错。
方法三：在线体验版生成后导入 VSCode
访问 codegeex.cn → 点击“体验版” → 选择“Flutter 页面生成”模板 → 输入需求：“生成一个暗色模式切换开关的设置页，开关右侧显示当前模式文字（深色/浅色），点击切换时整个页面背景和文字颜色实时变化”。
点击生成 → 复制返回的完整 main.dart 代码 → 在 VSCode 中新建项目（Flutter: New Project）→ 替换 lib/main.dart 全部内容 → 运行前先执行 flutter pub get 拉取依赖。
这个方法绕过本地插件兼容性问题，适合 VSCode 插件异常时救急。但生成的代码不含本地项目路径引用，需手动调整 import 路径。
