• EN

流式布局样式模板

作者:eteams2025-04-22 16:03

一、功能背景

在传统表单设计流程中,开发者和设计师需要为不同终端(PC端、移动端)或不同业务模块重复调整布局样式,耗费大量时间且难以统一风格。此外,跨团队协作时,样式复用性低,导致效率低下、维护成本高。流式布局样式模板功能应运而生,旨在通过标准化、模块化的设计,解决样式不一致、开发效率低、协作困难等问题。


二、功能价值

提升搭建效率:通过预置模板或自定义模板快速套用样式,减少重复设计时间。

统一视觉风格:确保同一系统或模块的表单布局风格一致,提升用户体验。

灵活适应多端:区分PC端与移动端模板,适配不同设备的显示需求。

促进协作复用:支持模板跨团队共享,降低协作成本,避免重复造轮子。

简化维护流程:批量同步模板功能可快速更新全局样式,减少维护工作量。


、功能概述

流式布局样式模板功能提供了一套完整的表单样式管理方案,涵盖系统预置模板、用户自定义设计的模板、及针对PC端与移动端的端专属模板,支持通过导出和导入功能灵活复用、管理模板,并可随时删除冗余模板以保持模板库简洁。

用户既可单独为表单快速套用或初始化模板样式,也能通过批量同步功能一键将模板应用到指定模块的表单布局中,同时借助实时预览功能自动模拟各类字段组件的展示效果,方便直观调整设计。

此外,跨团队协作时,通过批量导入与模板共享机制,可高效分发和复用自定义模板,显著提升多团队协作效率与系统风格统一性。


四、业务流程图


五、功能详细说明

1.模板类型

系统模板:官方预置模板,支持直接在布局中进行套用使用、或初始化使用,或在使用后、使用布局样式设置微调、然后导出为新的自定义模板。泛微官方会不定期更新系统模板。

自定义模板:用户可在表单布局中,使用布局样式设置功能、完全自主设计模板。设计完成后导出为样式模板,再导入至样式模板列表中,方便后续快速使用,适配个性化需求。

PC端模板:PC端专用模板,在PC端布局中可套用或初始化使用。同样的,在PC端布局中导出的样式模板,也是PC端专用样式模板。

移动端模板:移动端专用模板,在移动端布局中可套用或初始化使用。同样的,在PC端布局中导出的样式模板,也是PC端专用样式模板。


2.自定义模板设计

自定义模板设计有两种方式:①在布局中完全自定义新建设计 ②在系统模板的基础上自定义设计

2.1 在布局中完全自定义新建设计

进入任意表单设计器中,点击布局中的灰色区域、或点击样式按钮,均可打开布局页面设置栏,进行自定义布局设计。

具体布局设计功能使用说明,可见:

https://eteams.cn/community/help/1974313000911493165


完成自定义布局设计后,在布局顶部的工具栏-更多中,点击【导出为样式模板】。

为自定义模板设置名称和预览图,名称和预览图都将展示在模板列表中,用于区别标识,因此建议使用自定义模板的实际预览效果、作为预览图,便于辨识。

点击【导出】,即可将自定义模板文件下载至本地。

导入后,按本文3.1的模板导入功能介绍操作导入即可。

 


2.2 在系统模板的基础上自定义设计

进入任意表单设计器中,点击布局页面设置栏中的【模板】,先使用一个模板,系统模板或已导入的自定义模板均可。

使用模板时,系统会将模板中预置的布局设计参数、直接覆盖填入当前的布局设置中,可根据自己的需求新增、或修改部分设计。

完成后,导出为样式模板、到对应系统的表单引擎后台-模板管理中导入使用即可,使用方式同上述自定义设计模板的导出和导入。

  


3.模板管理

3.1 模板导入

需要在哪个系统使用这个自定义模板,就进入这个系统的【后台管理中心】-【表单引擎】-【样式模板】-【流式布局】,点击【模板导入】。

上传刚刚下载到本地的自定义样式模板文件,点击【导入】即可。

导入后,即可见自定义模板已导入至模板列表的最后,在布局中使用初始化、或使用模板时、均可看到并使用此模板。

  

  

3.2 模板预览

对于任意模板,均可使用【预览】功能吃,查看模板的预计效果。

在模板列表中,找到需要预览的模板,鼠标移入,可见预览图标,点击后、系统将新开标签页,自动展示此模板在各类字段上的实际效果。

  


3.3 模板删除

自定义模板支持删除,系统模板不可删除。

删除后,模板列表里将不再展示此模板,但通过初始化、或应用模板功能使用模板的布局效果,不会受到影响。

删除操作后不可找回,请谨慎操作!



六、应用场景示例

1.单布局应用

1.1 初始化

可在需要使用此样式模板的布局设计器中,点击初始化,选择此样式模板应用即可。

 

1.2 套用模板

可在需要使用此样式模板的布局设计器中,在右侧布局设置栏-【模板】tab中,找到需要使用的样式模板,直接点击【使用】即可


2.批量应用

点击【后台管理中心】-【表单引擎】-【样式模板】-【流式布局】,任意模板上的【同步模板】功能,即可选择同一表单下的多个或所有布局、批量应用此模板。

批量应用时,可选择新增应用、或覆盖应用,但无论何种应用方式,字段的布局属性并不会改变,布局内的字段顺序也不会改变,即同1.2套用模板的效果。

  


3.跨团队共享

通过【后台管理中心】-【表单引擎】-【样式模板】-【流式布局】上的【批量导出】功能,布局上的【导出为样式模板】功能,与【模板导入】功能组合使用,即可实现模板的跨团队分发与复用。


七、上下游关联功能点

流式布局-布局设计

初始化布局


八、注意点

1.应用模板时的使用技巧:

1.1 使用时,如需和模板保持一模一样的效果,建议勾选【清空布局中所有字段的组件样式】,勾选保存后,系统将把布局中所有单独设置的字段样式都一并清除、然后应用样式模板,即最后的效果、会和样式模板几乎一模一样。

1.2 如此前已在布局中、针对部分字段、设置了比较重要、需要保留的字段样式,则什么都不用勾选,直接点击保存使用即可。应用效果为:字段样式设置、会优先级于样式模板的布局样式生效。即:整体是样式模板的效果,个别字段还是按此前设置的样式生效。

  


2.初始化与套用模板的效果区别:

初始化功能,适合使用的场景为:

场景一:新建表单时,先在字段管理中批量新建了字段,尚未设计过任何布局,需要快速构建布局的情况。

场景二:需要重新构建一个新布局,不复用原有布局上的字段设置和排布的情况。

因此使用初始化功能时,第二步中、系统会引导设置需要放入布局的字段、分组、明细表,并支持直接调整摆放顺序,以保证按设置项、为用户一步生成布局。

注:初始化后,字段的布局属性、在此布局中将会被重置为默认值,如需保留字段的布局属性值、请使用套用模板功能。

Download Log in Enable for free

Scan with WeChat to register and install

在线咨询
  • WeCom service group

    另存
  • Pre-sales consultant

    另存
  • QQ group

    413040701

    Join

Follow us

021-50388680

sales@eteams.cn

Live