新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案

創(chuàng)新互聯(lián)百度小程序教程：swan.setNavigationBarColor

swan.setNavigationBarColor
- 方法參數(shù)
  - object 參數(shù)說明
  - animation 參數(shù)說明
  - animation.timingFunc 有效值
- 示例
  - 代碼示例 1
  - 代碼示例 2
- 錯(cuò)誤碼
  - Android
  - iOS
- 常見問題
  - Q：如何設(shè)置透明膠囊?

swan.setNavigationBarColor

解釋：動(dòng)態(tài)設(shè)置當(dāng)前頁(yè)面導(dǎo)航條的顏色。

方法參數(shù)

Object object

object 參數(shù)說明

屬性名	類型	必填	說明
frontColor	String	是	前景顏色值，包括按鈕、標(biāo)題、狀態(tài)欄的顏色，有效值 #ffffff 和 #000000
backgroundColor	String	是	背景顏色值，有效值為十六進(jìn)制顏色
animation	Object	否	動(dòng)畫效果
success	Function	否	接口調(diào)用成功的回調(diào)函數(shù)
fail	Function	否	接口調(diào)用失敗的回調(diào)函數(shù)
complete	Function	否	接口調(diào)用結(jié)束的回調(diào)函數(shù)（調(diào)用成功、失敗都會(huì)執(zhí)行）

animation 參數(shù)說明

屬性名	類型	必填	默認(rèn)值	說明
duration	Number	否	0	動(dòng)畫變化時(shí)間（單位：毫秒）
timingFunc	String	否	linear	動(dòng)畫變化方式

animation.timingFunc 有效值

值	說明
linear	動(dòng)畫從頭到尾的速度是相同的。
easeIn	動(dòng)畫以低速開始
easeOut	動(dòng)畫以低速結(jié)束。
easeInOut	動(dòng)畫以低速開始和結(jié)束。

示例

跳轉(zhuǎn)編輯工具

在開發(fā)者工具中打開

在 WEB IDE 中打開

掃碼體驗(yàn)

代碼示例

請(qǐng)使用百度APP掃碼

代碼示例 1

SWAN
JS

 
 
 
  
  
  
  
  
   
  
  
   
  
  
   黑色前景色
  
  
   
  
  
   fontColor='#000000'
  
  
   backgroundColor='#ffffff'

代碼示例 2

SWAN
JS

 
 
 
  
  
  
  
  
   
  
  
   
  
  
   白色前景色
  
  
   
  
  
   fontColor='#ffffff' 
  
  
   backgroundColor='#3388FF'

設(shè)計(jì)指南

配置導(dǎo)航欄背景色顏色值（backgroundColor）時(shí)應(yīng)注意前景顏色值（frontColor）的可讀性和閱讀舒適度，且與小程序風(fēng)格統(tǒng)一。

錯(cuò)誤

前景顏色值為黑色時(shí)（#000000），應(yīng)避免使用高飽和度或較深的背景顏色。

錯(cuò)誤

前景顏色值為白色時(shí)（#ffffff），應(yīng)避免使用較淺的背景顏色。

錯(cuò)誤碼

Android

錯(cuò)誤碼	說明
1001	執(zhí)行失敗

iOS

錯(cuò)誤碼	說明
202	解析失敗，請(qǐng)檢查參數(shù)是否正確

常見問題

Q：如何設(shè)置透明膠囊?

A：如下代碼示例。

 
 
 
  
  
  swan.setNavigationBarColor({
  
  
   frontColor: '#ffffff',
  
  
   backgroundColor: '#000000'
  
  
  });

網(wǎng)站名稱：創(chuàng)新互聯(lián)百度小程序教程：swan.setNavigationBarColor
文章URL：http://m.fisionsoft.com.cn/article/cdighpi.html