字节小程序
开发者社区
小程序小游戏
登录
小程序自定义框架改标准框架调整指南

小程序自定义框架改标准框架调整指南

2510浏览作者: walawala

尊敬的开发者:

你好,为提升开发者以及用户使用体验,平台将对小程序进行框架升级改造,从基础库 2.42.0.1 版本起生效。主要更改内容为default/custom导航栏样式调整,同时小程序面板的全局加载、下拉刷新、分包加载、更多面板等进行了升级。更多升级介绍文档可查看:《小程序页面结构升级重要通知》

为了帮助原使用自定义&标准框架统一修改为标准化框架的小程序进行符合平台规范的调整,提供如下指南:

一、升级调整指南

(一)判断开发者自定义框架是否需要修改为标准框架

如存在使用自定义导航栏,需要按照《获取小程序页面结构自定义能力规范》进行权限申请,未进行权限申请不符合自定义能力规范的小程序,需要将自定义导航栏修改为标准导航栏后,才能够正常编译和更新程序代码。

(二)开发者自定义框架修改为标准框架

标准化导航栏元素:


1.在相应的page.json/app.json文件中需要修改字段navigationStyle为default(参考文档全局配置

2.如果原有自定义导航栏位置只有「标题」和「返回键」等基本内容,切换使用标准化导航栏,只需删除原来自定义导航栏的样式,适配标准化导航栏元素,修改页面直到符合预期: 配置标准化导航栏,如导航栏颜色/导航栏标题等(参考文档全局配置) 如果希望导航栏没有背景颜色,呈透明样式。建议使用transparentTitle进行配置(ps.建议使用auto,样式为透明状下拉渐变为不透明。)

3.如果原有自定义导航栏除了标题和返回键等基本内容还有其他特殊功能,比如「搜索框」,「位置」等,此类功能控件需要开发者重新排版放在其他位置

案例:需要将搜索框、定位等元素放到页面内,顶部预留一整行给标准化导航栏




示例:页面顶部导航栏稳定透出,其他元素需设计排版放置到下方页面以内





4.标准化导航栏的左上角按钮呈现为logo的时候,在非首页情况下拥有点击返回首页的能力,如果有开发者不希望用户点击返回首页,可以使用hideHomeButton这个API隐藏返回首页的能力(注意,logo不会隐藏)

5.预留出logo展示位置即可,不需要自己设计logo放在左上角,修改成功后,上传的小程序头像自动展示为logo。

6.如调整过程中需要进行测试,可以通过IDE查看效果。调整完成后提交版本审核。

*注意:原先拥有自定义能力,现在只能使用标准化的开发者,5月23日前可以正常展示。整改期到后,未经整改的开发者端上可以兼容其旧样式,IDE无法更新版本。


二、相关指引文档/链接

文档内容

链接

导航栏基本配置

点击查看

导航栏相关API

点击查看

hideHomeButton API链接

点击查看

申请自定义导航栏权限

点击查看

三、常见问题解析

1、Q:如何配置标准化导航栏的一些样式?

A:请查看全局配置文档全局配置


2、Q:我可以隐藏左上角的logo吗?

A:不可以,该logo用于强化小程序品牌感知,暂不可隐藏。


3、Q:原来自定义导航栏里我们小程序有搜索框等一些功能,现在改为标准化导航栏,你们提供此类功能吗?

A:目前不进行提供,导航栏内只有左侧按钮+标题+右侧胶囊部分等基本功能。建议开发者重新排版,标准导航栏仅保留品牌logo、标题、胶 囊按钮等重要关键信息。


4、Q:我想在导航栏中有我们小程序自己设计的标题图片,如何设置?

A:标准化导航栏目前不允许有此类设置,如果有需要,可以申请自定义导航栏


5、Q:我希望导航栏有自适应功能,可以一开始是透明的,滑动逐渐显示标题,这个可以做到吗?

A:可以,支持导航栏自适应样式。配置transparentTitle为auto就可以实现。


6、Q:原来的回到首页的小房子样式的按钮去哪里了?

A:本次整改更改了回到首页按钮的样式,由原来的小房子变成小程序logo。


7、Q:标准化导航栏之前可以隐藏回到首页按钮,现在不可以了吗?

A:考虑到cp不希望用户回到首页的需求,我们仍然支持可以去除用户回到首页的能力(通过使用原来API——hideHomeButton)但是出于品牌露出考虑,我们不支持隐藏回到首页按钮。


最后一次编辑于 2022年05月11日
加载中