navigationbar.md 4.9 KB
Newer Older
M
mehaotian 已提交
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
### uni.setNavigationBarTitle(OBJECT)

动态设置当前页面的标题。

**OBJECT参数说明**

|参数|类型|必填|说明|
|:-|:-|:-|:-|
|title|String|是|页面标题|
|success|Function|否|接口调用成功的回调函数|
|fail|Function|否|接口调用失败的回调函数|
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)|

**示例**

```javascript
uni.setNavigationBarTitle({
	title: '新的标题'
});
雪洛's avatar
雪洛 已提交
20 21 22 23 24
```

**注意**

- 如果需要在页面进入时设置标题,可以在`onReady`内执行,以避免被框架内的修改所覆盖。如果必须在`onShow`内执行需要延迟一小段时间
M
mehaotian 已提交
25 26 27 28


### uni.setNavigationBarColor(OBJECT)

雪洛's avatar
雪洛 已提交
29
设置页面导航条颜色。**如果需要进入页面就设置颜色,请延迟执行,防止被框架内设置颜色逻辑覆盖**
M
mehaotian 已提交
30 31 32

**平台差异说明**

33
|App|H5|微信小程序|支付宝小程序|百度小程序|字节跳动小程序|QQ小程序|
W
wanganxp 已提交
34
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
雪洛's avatar
雪洛 已提交
35
|√|√|√|√|√|√|√|
M
mehaotian 已提交
36 37 38 39 40

**OBJECT参数说明**

|参数|类型|必填|说明|平台差异说明|
|:-|:-|:-|:-|:-|
雪洛's avatar
雪洛 已提交
41
|frontColor|String|是|前景颜色值,包括按钮、标题、状态栏的颜色,仅支持 #ffffff 和 #000000|App、H5、微信小程序、百度小程序|
M
mehaotian 已提交
42 43 44 45
|backgroundColor|String|是|背景颜色值,有效值为十六进制颜色||
|animation|Object|否|动画效果,{duration,timingFunc}|微信小程序、百度小程序|
|success|Function|否|接口调用成功的回调函数||
|fail|Function|否|接口调用失败的回调函数||
E
edtam 已提交
46 47 48
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)| |

**注意**
雪洛's avatar
雪洛 已提交
49 50
- Android 上的 backgroundColor 参数有限制,黑色大于 rgb(30,30,30), 白色小于 rgb(235,235,235)
- 如果需要在页面进入时设置标题,可以在`onReady`内执行,以避免被框架内的修改所覆盖。如果必须在`onShow`内执行需要延迟一小段时间
M
mehaotian 已提交
51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92

**animation 结构**

|属性|类型|默认值|必填|说明|
|:-|:-|:-|:-|:-|
|duration|number|0|否|动画变化时间,单位 ms|
|timingFunc|String|'linear'|否|动画变化方式|

**animation.timingFunc 有效值**

|值|说明|
|:-|:-|
|linear|动画从头到尾的速度是相同的。|
|easeIn|动画以低速开始|
|easeOut|动画以低速结束。|
|easeInOut|动画以低速开始和结束。|

**success返回参数说明**

|参数名|类型|说明|
|:-|:-|:-|
|errMsg|String|调用结果|

**示例**

```javascript
uni.setNavigationBarColor({
    frontColor: '#ffffff',
    backgroundColor: '#ff0000',
    animation: {
        duration: 400,
        timingFunc: 'easeIn'
    }
})
```

### uni.showNavigationBarLoading(OBJECT)

在当前页面显示导航条加载动画。

**平台差异说明**

93
|App|H5|微信小程序|支付宝小程序|百度小程序|字节跳动小程序|QQ小程序|
W
wanganxp 已提交
94 95 96 97
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|√|√|√|√|x|√|

App平台调用此API时会在屏幕中间悬浮显示loading
M
mehaotian 已提交
98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118

**OBJECT参数说明**

|参数|类型|必填|说明|
|---|---|---|---|
|success|Function|否|接口调用成功的回调函数|
|fail|Function|否|接口调用失败的回调函数|
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)|

**示例**

```javascript
uni.showNavigationBarLoading()
```

### uni.hideNavigationBarLoading(OBJECT)

在当前页面隐藏导航条加载动画。

**平台差异说明**

119
|App|H5|微信小程序|支付宝小程序|百度小程序|字节跳动小程序|QQ小程序|
W
wanganxp 已提交
120 121 122 123
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|√|√|√|√|x|√|

App平台调用此API时会关闭屏幕中间悬浮显示的loading
M
mehaotian 已提交
124 125 126 127 128 129 130 131 132 133 134 135 136 137

**OBJECT参数说明**

|参数|类型|必填|说明|
|---|---|---|---|
|success|Function|否|接口调用成功的回调函数|
|fail|Function|否|接口调用失败的回调函数|
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)|

**示例**

```javascript
uni.hideNavigationBarLoading()
```
E
edtam 已提交
138 139


雪洛's avatar
雪洛 已提交
140 141
### uni.hideHomeButton(OBJECT)

雪洛's avatar
雪洛 已提交
142
隐藏返回首页按钮。
雪洛's avatar
雪洛 已提交
143 144 145

**平台差异说明**

146
|App|H5|微信小程序|支付宝小程序|百度小程序|字节跳动小程序|QQ小程序|
雪洛's avatar
雪洛 已提交
147
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
148
|x|x|√|x|x|1.48.0+|1.10.0+|
雪洛's avatar
雪洛 已提交
149 150 151 152 153 154 155 156 157 158 159 160 161 162 163


**OBJECT参数说明**

|参数|类型|必填|说明|
|---|---|---|---|
|success|Function|否|接口调用成功的回调函数|
|fail|Function|否|接口调用失败的回调函数|
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)|

**示例**

```javascript
uni.hideHomeButton()
```
E
edtam 已提交
164 165 166 167

**说明**
- 微信小程序自基础库版本2.8.3开始支持
- 当用户打开的小程序最底层页面是非首页时,默认展示“返回首页”按钮,开发者可在页面`onShow`中调用`hideHomeButton`进行隐藏。