一种素材叠加元素的自适应编辑与同步控制方法及系统与流程

本发明涉及游戏素材配置，尤其涉及一种素材叠加元素的自适应编辑与同步控制方法及系统。

背景技术：

1、在游戏运营、广告投放、活动页面配置等场景中，通常需要在游戏素材底图上叠加logo、推荐标签、活动角标、状态标识等元素，以实现图文混排和个性化视觉呈现。现有方案多采用固定坐标、固定尺寸或基于简单拖拽插件的方式实现叠加元素的编辑，但在实际应用中存在以下技术问题：

2、第一，当不同素材的原始尺寸差异较大时，操作容器尺寸与素材实际显示尺寸不一致，加之缺少动态坐标映射机制，导致拖拽过程中的坐标换算、缩放比例和元素的最终落点发生偏差，影响编辑精度。

3、第二，在素材图片尚未加载完成时即初始化操作区，容易导致操作区的高度、宽度以及比例锁定状态基于错误的或临时的渲染尺寸进行计算，造成后续编辑时操作边界失准、元素定位错误。

4、第三，多个叠加元素共存时，缺乏对元素之间的范围约束、层级关系和互斥规则的系统管理，容易产生拖拽超出可编辑区域、层级覆盖异常、多个互斥元素同时显示等问题，导致元素之间相互干扰，增加编辑出错的概率。

5、第四，用户每一次拖拽、缩放、样式修改等操作缺少统一、可追溯的操作指令记录机制，难以基于操作前后的状态变化实现稳定的撤销、重做功能，影响编辑体验和操作容错能力。

6、第五，在多人协同编辑的场景中，现有方案通常仅同步最终画面或整体编辑数据，无法对具体操作过程进行冲突检测和处理，难以保证多个协作者操作之间的实时同步与一致性。

技术实现思路

1、本发明的目的在于提供一种素材叠加元素的自适应编辑与同步控制方法及系统，实现了不同尺寸素材下叠加元素的精准自适应编辑、冲突自动修正与多人协同编辑的实时同步，兼具高精度、低冲突和操作可回溯性，以解决上述现有技术问题的至少之一。

2、第一方面，本发明提供了一种素材叠加元素的自适应编辑与同步控制方法，所述方法具体包括：

3、响应于用户选中底图素材，获取底图素材的原始尺寸、操作容器尺寸及叠加元素数据，基于原始尺寸和操作容器尺寸计算动态scale，建立底图坐标系与显示坐标系的映射关系；

4、根据叠加元素数据和映射关系初始化叠加元素的显示状态、图层状态及容器约束规则，在素材图片加载前将操作区置为未锁定状态并清除历史操作边界，在素材图片加载完成后根据实际渲染尺寸重置操作区并锁定比例；

5、基于锁定后的操作区接收叠加元素操作，将显示坐标换算为底图坐标，并结合容器约束规则判断是否存在范围冲突、层级冲突与互斥冲突，若存在冲突则拦截原操作并生成限定于对应容器内的修正操作；

6、根据修正操作或未冲突操作更新叠加元素数据，将操作前后状态、元素标识、位置尺寸及图层信息封装为操作指令；

7、基于操作指令实时渲染画布、通过websocket同步协作者，并在接收远端操作或撤销/重做时，结合ot或crdt规则及操作指令栈执行合并、逆向或重放操作。

8、第二方面，本发明提供了一种素材叠加元素的自适应编辑与同步控制系统，所述系统具体包括：

9、素材获取模块，用于响应于用户选中底图素材，获取底图素材的原始尺寸、操作容器尺寸及叠加元素数据，基于原始尺寸和操作容器尺寸计算动态scale，建立底图坐标系与显示坐标系的映射关系；

10、素材加载模块，用于根据叠加元素数据和映射关系初始化叠加元素的显示状态、图层状态及容器约束规则，在素材图片加载前将操作区置为未锁定状态并清除历史操作边界，在素材图片加载完成后根据实际渲染尺寸重置操作区并锁定比例；

11、冲突判断模块，用于基于锁定后的操作区接收叠加元素操作，将显示坐标换算为底图坐标，并结合容器约束规则判断是否存在范围冲突、层级冲突与互斥冲突，若存在冲突则拦截原操作并生成限定于对应容器内的修正操作；

12、指令封装模块，用于根据修正操作或未冲突操作更新叠加元素数据，将操作前后状态、元素标识、位置尺寸及图层信息封装为操作指令；

13、操作执行模块，用于基于操作指令实时渲染画布、通过websocket同步协作者，并在接收远端操作或撤销/重做时，结合ot或crdt规则及操作指令栈执行合并、逆向或重放操作。

14、第三方面，本发明提供了一种计算机设备，包括：存储器和处理器及存储在存储器上的计算机程序，当所述计算机程序在处理器上被执行时，实现如上述方法中任一项所述的素材叠加元素的自适应编辑与同步控制方法。

15、第四方面，本发明提供了一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器运行时，实现如上述方法中任一项所述的素材叠加元素的自适应编辑与同步控制方法。

16、与现有技术相比，本发明具有以下技术效果的至少之一：

17、1、实现了不同尺寸素材下叠加元素的精准自适应编辑、冲突自动修正与多人协同编辑的实时同步，兼具高精度、低冲突和操作可回溯性。

18、2、通过基于底图素材的原始尺寸和操作容器尺寸计算动态scale，并建立底图坐标系与显示坐标系的双向映射关系，使得叠加元素的位置和尺寸能够准确地在两种坐标系之间转换，无论素材尺寸如何变化，均能保证拖拽坐标、缩放比例和最终落点与底图准确对应，避免偏差。

19、3、在素材图片加载前将操作区置为未锁定状态并清除历史操作边界，在素材加载完成后根据实际渲染尺寸重置操作区并锁定比例，有效规避了因图片未完全加载导致的尺寸计算错误，确保操作区的边界、比例和控制点位置与底图实际显示一致，提高了操作精度。

20、4、根据叠加元素所属容器、编辑权限和图层状态生成容器约束规则，在接收编辑操作时，将显示坐标换算为底图坐标，并基于容器约束规则判断是否存在范围冲突、层级冲突与互斥冲突；当冲突发生时拦截原操作并生成限定于对应容器内的修正操作，使元素始终在允许的区域内活动，并自动维持正确的层级关系和互斥关系，避免了元素之间的相互干扰。

21、5、将操作前后状态、元素标识、位置尺寸及图层信息封装为统一的原子化操作指令，构建可追溯的操作记录，从而能够通过操作指令栈稳定地支持撤销、重做功能，使编辑过程具备更高的容错性和可回溯性。

22、6、基于操作指令实时渲染本地画布，并通过websocket同步协作者；在接收远端操作或执行撤销/重做时，结合ot或crdt规则及操作指令栈执行合并、逆向或重放操作，实现了对并发操作的有效冲突处理和实时状态同步，保证了多人协同编辑下操作的一致性和流畅性。

1.一种素材叠加元素的自适应编辑与同步控制方法，其特征在于，所述方法具体包括：

2.根据权利要求1所述的方法，其特征在于，所述基于原始尺寸和操作容器尺寸计算动态scale，建立底图坐标系与显示坐标系的映射关系，具体包括：

3.根据权利要求1所述的方法，其特征在于，所述根据叠加元素数据和映射关系初始化叠加元素的显示状态、图层状态及容器约束规则，具体包括：

4.根据权利要求1所述的方法，其特征在于，所述在素材图片加载前将操作区置为未锁定状态并清除历史操作边界，具体包括：

5.根据权利要求1所述的方法，其特征在于，所述在素材图片加载完成后根据实际渲染尺寸重置操作区并锁定比例，具体包括：

6.根据权利要求1所述的方法，其特征在于，所述基于锁定后的操作区接收叠加元素操作，将显示坐标换算为底图坐标，并结合容器约束规则判断是否存在范围冲突、层级冲突与互斥冲突，具体包括：

7.根据权利要求6所述的方法，其特征在于，所述若存在冲突则拦截原操作并生成限定于对应容器内的修正操作，具体包括：

8.根据权利要求1所述的方法，其特征在于，所述根据修正操作或未冲突操作更新叠加元素数据，将操作前后状态、元素标识、位置尺寸及图层信息封装为操作指令，具体包括：

9.根据权利要求1所述的方法，其特征在于，所述基于操作指令实时渲染画布、通过websocket同步协作者，并在接收远端操作或撤销/重做时，结合ot或crdt规则及操作指令栈执行合并、逆向或重放操作，具体包括：

10.一种素材叠加元素的自适应编辑与同步控制系统，其特征在于，所述系统具体包括：