第一步，在元件裡編寫彈窗的**
<第二部，在對應的點選事件中view
class
='bottommodel'
wx:if
="}"
catchtouchmove
="tocatch"
>
view
>
<
view
class
='fixedmodel'
wx:if
="}"
animation
='}'
>
<
view
class
='wraps'
>
<
view
class
='fixedtitle'
>
<
view
class
='commony'
bindtap
='noshow'
>取消
view
>
<
view
class
='centertitle'
>活動型別
view
>
<
view
class
='commony'
bindtap
='sure'
>確定
view
>
view
>
<
view
class
='fixedcontent'
>
<
view
class
='contents'
wx:for
="}"
wx:for-index
="idx"
wx:key
="idx"
>
<
view
class
='items'
bindtap
='chooseitem'
id="}"
>
<
image
class
='icons'
wx:if
="}"
src='}'
>
image
>
<
image
class
='icons'
wx:else src
='}'
>
image
>
<
view
>}
view
>
view
>
view
>
view
>
view
>
view
>
//活動型別第三部，隱藏彈框activitytype: function () )
// 將該變數賦值給當前動畫
that.animation = animation
// 先在y軸偏移，然後用step()完成乙個動畫
animation.translatey(550).step()
// 用setdata改變當前動畫
that.setdata()
// 設定settimeout來改變y軸偏移量，實現有感覺的滑動
settimeout(function () )
}, 200)
},
noshow: function () )注意：上面的550是你彈框的高度rpx，上面的catchtouchmove是彈框顯示的時候防止地圖的遮罩層滾動that.animation = animation
animation.translatey(550).step()
that.setdata()
settimeout(function () )
}, 200)
},
tocatch:function(),效果如下
微信小程式底部彈框動畫
在寫小程式的時候，一般會碰到底部彈出動畫，就像下面這樣的效果 直接進入正題 1.首先需要寫點選觸發事件 view class text bindtap choosesezi 請選擇 顏色 尺碼 view 這是點選之後需要彈出的內容，為了方便我把裡面的內容去掉了，masklayer是遮罩層，choos...
微信小程式底部導航
tabbar 複製 配置的引數 tabbar 指底部的 導航配置屬性 color 未選擇時 底部導航文字的顏色 selectedcolor 選擇時 底部導航文字的顏色 borderstyle 底部導航邊框的樣色 注意 這裡如果沒有寫入樣式 會導致 導航框上邊框會出現預設的淺灰色線條 list 導航配...
微信小程式動畫
一 自定義動畫使用步驟 1.建立動畫例項 let animation wx.createanimation duration 900 2.呼叫例項的方法 動畫執行過程 animation.opacity 0.5 scale 1.3,1.3 step opacity 1 scale 1,1 step ...