Hi,
I've started developing an MCP QML and QML tooling for QtQuick. Currently,
it supports several similarities to Chrome dev tools + Chrome MCP. I've
tested it on Claude and it works very well.
This tool offers the QSG tree and uses a WebSocket protocol to receive
requests for AI tools like Claude. It works wonders for live editing, and I
suspect it also works for automated testing on GUI.
At my company we are pushing to opensource it, as creating autotesting
tools or AI MCPs and whatnot isn't part of our business model. If it sparks
enough interest it would be much better to offer it to the community.
*Expected Usage Flow*
> 1. Compile the IntrospectServer plugin (Phase 1):
> make && make install
>>
>> 2. Add to the app's QML:
>> import mx.edis.debug 1.0
>> Window { EdisMcpServer { port: 7003 } ... }
>> 3. Compile the MCP server (Phase 2):
>> cd tools/mcp-qml && npm install && npm run build
>> 4. Configure .mcp.json in the project
>> 5. Start the Qt Quick app
>> 6. Open Claude Code in the project
>> Claude Code automatically:
>> - Launches the MCP server as a subprocess
>> - Detects the tools: qml_snapshot, qml_screenshot, etc.
>> - Can use them when the user asks to design/modify QML
>> Example session:
>> User: "Move the title 50px to the right"
>> Claude: qml_snapshot() -> sees the tree, finds Text id "0.0.0"
>> Claude: qml_get_property("0.0.0", "x") -> 100
>> Claude: qml_set_property("0.0.0", "x", 150) -> ok
>> Claude: qml_screenshot() -> verifies visually
>> Claude: "Done, moved the text from x:100 to x:150"
>
>
Also, I tested it by offering a crude PNG to Claude Code and magically
having it create a quick UI prototype. *Turn hand sketches into UI in
seconds! Perfect them in minutes!*
Ariel
--
Ariel Molina R.
+52 2226 758874
[image: EDIS] <http://edis.mx>
--
Development mailing list
[email protected]
https://lists.qt-project.org/listinfo/development
