使用 Compose Driver 编写 Vibe 移动应用

Source: Dev.to

它是什么？

Compose Driver 是一个库和 Gradle 插件，能够让 AI 代理 驱动 你的 Jetpack Compose 应用。它通过将 UI 包装在一个测试套件中来监听 HTTP 请求。

这意味着你可以让 AI 代理：

• 查询 UI，查看屏幕上有哪些按钮或文字。
• 交互，通过点击、滑动或输入文字。
• 验证 结果，方式包括打印 UI 树、截取屏幕截图或录制 GIF。

它在 JVM 上 无头 运行，因此速度快且可以在任何地方运行，非常适合后台或云端代理。它同时支持 Desktop/Multiplatform Compose 和 Android Jetpack Compose（通过 Robolectric）。

工作原理

核心实现 不到 300 行。它启动一个小型本地服务器，将 HTTP 请求转换为标准的 ComposeUiTest 操作。

runComposeUiTest { uiTest ->
    // Set the application content.
    // There is also a /reset endpoint to change this content at runtime.
    uiTest.setContent { MyApplication() }

    startServer {
        get("/click") { request ->
            val matcher = request.node()          // Find the node (e.g. by tag or text)
            uiTest.onNode(matcher).performClick() // Perform the click
            uiTest.waitForIdle()                  // Wait for animations to settle (advancing the virtual clock time)
            request.respondText("ok")             // Tell the agent it's done
        }
        get("/screenshot") { request ->
            val node = request.node()
            val image = uiTest.onNode(node).captureToImage()
            request.respondPng(image)
        }
        // …
    }
}

这个简单的循环让代理能够像用户一样导航应用，但速度更快，因为它可以使用虚拟时钟加速动画。

该方法依赖于 Jetpack Compose 强大的测试 API，这些 API 提供了对 UI 时钟和输入注入的细粒度控制，同时保持与渲染平台的解耦。

试玩一下

为了演示，我构建了一个简易的 Instagram 风格克隆。向代理发送 “构建一个 Instagram UI 克隆” 或 “改进应用并添加缺失功能” 的提示后，代理会在一次运行中导航菜单、点击按钮并添加五个新页面。原型在不到一小时的时间里完成，使用了大约十次提示。

以下是它实际运行的短视频：

(出于简洁省略视频嵌入)

关于可靠性的一点说明

Compose Driver 并不能神奇地解决使用 AI 构建移动应用的所有挑战。对于生产环境，仍然需要审查生成的代码并理解代理的决策。然而，对于业余项目、原型或实验，它提供了一个快速的反馈循环，能够显著提升开发体验。

为 AI 代理提供验证其工作成果的工具往往能提升生成代码的质量，因为它们可以闭环反馈并自主迭代。

快去看看

如果你对移动端的代理工作流感兴趣，或者只是想尝试一下，代码是开源的：

https://github.com/jdemeulenaere/compose-driver

仓库中包含一个 sample/ 项目，你可以在喜欢的 AI 支持编辑器中打开，快速上手。希望它对你有帮助——欢迎告诉我你的想法！