//index.js
//获取应用实例
var app = getApp()
Page({
data: {
circleList: [],//圆点数组
awardList: [],//奖品数组
colorCircleFirst: '#FFDF2F',//圆点颜色1
colorCircleSecond: '#FE4D32',//圆点颜色2
colorAwardDefault: '#F5F0FC',//奖品默认颜色
colorAwardSelect: '#ffe400',//奖品选中颜色
indexSelect: 0,//被选中的奖品index
isRunning: false,//是否正在抽奖
imageAward: [
'../../images/1.jpg',
'../../images/2.jpg',
'../../images/3.jpg',
'../../images/4.jpg',
'../../images/5.jpg',
'../../images/6.jpg',
'../../images/7.jpg',
'../../images/8.jpg',
],//奖品图片数组
},
onLoad: function () {
var _this = this;
//圆点设置
var leftCircle = 7.5;
var topCircle = 7.5;
var circleList = [];
for (var i = 0; i < 24; i++) {
if (i == 0) {
topCircle = 15;
leftCircle = 15;
} else if (i < 6) {
topCircle = 7.5;
leftCircle = leftCircle + 102.5;
} else if (i == 6) {
topCircle = 15
leftCircle = 620;
} else if (i < 12) {
topCircle = topCircle + 94;
leftCircle = 620;
} else if (i == 12) {
topCircle = 565;
leftCircle = 620;
} else if (i < 18) {
topCircle = 570;
leftCircle = leftCircle - 102.5;
} else if (i == 18) {
topCircle = 565;
leftCircle = 15;
} else if (i < 24) {
topCircle = topCircle - 94;
leftCircle = 7.5;
} else {
return
}
circleList.push({ topCircle: topCircle, leftCircle: leftCircle });
}
this.setData({
circleList: circleList
})
//圆点闪烁
setInterval(function () {
if (_this.data.colorCircleFirst == '#FFDF2F') {
_this.setData({
colorCircleFirst: '#FE4D32',
colorCircleSecond: '#FFDF2F',
})
} else {
_this.setData({
colorCircleFirst: '#FFDF2F',
colorCircleSecond: '#FE4D32',
})
}
}, 500)
//奖品item设置
var awardList = [];
//间距,怎么顺眼怎么设置吧.
var topAward = 25;
var leftAward = 25;
for (var j = 0; j < 8; j++) {
if (j == 0) {
topAward = 25;
leftAward = 25;
} else if (j < 3) {
topAward = topAward;
//166.6666是宽.15是间距.下同
leftAward = leftAward + 166.6666 + 15;
} else if (j < 5) {
leftAward = leftAward;
//150是高,15是间距,下同
topAward = topAward + 150 + 15;
} else if (j < 7) {
leftAward = leftAward - 166.6666 - 15;
topAward = topAward;
} else if (j < 8) {
leftAward = leftAward;
topAward = topAward - 150 - 15;
}
var imageAward = this.data.imageAward[j];
awardList.push({ topAward: topAward, leftAward: leftAward, imageAward: imageAward });
}
this.setData({
awardList: awardList
})
},
//开始游戏
startGame: function () {
if (this.data.isRunning) return
this.setData({
isRunning: true
})
var _this = this;
var indexSelect = 0
var i = 0;
var timer = setInterval(function () {
indexSelect++;
//这里我只是简单粗暴用y=30*x+200函数做的处理.可根据自己的需求改变转盘速度
i += 30;
if (i > 1000) {
//去除循环
clearInterval(timer)
//获奖提示
wx.showModal({
title: '恭喜您',
content: '获得了第' + (_this.data.indexSelect + 1) + "个优惠券",
showCancel: false,//去掉取消按钮
success: function (res) {
if (res.confirm) {
_this.setData({
isRunning: false
})
}
}
})
}
indexSelect = indexSelect % 8;
_this.setData({
indexSelect: indexSelect
})
}, (200 + i))
}
})
没有合适的资源?快使用搜索试试~ 我知道了~
微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)

共16个文件
jpg:8个
js:3个
json:2个

1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉

温馨提示
微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程序精品demo:大转盘,仿天猫超市抽奖(源代码+截图)微信小程
资源推荐
资源详情
资源评论









收起资源包目录























共 16 条
- 1
资源评论

- #完美解决问题
- #运行顺畅
- #内容详尽
- #全网独家
- #注释完整
- m0_749767662023-07-23资源不错,内容挺好的,有一定的使用价值,值得借鉴,感谢分享。
- m0_373194432025-01-01资源有一定的参考价值,与资源描述一致,很实用,能够借鉴的部分挺多的,值得下载。

荣华富贵8
- 粉丝: 227
- 资源: 7653
上传资源 快速赚钱
我的内容管理 展开
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助


最新资源
- 三菱Q系列PLC与ABB机器人综合项目案例:含注释程序、触摸屏画面及智能模块应用,三菱Q系列PLC与ABB机器人大型项目程序案例:含注释、触摸屏画面及智能模块应用,三菱Q系列PLC 大型项目程序案例
- Furion-C#资源
- 西门子200smart PLC自写PID功能块:突破限制,轻松实现项目快速开发与调试,西门子200smart PLC自定义PID功能块开发与应用挑战解析:解决PID参数管理难题,提升项目开发与调试效率
- JFinal-PHP资源
- xe-utils-JavaScript资源
- 改进粒子群算法在微电网多目标优化调度中的应用:环保与经济模型研究,改进粒子群算法下的微电网多目标优化调度策略:经济环保模型求解,2基于改进粒子群算法的微电网多目标优化调度 以微电网的运行成本、环境保护
- NRCE-TEST-计算机二级资源
- 毕业设计-毕业设计资源
- 三菱Q06UDV系列PLC与威纶通触摸屏驱动的锂电池电芯组盘机全自动控制系统,三菱Q06UDV系列PLC与威纶通触摸屏驱动的锂电池电芯组盘机全自动控制系统,三菱Q06UDV系列PLC,威纶通触摸屏,锂
- IR2-Net-ACM资源
- TC264__2022-智能车资源
- rlcard-机器学习开发资源
- MATLAB-轮腿仿真(哈工程建模)-matlab仿真资源
- dag_scheduler-scratch资源
- deepseek-DeepSeek资源
- 智慧园区管理系统-活动资源
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈



安全验证
文档复制为VIP权益,开通VIP直接复制
