标签:creat orm 属性 nbsp sla slider nim get anim
App({
//渐入,渐出实现
show : function(that,param,opacity){
var animation = wx.createAnimation({
//持续时间800ms
duration: 800,
timingFunction: ‘ease‘,
});
//var animation = this.animation
animation.opacity(opacity).step()
//将param转换为key
var json = ‘{"‘ + param + ‘":""}‘
json = JSON.parse(json);
json[param] = animation.export()
//设置动画
that.setData(json)
},
//滑动渐入渐出
slideupshow:function(that,param,px,opacity){
var animation = wx.createAnimation({
duration: 800,
timingFunction: ‘ease‘,
});
animation.translateY(px).opacity(opacity).step()
//将param转换为key
var json = ‘{"‘ + param + ‘":""}‘
json = JSON.parse(json);
json[param] = animation.export()
//设置动画
that.setData(json)
},
//向右滑动渐入渐出
sliderightshow: function (that, param, px, opacity) {
var animation = wx.createAnimation({
duration: 800,
timingFunction: ‘ease‘,
});
animation.translateX(px).opacity(opacity).step()
//将param转换为key
var json = ‘{"‘ + param + ‘":""}‘
json = JSON.parse(json);
json[param] = animation.export()
//设置动画
that.setData(json)
}
})
//index.js
//获取应用实例
const app = getApp(); // 获取全局变量
Page({
data: {},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
let that = this;
// 淡入
setTimeout(function () {
app.slideupshow(this, ‘slide_up1‘, 200, 1)
}.bind(this), 1000);
// 淡出
setTimeout(function () {
app.slideupshow(this, ‘slide_do1‘, 0, 0)
}.bind(this), 1000);
},
})
注意:查看上面show函数定义查看参数含义
第一个参数是当前的页面对象,方便函数setData直接返回数据
第二个参数是绑定的数据名,传参给setData,详细见上面
第三个参数是上下滑动的px, translateY() 属性
第四个参数是需要修改为的透明度,这里是1, opacity属性
.index{ opacity: 0; // 透明度数 transform: translateY(-200px); // 偏移量 }
// index.wxml
<view class="index" animation="{{slide_up1}}"></view>
原文链接:https://blog.csdn.net/weixin_42917830/article/details/81701125
标签:creat orm 属性 nbsp sla slider nim get anim
原文地址:https://www.cnblogs.com/sanyekui/p/12702238.html