|
index.js
-
-
var app = getApp();
-
-
let animationShowHeight = 300;
-
-
Page({
-
data:{
-
animationData:"",
-
showModalStatus:false,
-
imageHeight:0,
-
imageWidth:0
-
},
-
imageLoad: function (e) {
-
this.setData({imageHeight:e.detail.height,imageWidth:e.detail.width});
-
},
-
showModal: function () {
-
-
var animation = wx.createAnimation({
-
duration: 200,
-
timingFunction: "linear",
-
delay: 0
-
})
-
this.animation = animation
-
animation.translateY(animationShowHeight).step()
-
this.setData({
-
animationData: animation.export(),
-
showModalStatus: true
-
})
-
setTimeout(function () {
-
animation.translateY(0).step()
-
this.setData({
-
animationData: animation.export()
-
})
-
}.bind(this), 200)
-
},
-
hideModal: function () {
-
-
var animation = wx.createAnimation({
-
duration: 200,
-
timingFunction: "linear",
-
delay: 0
-
})
-
this.animation = animation;
-
animation.translateY(animationShowHeight).step()
-
this.setData({
-
animationData: animation.export(),
-
})
-
setTimeout(function () {
-
animation.translateY(0).step()
-
this.setData({
-
animationData: animation.export(),
-
showModalStatus: false
-
})
-
}.bind(this), 200)
-
},
-
onShow:function(){
-
let that = this;
-
wx.getSystemInfo({
-
success: function(res) {
-
animationShowHeight = res.windowHeight;
-
}
-
})
-
},
-
-
})
index.wxml
-
<!--index.wxml-->
-
<view class="container-column">
-
-
<view animation="{{animationData}}" class="container-column buydes-dialog-container" wx:if="{{showModalStatus}}">
-
<view class="buydes-dialog-container-top" bindtap="hideModal"></view>
-
<view class="container-column buydes-dialog-container-bottom">
-
<block wx:for="{{['操作1','操作2','操作3','取消']}}" wx:for-index="index" wx:key="key" wx:for-item="item">
-
<view bindtap="hideModal"
邀请
原作者: 模板之家
来自: 网络收集
|
