UI

rpx

• 统一使用 rpx 作为单位，rpx 以 750 作为基准。

sass

• 可以将 sass 变量定义在 uni.scss 中，其他组件在使用时无需手动引入。

配置 TabBar

使用 tabBar 配置

pages.json

{
  "tabBar": {
    "list": [
      {
        "pagePath": "pages/index/index", //
        "iconPath": "/static/c1.png",
        "selectedIconPath": "/static/c2.png",
        "text": "首页"
      },
      {
        "pagePath": "pages/user/user",
        "iconPath": "/static/c1.png",
        "selectedIconPath": "/static/c2.png",
        "text": "我的"
      }
    ]
  }
}

注意点：

1. list 至少两个，最多五个
2. pagePath 的路径需要在 pages 中进行定义

自定义 TabBar

...

配置 NavBar

使用 navigationBar 配置

pages.json

{
  "pages": [
    {
      "path": "pages/index/index",
      "style": {
        "navigationBarTitleText": "首页",
        "navigationBarBackgroundColor": "#007AFF",
        "navigationBarTextStyle": "white"
      }
    }
  ]
}

使用自定义导航组件

1. 隐藏原生导航栏

   pages.json

   {
     "pages": [
       {
         "path": "pages/index/index",
         "style": {
           "navigationStyle": "custom"
         }
       }
     ]
   }

2. 在页面中使用 “自定义导航” 组件。