Yuanhao Feng

返回

LowCodePlatform

拖拽式低代码编辑器,页面数据就是 JSON,大模型也能直接写。

编辑器#

LowCodePlatform 是一个拖拽式页面编辑器。左边组件列表,中间画布,右边属性面板。组件从列表拖进画布,落点即位置,可以单选、框选、整体移动。属性面板管尺寸、字号、颜色、圆角、层级和旋转。

六种基础组件:文本、按钮、输入框、图片、视频、线段,都在同一张注册表里声明。注册表提供列表预览和画布渲染,加一种组件就是加一条登记。

大模型写页面#

画布上的页面在系统里就是一个 JSON 数组,每项是一个组件对象,带坐标、尺寸、样式字段。给模型六种组件的默认对象和一个成品示例,要求只输出数组,返回的就是编辑器自己的数据。

生成的页面双击渲染,渲染后照样能拖、能改属性、能撤销,和手工搭的没有区别。开头没思路的时候让模型出一版再手动收尾,这条路走得通。

组件交互写成事件字符串,格式 触发条件(事件(参数)),参数支持 {组件-id.属性} 插值。click(href({input-0.value})) 就是点击后跳到输入框里的地址。

导出#

四种出口:预览页、画布截图、内联样式的独立 HTML 文件,以及发布到后端拿到访问地址。发布过的页面可以回看和删除。