1.微信导航栏
在开发传统的公众号时,开发者不能对导航栏做任何样式定制。
现在,开发者可以在小程序中定义导航栏的背景颜色(background-color)。但开发者需要规定小程序各个页面的跳转关系,让导航系统能够以合理的方式工作。
微信导航栏分为导航区域、标题区域以及操作区域。其中导航区域控制程序页面进程。目前,导航栏分深浅两种基本配色。
导航区(iOS、Android):导航区通常只有一个操作,即返回上一级界面,点击Android手机自带的硬件返回键也能起到相同的作用。
微信导航栏自定义颜色规则(iOS、Android):小程序导航栏支持基本的背景颜色自定义功能,选择的颜色需要在满足可用性的前提下,谐调搭配微信提供的两套主导航栏图标。
2.页面内标签分页导航
我们可以根据需要,在页面添加标签(Tab)分页导航,若仅为一般线性浏览的页面,则仅使用微信导航栏即可。
标签分页栏可固定在页面顶部或者底部,标签数量不得少于2个,最多不得超过5个,为确保点击区域,建议标签数量不超过4项。一个页面也不应出现一组以上的标签分页栏。
其中,小程序首页可使用微信提供的原生底部标签分页样式,该样式仅供小程序首页使用。开发时可自定义图标样式、标签文案以及文案颜色等。
同样,我们在设计的时候也应注意风格选色。
请勿像下图这样设计。
3.小程序启动页
小程序启动页是小程序在微信上展现品牌特征的页面之一。
本页面将突出展示小程序品牌特征和加载状态,启动页除品牌标志(Logo)展示外,页面上的其他所有元素,如加载进度指示,全部由微信统一提供,我们不用开发,也不能开发。
4.小程序页面下拉刷新与加载
在微信小程序内,微信提供标准的页面下拉刷新加载能力和样式。
在样式上,微信提供了深色、浅色两套方案,并且刷新图标与下拉标示配色已捆绑。我们在开发时,应注意下拉标识与刷新图标的和谐统一。这些下拉的交互和动画等内容由微信统一提供,不需要开发。
