百度智能小程序 設(shè)置窗口背景顏色

swan.setBackgroundColor

基礎(chǔ)庫 3.10.4 版本開始支持。

解釋：設(shè)置窗口的背景顏色。頂部或底部窗口顏色設(shè)置，建議與頁面背景色保持一致，避免下拉或上拉頁面時(shí)顏色不協(xié)調(diào)。

方法參數(shù)

Object object

object參數(shù)說明

示例

代碼示例 1 - backgroundColor 

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

<view class="wrap">
    <view class="card-area">
        <view class="top-description border-bottom">
            <view>設(shè)置窗口背景色</view>
            <view>backgroundColor</view>
        </view>
        <button bind:tap="setBackgroundColor" type="primary" hover-stop-propagation="true">設(shè)置窗口顏色為藍(lán)色</button>
    </view>
</view>

Page({
    setBackgroundColor() {
        swan.setBackgroundColor({
            backgroundColor: '#5B9FFF',
            success: () => {
                console.log('setBackgroundColor success');
            },
            fail: err => {
                console.log('setBackgroundColor fail', err);
            }
        });
    }
});

圖片示例

代碼示例 2 - backgroundColorTop 

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

<view class="wrap">
    <view class="card-area">
        <view class="top-description border-bottom">
            <view>設(shè)置的頂部背景窗口顏色</view>
            <view>色值為: #FFC0CB</view>
        </view>
        <button type="primary" bindtap="setBackgroundColor">setBackgroundColor</button>
    </view>
</view>

Page({
    setBackgroundColor() {
        swan.setBackgroundColor({
            backgroundColorTop: '#FFC0CB',
            success: () => {
                console.log('setBackgroundColor success');
            },
            fail: err => {
                console.log('setBackgroundColor fail', err);
            }
        });
    }
});

圖片示例

代碼示例 3 - backgroundColorBottom 

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

<view class="wrap">
    <view class="card-area">
        <view class="top-description border-bottom">
            <view>設(shè)置的底部背景窗口顏色</view>
            <view>色值為: #7B68EE</view>
        </view>
        <button type="primary" bindtap="setBackgroundColor">setBackgroundColor</button>
    </view>
</view>

Page({
    setBackgroundColor() {
        swan.setBackgroundColor({
            backgroundColorBottom: '#7B68EE',
            success: () => {
                console.log('setBackgroundColor success');
            },
            fail: err => {
                console.log('setBackgroundColor fail', err);
            }
        });
    }
});

錯(cuò)誤碼

Android

iOS