[发明专利]一种设计稿的转换方法、装置、计算机设备和存储介质

说明书

本公开提供了一种设计稿的转换方法、装置、计算机设备和存储介质，其中，该方法包括：根据获取的待处理的设计稿，确定设计稿对应的页面搭建信息；页面搭建信息包括设计稿对应的目标页面中的至少一个原子组件的信息；原子组件为设计稿对应的最小功能粒度的组件；基于预先设置的原子组件，按照页面搭建信息，构建设计稿对应的第一目标页面并展示在目标搭建系统中的第一位置区域；从第一目标页面中的多个原子组件中筛选与预设功能相对应的待替换组件，并利用目标搭建系统中预先编写的具有预设功能的目标组件替换待替换组件，并基于替换后的目标组件确定对第一目标页面更新后的第二目标页面。本公开实施例能够实现自动生成设计稿对应的目标页面。

技术领域

本公开涉及设计稿转代码技术领域，具体而言，涉及一种设计稿的转换方法、装置、计算机设备和存储介质。

背景技术

前端页面开发是一种创建WEB页面或APP(Application，应用程序)等前端页面并呈现给用户的过程。在将前端页面展示给用户时，需要终端从服务器、云平台等远程服务平台获取前端页面对应的程序代码，再通过对程序代码的处理，如编码运行、渲染等，得到前端页面并展示给用户。而针对前端页面开发的具体过程，通常需要页面设计人员先设计出前端页面对应的设计稿，再由程序编程人员将设计稿转换为前端页面对应的程序代码，进而基于该程序代码在终端渲染出设计稿对应的前端页面。

为了提高前端页面的开发效率，使用可视化的搭建系统进行前端页面的开发成为了一种常见的开发方式，具体的，利用人工辅助的方式，在可视化的搭建系统中对设计稿对应的各个页面组件进行拼装，如，通过人工拖拽的方式对各个页面组件进行拼装，进而，在可视化的搭建系统中根据拼装后的页面组件生成设计稿对应的目标页面及程序代码。但人工辅助的方式，大大增加了页面拼装的时间以及设计稿转代码的转化时间，从而降低了前端页面开发的效率。

发明内容

本公开实施例至少提供一种设计稿的转换方法、装置、计算机设备和存储介质。

第一方面，本公开实施例提供了一种设计稿的转换方法，包括：

根据获取的待处理的设计稿，确定所述设计稿对应的页面搭建信息；所述页面搭建信息包括所述设计稿对应的目标页面中的至少一个原子组件的信息；所述原子组件为所述设计稿对应的最小功能粒度的组件；

基于预先设置的原子组件，按照所述页面搭建信息，构建所述设计稿对应的第一目标页面并展示在目标搭建系统中的第一位置区域；

从所述第一目标页面中的多个原子组件中筛选与预设功能相对应的待替换组件，并利用所述目标搭建系统中预先编写的具有预设功能的目标组件替换所述待替换组件，并基于替换后的目标组件确定对所述第一目标页面更新后的第二目标页面。

在一种可能的实施方式中，所述从所述第一目标页面中的多个原子组件中筛选与预设功能相对应的待替换组件，并利用所述目标搭建系统中预先编写的具有预设功能的目标组件替换所述待替换组件，包括：

基于所述第一目标页面中的多个原子组件中每个原子组件的组件特征信息，从所述多个原子组件中筛选与预设功能相对应的待替换组件；

针对每个所述待替换组件，基于该待替换组件的组件特征信息，从所述目标搭建系统对应的预先编写的替换组件中，筛选具有与所述组件特征信息相匹配的预设功能的目标组件；

删除该待替换组件，并将与该待替换组件相匹配的目标组件插入至该待替换组件对应的组件位置。

在一种可能的实施方式中，所述从所述第一目标页面中的多个原子组件中筛选与预设功能相对应的待替换组件，并利用所述目标搭建系统中预先编写的具有预设功能的目标组件替换所述待替换组件，包括：

响应于对所述第一目标页面中的原子组件的第一选定操作，将选定的至少一个原子组件作为待替换组件；