百度智能小程序 動(dòng)態(tài)設(shè)置導(dǎo)航條的顏色

swan.setNavigationBarColor

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

方法參數(shù)

Object object

object 參數(shù)說明

animation 參數(shù)說明

animation.timingFunc 有效值

示例

代碼示例 1 

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

<view class="wrap">
    <view class="card-area">
        <view class="top-description border-bottom">
            <view>黑色前景色</view>
            <view>
                fontColor='#000000'
                backgroundColor='#ffffff'
            </view>
        </view>
        <button bind:tap="setNavigationBarColor" type="primary" hover-stop-propagation="true">點(diǎn)擊設(shè)置</button>
    </view>
</view>

Page({
    setNavigationBarColor() {
        swan.setNavigationBarColor({
            frontColor: '#000000',
            backgroundColor: '#ffffff',
            animation: {
                duration: 500,
                timingFunc: 'linear'
            },
            success: res => {
                console.log('setNavigationBarColor success');
            },
            fail: err => {
                console.log('setNavigationBarColor fail', err);
            }
        });
    }
});

代碼示例 2 

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

<view class="wrap">
    <view class="card-area">
        <view class="top-description border-bottom">
            <view>白色前景色</view>
            <view>
                fontColor='#ffffff' 
                backgroundColor='#3388FF'
            </view>
        </view>
        <button bind:tap="setNavigationBarColor" type="primary" hover-stop-propagation="true">點(diǎn)擊設(shè)置</button>
    </view>
</view>

Page({
    setNavigationBarColor() {
        swan.setNavigationBarColor({
            frontColor: '#ffffff',
            backgroundColor: '#3388FF',
            animation: {
                duration: 500,
                timingFunc: 'linear'
            },
            success: res => {
                console.log('setNavigationBarColor success');
            },
            fail: err => {
                console.log('setNavigationBarColor fail', err);
            }
        });
    }
});

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

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

錯(cuò)誤碼

Android

iOS