实例介绍
【实例简介】
【实例截图】
//index.js
//获取应用实例
var app = getApp()
var cxt_arc;
var timer;
var n = 1;
var timer;
var which = 1;//中奖项
var luck = ["5积分", "5金币", "10积分", "10金币", "谢谢参与", "20金币"];//定义奖项
Page({
data: {
animationData: {},//动画
isclick: "start",//按钮事件
image: "/images/dianji_choujiang.png",//转盘图片
hiddenModal: true,//弹框是否隐藏
detail: "恭喜您获得" luck[which - 1]//弹框内容
},
//事件处理函数
bindViewTap: function () {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad: function () {
console.log('onLoad')
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function (userInfo) {
//更新数据
that.setData({
userInfo: userInfo
})
})
},
start: function (e) {
var _this = this;
n = 1;
this.setData({
isclick: "stop"
})
reset.call(_this);
timer = setInterval(function () {
//开始旋转
star.call(_this);
//
n ;
}
, 300);
//启动动画
function star() {
console.log("开始动画.....")
var animation = wx.createAnimation({
transformOrigin: "50% 50%",
duration: 300,
timingFunction: "linear"
});
animation.rotate(360 * n).step();
this.setData({
animationData: animation.export(),
image: "/images/dianji_tingzhi.png"
})
}
//重置动画
function reset() {
console.log("重置动画.....")
var animation = wx.createAnimation({
transformOrigin: "50% 50%",
duration: 0,
timingFunction: "linear"
});
animation.rotate(0).step();
this.setData({
animationData: animation.export()
})
}
},
stop: function (e) {
var _this = this;
this.setData({
isclick: ""
})
clearInterval(timer);
timer = null;
console.log("结束动画.....");
sto.call(_this);
function sto() {
console.log("重置动画.....")
var animation = wx.createAnimation({
transformOrigin: "50% 50%",
duration: 1.4 * (2160 - (which - 1) * 60),
timingFunction: "ease-out"
});
console.log(Math.random() * 60);
animation.rotate(360 * n (2160 - ((which - 2) * 60) - 35 - (Math.random() * 50))).step();
this.setData({
animationData: animation.export(),
image: "/images/dianji_choujiang.png",
})
}
timer = setTimeout(function () {
_this.setData({
hiddenModal: false
})
}
, 1.4 * (2160 - (which - 1) * 60 300));
},
listenerConfirm: function (e) {
var _this = this;
this.setData({
hiddenModal: true,
isclick: "start"
})
reset.call(_this);
function reset() {
console.log("重置动画.....")
var animation = wx.createAnimation({
transformOrigin: "50% 50%",
duration: 0,
timingFunction: "linear"
});
animation.rotate(0).step();
this.setData({
animationData: animation.export()
})
}
}
})
好例子网口号：伸出你的我的手 — 分享！
相关软件
小贴士
感谢您为本站写下的评论，您的评论对其它用户来说具有重要的参考价值，所以请认真填写。
- 类似“顶”、“沙发”之类没有营养的文字，对勤劳贡献的楼主来说是令人沮丧的反馈信息。
- 相信您也不想看到一排文字/表情墙，所以请不要反馈意义不大的重复字符，也请尽量不要纯表情的回复。
- 提问之前请再仔细看一遍楼主的说明，或许是您遗漏了。
- 请勿到处挖坑绊人、招贴广告。既占空间让人厌烦，又没人会搭理，于人于己都无利。
关于好例子网
本站旨在为广大IT学习爱好者提供一个非营利性互相学习交流分享平台。本站所有资源都可以被免费获取学习研究。本站资源来自网友分享，对搜索内容的合法性不具有预见性、识别性、控制性，仅供学习研究，请务必在下载后24小时内给予删除，不得用于其他任何用途，否则后果自负。基于互联网的特殊性，平台无法对用户传输的作品、信息、内容的权属或合法性、安全性、合规性、真实性、科学性、完整权、有效性等进行实质审查；无论平台是否已进行审查，用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。本站所有资源不代表本站的观点或立场，基于网友分享，根据中国法律《信息网络传播权保护条例》第二十二与二十三条之规定，若资源存在侵权或相关问题请联系本站客服人员，点此联系我们。关于更多版权及免责申明参见 版权及免责申明
网友评论
我要评论