我就是想要做一個(gè)搜索欄隨著下滑漸隱，隨著上滑漸出的動(dòng)畫，但是找不到流暢的解決方案一開始嘗試用transition屬性，判斷下滑方向和搜索欄顯示狀態(tài)，當(dāng)兩者不一致時(shí)更新搜索欄height值。在電腦上看著效果很好，但是用安卓測試的時(shí)候卡頓嚴(yán)重：var?now?=?e.detail.scrollTop
var?last?=?this.data.scrollTop
var?scrollDown?=?this.data.scrollDown
var?sHeight?=?this.data.sHeight
if?((now?>?last?&&?!scrollDown)?||?(now?<?last?&&?scrollDown))?{
??sHeight?=?40-sHeight
??this.data.scrollDown?=?!scrollDown
??this.setData({
????sHeight:?sHeight
??})
}
this.data.scrollTop?=?e.detail.scrollTop然后嘗試使用微信的animation API，然而卡頓依然嚴(yán)重：var?animation?=?wx.createAnimation({
??duration:?500,
??timingFunction:?"ease"
})
this.animation?=?animation
if?((now?>?last?&&?!scrollDown)?||?(now?<?last?&&?scrollDown))?{
??this.data.scrollDown?=?1?-?scrollDown
??this.animation.scale(scrollDown).step()
??this.setData({
????sHeightAnim:?this.animation.export()
??})
}
this.data.scrollTop?=?e.detail.scrollTop查了一下感覺transform和animation的運(yùn)行效率也差不多，畢竟也是要走transition所以有沒有大佬可以提供一個(gè)較好的解決方案orz跪謝
【小程序】請教如何優(yōu)化一個(gè)簡單但導(dǎo)致卡頓的過渡動(dòng)畫
cosloli
2018-02-05 19:40:43
