(19)国家知识产权局
(12)发明 专利
(10)授权公告 号
(45)授权公告日
(21)申请 号 202210875497.6
(22)申请日 2022.07.25
(65)同一申请的已公布的文献号
申请公布号 CN 115098104 A
(43)申请公布日 2022.09.23
(73)专利权人 北京中电普华信息技 术有限公司
地址 102200 北京市昌平区嘉铭奥森产业
园
(72)发明人 郑倩 姜海东 王军 高晓欣
王思宁 邵进 张涛 雍怡博
钟天齐 孙丽丽 宋亚琼 屈楠
(74)专利代理 机构 北京集佳知识产权代理有限
公司 11227
专利代理师 张静(51)Int.Cl.
G06F 8/38(2018.01)
G06F 8/41(2018.01)
G06F 9/445(2018.01)
G06F 16/957(2019.01)
G06F 3/0484(2022.01)
G06F 3/0488(2022.01)
(56)对比文件
CN 113703785 A,2021.1 1.26
CN 111694499 A,2020.09.2 2
CN 106354881 A,2017.01.25
US 20152126 64 A1,2015.07.3 0
陆校松.基 于jQuery技 术的焦点图轮播效果
设计与实现. 《福建电脑》 .2017,(第9期),20 -21.
审查员 董洪梅
(54)发明名称
一种轮播组件生成方法及装置
(57)摘要
本发明公开了一种轮播组件生成方法及装
置, 该方法包括获取待生成轮播组件的生成参
数, 所述生成参数包括: 目标应用端类型, 在创建
组件时考虑了应用端的类型, 将不同的类型作为
对轮播组件进行对应的打包处理的依据, 无需对
整体的生 成流程做很大改动, 降低了组件开发难
度和复杂度。
权利要求书2页 说明书8页 附图3页
CN 115098104 B
2022.10.28
CN 115098104 B
1.一种轮播组件生成方法, 其特 征在于, 包括:
获取待生成轮播组件的生成参数, 所述生成参数包括: 页面显示参数、 目标图片的标
识、 预设渲染参数、 轮播控制要求及目标应用端类型;
加载跨平台前端应用uni app框架, 获取网页代码, 在所述uniapp框架中, 依据所述页面
显示参数对所述网页代码进行编译;
依据所述预设渲染参数对编译后的网页代码进行渲染, 并将所述目标图片添加到所述
编译后的网页代码;
依据所述轮播控制要求设置所述目标图片的轮播控制逻辑, 得到初始轮播组件;
将所述初始轮播组件及所述目标应用端类型发送至云服务器, 以使所述云服务器依据
所述目标应用端类型对应的处理方式对所述初始轮播组件进 行打包处理, 打包后的结果作
为所述待生成轮播组件;
接收所述云服 务器发送的所述待生成轮播组件。
2.根据权利要求1所述的方法, 其特 征在于, 所述预设渲染参数包括:
位移属性 值。
3.根据权利要求2所述的方法, 其特征在于, 所述依据所述预设渲染参数对编译后的网
页代码进行渲染包括:
读取所述位移属性 值;
依据所述 位移属性 值设置所述目标图片间的距离 。
4.根据权利要求3所述的方法, 其特征在于, 所述轮播控制要求包括: 目标图片切换触
发条件, 所述目标图片切换触发条件包括: 滑动操作、 点击操作、 定时和锚点触发中的一种
或几种的组合。
5.根据权利要求4所述的方法, 其特征在于, 所述轮播控制要求还包括目标图片跳转触
发条件, 所述目标图片跳转触发条件 包括: 点击操作。
6.根据权利要求4所述的方法, 其特征在于, 在所述目标图片切换触发条件包括滑动操
作的情况 下, 所述依据所述轮播控制要求设置所述目标图片的轮播控制逻辑包括:
检测手指触摸屏幕时的坐标点, 确定所述 坐标点是否处于预设切换控制区域;
在所述坐标点处于预设切换控制区域, 且检测到手指滑动操作的情况下, 确定当前目
标图片按照预设方向移动的目标位置, 所述预设方向为与所述手指滑动方向相同或相反的
方向, 所述目标位置为所述当前目标图片的中心 点横坐标沿所述预设方向平移第一值后的
位置, 所述第一 值为所述手指滑动操作的终点与起始点横坐标差的绝对值;
若所述目标位置未超出展示目标图片的窗口区域, 则将所述当前目标图片移动到所述
目标位置;
若所述目标位置超出所述展示目标图片的窗口区域, 则在所述展示目标图片的窗口区
域显示下一目标图片。
7.根据权利要求4所述的方法, 其特征在于, 在所述目标图片切换触发条件包括滑动操
作的情况 下, 所述依据所述轮播控制要求设置所述目标图片的轮播控制逻辑包括:
检测手指触摸屏幕时的坐标点, 确定所述 坐标点是否处于预设切换控制区域;
在所述坐标点处于预设切换控制区域, 且检测到手指滑动操作的情况下, 计算所述滑
动操作的移动距离;权 利 要 求 书 1/2 页
2
CN 115098104 B
2若所述移动距离没有超出展示目标图片的窗口区域, 则在所述展示目标图片的窗口区
域显示当前目标图片;
若所述移动距离超出所述展示目标图片的窗口区域, 则在所述展示目标图片的窗口区
域显示下一目标图片。
8.根据权利要求4所述的方法, 其特征在于, 在所述目标图片切换触发条件包括滑动操
作的情况 下, 所述依据所述轮播控制要求设置所述目标图片的轮播控制逻辑包括:
检测手指触摸屏幕时的坐标点, 确定所述 坐标点是否处于预设切换控制区域;
在所述坐标点处于预设切换控制区域, 且检测到手指滑动操作的情况下, 计算所述滑
动操作的移动距离;
获取所述目标图片的宽度, 并计算所述 位移属性 值对应的目标图片间的距离;
若所述滑动操作的移动距离大于所述目标图片间的距离, 则在展示目标图片的窗口区
域显示下一目标图片;
若所述滑动操作的移动距离不大于所述目标图片间的距离, 则在所述展示目标图片的
窗口区域显示当前目标图片。
9.根据权利要求4所述的方法, 其特征在于, 在所述目标图片切换触发条件包括锚点触
发的情况 下, 所述依据所述轮播控制要求设置所述目标图片的轮播控制逻辑包括:
预先为每一目标图片设置对应的锚点;
检测到对所述锚点的触发操作时, 在展示目标图片的窗口区域渲染所述锚点对应的目
标图片, 所述触发操作包括 点击操作或滑过操作。
10.一种轮播组件生成装置, 其特 征在于, 包括:
参数获取单元, 用于获取待生成轮播组件的生成参数, 所述生成参数包括: 页面显示参
数、 目标图片的标识、 预设渲染参数、 轮播控制要求及目标应用端类型;
编译单元, 用 于加载跨平台前端应用uniapp框架, 获取网页代码, 在所述uniapp框架
中, 依据所述页面显示 参数对所述网页代码进行编译;
渲染单元, 用于依据所述预设渲染参数对编译后的网页代码进行渲染, 并将所述目标
图片添加到所述编译后的网页代码;
逻辑设置单元, 用于依据所述轮播控制要求设置所述目标图片的轮播控制逻辑, 得到
初始轮播组件;
发送单元, 用于将所述初始轮播组件及所述目标应用端类型发送至云服务器, 以使所
述云服务器依据所述目标应用端类型对应的处理方式对所述初始轮播组件进 行打包处理,
打包后的结果作为所述待生成轮播组件;
接收单元, 用于接收所述云服 务器发送的所述待生成轮播组件。权 利 要 求 书 2/2 页
3
CN 115098104 B
3
专利 一种轮播组件生成方法及装置
文档预览
中文文档
14 页
50 下载
1000 浏览
0 评论
309 收藏
3.0分
温馨提示:本文档共14页,可预览 3 页,如浏览全部内容或当前文档出现乱码,可开通会员下载原始文档
本文档由 人生无常 于 2024-03-18 16:34:06上传分享