uni.setNavigationBarColor設置字體顏色及背景色無效的4個原因及解決
更新時間：2024年01月29日 11:04:10 作者：查水表小泰迪
這篇文章主要給大家介紹了關于uni.setNavigationBarColor設置字體顏色及背景色無效的4個原因及正確解決辦法,文中還介紹了uni-app設置頁面導航條顏色的實例代碼,需要的朋友可以參考下
1. 只設置了背景色，背景色無效
//錯誤示范
uni.setNavigationBarColor({
backgroundColor:"#c9e5fd"
})注： 背景色需要和字體顏色同時設置才能生效
2. 字體顏色只支持小寫的十六進制，否則字體顏色和背景色均無效
//錯誤示范 1
uni.setNavigationBarColor({
frontColor:"#fff",
backgroundColor:"#c9e5fd"
})
// 錯誤示范 2
uni.setNavigationBarColor({
frontColor:"#FFFFFF",
backgroundColor:"#c9e5fd"
})3. 字體顏色不能設置除了黑白以外的顏色，否則字體顏色和背景色均無效
//錯誤示范
uni.setNavigationBarColor({
frontColor:"#c9e5fd",
backgroundColor:"#c9e5fd"
})注： 字體顏色只支持黑白兩種顏色：#ffffff 和 #000000
4. 字體顏色不能帶空格符號，否則字體顏色及背景色設置無效
//錯誤示范
uni.setNavigationBarColor({
frontColor:" #000000",
backgroundColor:" #c9e5fd",
})注：正確代碼
// 正確示范
uni.setNavigationBarColor({
frontColor:"#ffffff",
backgroundColor:"#c9e5fd",
})附：uni-app 設置頁面導航條顏色
下述兩種方法中顏色限制為十六進制顏色。
1.pages.json頁面路由中，用style設置每一個頁面的導航欄背景顏色如：
{
"pages": [{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首頁",//設置頁面標題文字
"enablePullDownRefresh":true//開啟下拉刷新
"navigationBarBackgroundColo","#000000"
}
},
...
]
}2,使用uni.setNavigationBarColor(OBJECT)設置頁面導航條顏色。如：
uni.setNavigationBarColor({
backgroundColor: '#ff0000',
})Android 上的 backgroundColor 參數(shù)有限制，黑色大于 rgb(30,30,30), 白色小于 rgb(235,235,235)
總結
到此這篇關于uni.setNavigationBarColor設置字體顏色及背景色無效的4個原因及解決的文章就介紹到這了,更多相關uni.setNavigationBarColor設置無效內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
JS實現(xiàn)控制圖片顯示大小的方法【圖片等比例縮放功能】
這篇文章主要介紹了JS實現(xiàn)控制圖片顯示大小的方法,即實現(xiàn)圖片等比例縮放功能,涉及JS動態(tài)操作頁面元素屬性相關技巧,需要的朋友可以參考下2017-02-02
javascript設計模式 – 命令模式原理與用法實例分析
這篇文章主要介紹了javascript設計模式 – 命令模式,結合實例形式分析了javascript命令模式相關概念、原理、用法及操作注意事項,需要的朋友可以參考下2020-04-04
js基于FileSaver.js 瀏覽器導出Excel文件的示例
本篇文章主要介紹了js基于FileSaver.js 瀏覽器導出Excel文件的示例，具有一定的參考價值，有興趣的可以了解一下2017-08-08
數(shù)組對于程序語言的重要性自不必多說,而在使用javascript的時候難免也會需要用到數(shù)組操作,這篇文章主要介紹了JavaScript數(shù)組的相關資料,文中通過代碼介紹的非常詳細,需要的朋友可以參考下2025-08-08
本文我們將討論?axios?中是如何處理異常的,在此之前,我們先了解以下?axios?中各種類型的異常,文中通過代碼示例講解的非常詳細,具有一定的參考價值,需要的朋友可以參考下2024-05-05
在本片文章中，作者將向您講述JavaScript中最鮮為人知的秘密。學習js的朋友可以參考下。2011-08-08
本文詳細介紹了如何搭建一個完整的TypeScript開發(fā)環(huán)境,包括安裝Node.js和TypeScript、初始化項目結構、生成并配置`tsconfig.json`、配置自動編譯、在VSCode中配置調試以及解決常見問題2026-01-01
微信小程序 子級頁面返回父級并把子級參數(shù)帶回父級實現(xiàn)方法
這篇文章主要介紹了微信小程序 子級頁面返回父級并把子級參數(shù)帶回父級實現(xiàn)方法,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-08-08
想要取得iframe中的元素和js變量值，不能用$(document).ready()方法，而是要用$("#iframeId").load()方法2014-06-06
僅相隔一天就出了個v3。 修正了一個bug，firefox左側內容寬度錯誤。2009-02-02