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

swan.setNavigationBarColor

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

方法參數(shù)

Object object

object 參數(shù)說明

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

animation 參數(shù)說明

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

animation.timingFunc 有效值

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

示例

跳轉(zhuǎn)編輯工具

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

在 WEB IDE 中打開

掃碼體驗

代碼示例

請使用百度APP掃碼

代碼示例 1

• SWAN
• JS

 
 
 

  
  
  

  
  
  
 
  
  
  
 
  
  
  
 黑色前景色
  
  
  
 
  
  
  
 fontColor='#000000'
  
  
  
 backgroundColor='#ffffff'
  
  
  
 
  
  
  
 
  
  
  
 點擊設(shè)置
  
  
  
 
  
  
  

 
 
 

代碼示例 2

• SWAN
• JS

 
 
 

  
  
  

  
  
  
 
  
  
  
 
  
  
  
 白色前景色
  
  
  
 
  
  
  
 fontColor='#ffffff' 
  
  
  
 backgroundColor='#3388FF'
  
  
  
 
  
  
  
 
  
  
  
 點擊設(shè)置
  
  
  
 
  
  
  

 
 
 

設(shè)計指南

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

錯誤

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

錯誤

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

錯誤碼

Android

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

iOS

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

常見問題

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

A：如下代碼示例。

 
 
 

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

當(dāng)前文章：創(chuàng)新互聯(lián)百度小程序教程：swan.setNavigationBarColor
URL標(biāo)題：http://uogjgqi.cn/article/cdighpi.html