(19)国家知识产权局 (12)发明 专利申请 (10)申请公布号 (43)申请公布日 (21)申请 号 20221018780 6.0 (22)申请日 2022.02.28 (71)申请人 北京达佳互联信息技 术有限公司 地址 100085 北京市海淀区上地西路6号1 幢1层101D1-7 (72)发明人 殷勇　胡官涛　 (74)专利代理 机构 北京清亦华知识产权代理事 务所(普通 合伙) 11201 专利代理师 杜月 (51)Int.Cl. G06F 3/14(2006.01) G06F 9/451(2018.01) (54)发明名称 小程序页面的布局方法、 装置、 电子设备及 存储介质 (57)摘要 本公开关于一种小程序页面的布局方法、 装 置、 电子设备及存储介质。 其中， 所述小程序页面 的布局方法， 包括： 获取电子设备的屏幕宽度及 预设自适应像素数量； 根据所述屏幕宽度和所述 预设自适应像素数量， 确定小程序页面中顶部区 域的预留高度； 基于所述预留高度和所述小程序 页面中标题区域的高度， 布局所述小程序页面； 其中， 所述标题区域的高度基于所述电子设备对 应的像素与自适应像素间的换算关系确定。 采用 本公开实施例提供的小程序页面的布局方法可 以实现小程序页面中顶部区域的预留高度的自 动确定， 实现小程序页面的自动布局， 从而可 以 有效提高小程序 页面的布局效率。 权利要求书2页 说明书10页 附图6页 CN 114564166 A 2022.05.31 CN 114564166 A 1.一种小程序 页面的布局方法， 其特 征在于， 包括： 获取电子设备的屏幕宽度及预设自适应 像素数量； 根据所述屏幕宽度和所述预设自适应像素数量， 确定小程序页面中顶部区域的预留高 度； 基于所述预留高度和所述小程序页面中标题区域的高度， 布局所述小程序页面； 其中， 所述标题区域的高度基于所述电子设备对应的像素与自适应 像素间的换算关系确定 。 2.根据权利要求1所述的小程序页面的布局方法， 其特征在于， 所述根据 所述屏幕宽度 和所述预设自适应 像素数量， 确定小程序 页面中顶部区域的预留 高度的计算公式为： h1＝(rpxNumber/75 0)*screenwidth； 其中， h1为所述顶部区域的预留高度， rpxNumber为所述预设自适应像素数量， screenwidth为所述屏幕宽度。 3.根据权利要求1所述的小程序页面的布局方法， 其特征在于， 基于所述预留高度和所 述小程序 页面中标题区域的高度， 布局所述小程序 页面之后， 还 包括： 获取所述小程序 页面中显示的作品的作品封面图； 基于所述作品封面图， 生成所述顶部区域和所述标题区域的背景图。 4.根据权利要求3所述小程序页面的布局方法， 其特征在于， 在所述基于所述作品封面 图， 生成所述顶部区域和所述标题区域的背景图之后， 还 包括： 将所述顶部区域设置为第三显示层级、 将所述标题区域设置为第一显示层级、 将所述 小程序页面中的数据区域设置为第二显示层级； 其中， 显示层级用于指示区域的显示优先 级， 所述数据区域 为所述小程序界面中除所述顶部区域和标题区域之外的区域； 在监听到所述小程序页面的数据区域向所述顶部区域的方向滚动的情况下， 控制所述 第二显示层级对应的数据区域覆盖所述第一显示层级对应的标题区域。 5.根据权利要求4所述小程序页面的布局方法， 其特征在于， 所述控制所述第 二显示层 级对应的数据区域覆盖所述第一显示层级对应的标题区域之后， 还 包括： 控制所述顶部区域从第一显示方式切换至第二显示方式； 其中， 所述第一显示方式不 包括所述小程序页面中显示的作品的作品信息， 所述第二显示方式包括小程序页面中显示 的作品的作品信息 。 6.一种小程序 页面的布局装置， 其特 征在于， 包括： 第一获取模块， 被 配置为获取电子设备的屏幕宽度及预设自适应 像素数量； 确定模块， 被配置为根据所述屏幕宽度和所述预设自适应像素数量， 确定小程序页面 中顶部区域的预留 高度； 布局模块， 被配置为基于所述预留高度和所述小程序页面中标题区域的高度， 布局所 述小程序页面； 其中， 所述标题 区域的高度基于所述电子设备对应的像素与自适应像素间 的换算关系确定 。 7.根据权利要求6所述的小程序页面的布局装置， 其特征在于， 所述小程序页面的布局 装置， 还包括： 第二获取模块， 被 配置为获取 所述小程序 页面中显示的作品的作品封面图； 背景生成模块， 被配置为基于所述作品封面图， 生成所述顶部区域和所述标题区域的 背景图。权　利　要　求　书 1/2 页 2 CN 114564166 A 28.根据权利要求7所述的小程序页面的布局装置， 其特征在于， 所述小程序页面的布局 装置， 还包括： 层级设置模块， 被配置为将所述顶部区域设置为第三显示层级、 将所述标题区域设置 为第一显示层 级、 将所述小程序页面中的数据区域设置为第二显示层级； 其中， 显示层级用 于指示区域的显示优先级， 所述数据区域为所述小程序界面中除所述顶部区域和标题区域 之外的区域； 覆盖模块， 被配置为在监 听到所述小程序页面的数据区域向所述顶部区域的方向滚动 的情况下， 控制所述第二显示层级对应的数据区域覆盖所述第一显示层级对应的标题区 域。 9.一种电子设备， 其特 征在于， 包括： 处理器； 用于存储所述处 理器可执行指令的存 储器； 其中， 所述处理器被配置为执行所述指令， 以实现如权利要求1至5中任一项所述的小 程序页面的布局方法。 10.一种存储介质， 当所述存储介质中的指令由电子设备的处理器执行时， 使得电子设 备能够执 行如权利要求1至 5中任一项所述的小程序 页面的布局方法。权　利　要　求　书 2/2 页 3 CN 114564166 A 3