微信小程序上拉、下拉、動態(tài)設(shè)置窗口背景色

一、enablePullDownRefresh

1、下拉刷新enablePullDownRefresh的支持

單頁面配置json文件

{
  "enablePullDownRefresh": true
}

app.json配置（所有頁面都帶有下拉刷新功能）

{
    "window": {
        "enablePullDownRefresh": true
    }
}

2、設(shè)置backgroundTextStyle
大家會發(fā)現(xiàn)別人的小程序下拉刷新是有三個點(diǎn)閃爍的動畫、自己設(shè)置的并沒有。這里面有個設(shè)置backgroundTextStyle的支持:

    "backgroundTextStyle": ""，支持 dark/light

3、停止stopPullDownRefresh

微信小程序還提供了停止下拉刷新的API:
https://developers.weixin.qq.com/miniprogram/dev/api/wx.stopPullDownRefresh.html

 wx.stopPullDownRefresh()

二、onReachBottomDistance上拉觸底

1、頁面上拉觸底事件觸發(fā)時距頁面底部距離，單位為px。
（單頁面json配置，app.json的window配置中配置 全部頁面的上拉觸底）

 "onReachBottomDistance": 50//默認(rèn)值是50

2、在Page.onReachBottom里面進(jìn)行渲染數(shù)據(jù)及查看

  /**
   * 頁面上拉觸底事件的處理函數(shù)
   */
  onReachBottom: function () {
    console.log("頁面上拉觸底事件的處理函數(shù)")
  },

三、動態(tài)設(shè)置下拉背景字體、loading 圖的樣式

wx.setBackgroundTextStyle({
  textStyle: 'dark' // 下拉背景字體、loading 圖的樣式為dark
})

四、動態(tài)設(shè)置窗口的背景色

wx.setBackgroundColor({
  backgroundColor: '#ffffff', // 窗口的背景色為白色
})
<!--兼容ios-->
wx.setBackgroundColor({
    backgroundColorTop: '#DC143C', // 頂部窗口的背景色為紅
    backgroundColorBottom: '#00FA9A', // 底部窗口的背景色為綠
})