如何实现小程序自定义单页面和全局导航栏功能?
- 内容介绍
- 文章标签
- 相关推荐
本文共计1730个文字,预计阅读时间需要7分钟。
需求+产品描述小程序返回到首页不方便,想添加返回首页按钮,UI说导航栏能否设置背景图,因为那样设计看起来更美观。+需求分析及确定方案+该产品及UI都提出了需求,也不能反驳。
需求
产品说小程序返回到首页不太方便,想添加返回首页按钮,UI说导航栏能不能设置背景图片,因为那样设计挺好看的。
需求分析并制定方案
这产品和UI都提需求了,咱也不能反驳哈,所以开始调研,分析可行性方案;1、可以添加悬浮按钮。2、自定义导航栏。
添加悬浮按钮,是看起来是比较简单哈,但是感觉不太优雅,会占据页面的空间,体验也不太好。所以想了下第二种方案,自定义导航栏既可以实现产品的需求还可以满足UI的设计美感,在顶部空白处加上返回首页的按钮,这样和返回按钮还对称(最终如图所示,顶部导航栏是个背景图片,分两块组合起来)。
实现方案
一、实现的前提
1、首先查看文档,看文档里关于自定义导航栏是怎么规定的,有哪些限制;还有小程序自定义导航栏全局配置和单页面配置的微信版本和调试库的最低支持版本。
本文共计1730个文字,预计阅读时间需要7分钟。
需求+产品描述小程序返回到首页不方便,想添加返回首页按钮,UI说导航栏能否设置背景图,因为那样设计看起来更美观。+需求分析及确定方案+该产品及UI都提出了需求,也不能反驳。
需求
产品说小程序返回到首页不太方便,想添加返回首页按钮,UI说导航栏能不能设置背景图片,因为那样设计挺好看的。
需求分析并制定方案
这产品和UI都提需求了,咱也不能反驳哈,所以开始调研,分析可行性方案;1、可以添加悬浮按钮。2、自定义导航栏。
添加悬浮按钮,是看起来是比较简单哈,但是感觉不太优雅,会占据页面的空间,体验也不太好。所以想了下第二种方案,自定义导航栏既可以实现产品的需求还可以满足UI的设计美感,在顶部空白处加上返回首页的按钮,这样和返回按钮还对称(最终如图所示,顶部导航栏是个背景图片,分两块组合起来)。
实现方案
一、实现的前提
1、首先查看文档,看文档里关于自定义导航栏是怎么规定的,有哪些限制;还有小程序自定义导航栏全局配置和单页面配置的微信版本和调试库的最低支持版本。

