小程序自定义头部窗口(胶囊)和配置tabBar

790 阅读1分钟

小程序自定义窗口头部(胶囊的使用)

一、效果图呈现

image.png

二、关键配置及代码

1、先设置样式自定义,注意是直接放全局的app.json就是全部变自定义,只在首页自定义就放首页里边 image.png 2、调胶囊的接口,胶囊到顶部的距离就是左边盒子的padding-top,胶囊的高度就是搜索框的高度,胶囊的到左边的距离就是盒子的长度,这样来保证对齐。

image.png

image.png

底部tabBar的配置

效果图及代码

这个没什么好说的,查文档配就行,很简单 image.png image.png image.png image.png