uniapp 微信小程序自定义头部并把胶囊变成白色框

uni-app 是一个使用 Vue.js 开发所有前端应用的框架，可以编译到iOS、Android、Web（包括微信小程序）以及各种小程序等多个平台。在uni-app中开发微信小程序时，可以对页面的头部进行自定义。如果想要把微信小程序的胶囊变成白色框，通常需要在页面的json配置文件中进行相应的设置。

通常情况下，微信小程序的胶囊颜色是通过全局样式来控制的，但微信小程序官方并不提供直接改变胶囊颜色的API。所以如果要改变胶囊颜色，一般有以下几种方法：

1. 在小程序的全局样式文件`app.json`中添加全局自定义tabBar，并通过修改该tabBar的颜色属性来改变胶囊的颜色。示例如下：

"tabBar": {
  "color": "#000000", // 文字颜色
  "selectedColor": "#07c160", // 选中文字颜色
  "backgroundColor": "#ffffff", // 背景颜色
  "borderStyle": "black",
  "list": [
    {
      "pagePath": "pages/index/index",
      "text": "首页"
    },
    {
      "pagePath": "pages/logs/logs",
      "text": "日志"
    }
  ]
}

2. 使用图片替代标准的tabBar。通过设计相应的白色边框图片，并将tabBar的内容替换为自定义的视图。这种方式较为灵活，可以完全自定义样式，但需要手动处理选中和未选中的状态。

3. 如果要实现更深层次的自定义，可能需要使用微信小程序的Canvas组件或者自绘导航栏。但这种方法实现起来较为复杂，需要较强的前端开发能力，且容易受到微信更新的影响。

需要注意的是，由于微信对小程序的外观和行为有一定的限制，修改胶囊颜色可能会影响到用户的小程序使用体验。因此，在进行这样的修改之前，请确保它符合微信平台的规范和用户的期望。