微信小程序-ios系統-下拉上(shàng)拉出(chū)現白色,如何處理呢?
發表時(shí)間:2021-3-26
發布人(rén):融晨科技
浏覽次數:159
這(zhè)幾天做小程序,有些頁面都是(shì)全屏的(de)背景,在(zài)安卓上(shàng)背景是(shì)固定的(de),而(ér)在(zài)ios上(shàng)上(shàng)拉下拉出(chū)現白色,測試說(shuō)體驗不(bù)太好,一開始我以(yǐ)爲(wéi / wèi)是(shì)下拉上(shàng)拉刷新造成的(de),關閉了(le/liǎo)依然是(shì)這(zhè)樣。爲(wéi / wèi)了(le/liǎo)體驗好點,可以(yǐ)按一下解決:
方式一:
可以(yǐ)在(zài)page.json文件内配置 :"backgroundColor": "#ccc" 屬性,這(zhè)個(gè)方法比較便捷。但是(shì)對于(yú)一些全屏背景的(de)頁面體驗還不(bù)是(shì)很好
方式二:
對于(yú)一些全屏背景頁面,我們可以(yǐ)讓背景固定這(zhè)樣體驗會好點,可以(yǐ)按以(yǐ)下進行操作:
1》page.json設置 "disableScroll":true ; 表示:設置爲(wéi / wèi) true 則頁面整體不(bù)能上(shàng)下滾動;隻在(zài) page.json 中有效,無法在(zài) app.json 中設置該項
2》對于(yú)一些頁面内容太多,需要(yào / yāo)頁面需要(yào / yāo)上(shàng)下滑動的(de)可以(yǐ)在(zài)page.wxml頁面這(zhè)麽處理
<scroll-view scroll-y style="height:{{wh}}px;" bindscrolltolower="onBottom">
</scroll-view>
3》page.js
wx.getSystemInfo({
success: function (res) {
that.setData({
"wh": res.windowHeight
})
}
})
4》全屏背景樣式
page{background: url(xxx.png) no-repeat center center fixed;background-size: cover; }