前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >王者骰子源码分享

王者骰子源码分享

作者头像
BUG弄潮儿
发布2020-06-12 15:49:34
8260
发布2020-06-12 15:49:34
举报
文章被收录于专栏:JAVA乐园JAVA乐园

阅读文本大概需要3分钟。

如果关注我的公众号的都会发现,公众号有一个如下图的菜单:

估计也没多少人点击这个菜单,这个小程序终于达到1000 UV(独立访客)。这个小程序只有一个页面,而且是纯java script写的。

今天把这个小程序的源码分享给大家,主要逻辑控制在index.js

代码语言:javascript
复制
//index.js
//获取应用实例
const app = getApp()

Page({
  data: {
    diceConst: ["/pages/images/01.png", "/pages/images/02.png", "/pages/images/03.png", "/pages/images/04.png", "/pages/images/05.png", "/pages/images/06.png"], //骰子点数
    dicePng: ["/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png"],
    initPng: ["/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png", "/pages/images/00.png"], //未知点数
    historyCount: 0, //历史点数
    currentCount: 0, //当前点数
    actionSheetHidden: true, //列表隐藏标志
    diceCount: 6, //骰子数
    displayFlag: ["", "", "", "", "", ""], //不显示
    genCount: [] //生成的骰子点数
  },
  //事件处理函数
  bindViewTap: function() {

  },
  onLoad: function() {
    var displayFlag = [];
    for (var i = 0; i < 5; i++) {
      displayFlag[i] = "none";
    }
    this.setData({
      displayFlag: displayFlag,
      genCount: []
    });
  },
  //分享
  onShareAppMessage: function() {
    return {
      title: '王者摇骰子',
      desc: '王者摇骰子',
      path: '/pages/index/index'
    }
  },
  //骰子个数事件
  diceCountOpr: function() {
    console.log("diceCountOpr");
    this.setData({
      actionSheetHidden: false
    })
  },
  //点击取消
  actionSheetChange: function() {
    console.log("actionSheetChange")
    this.setData({
      actionSheetHidden: true
    })
  },
  //条目点击事件
  actionSheetItem: function(event) {
    console.log(event)
    this.setData({
      actionSheetHidden: true
    })
    var diceCount = event.currentTarget.dataset.value;
    if (diceCount != 0) {
      this.setData({
        diceCount: diceCount
      });
      var displayFlag = [];
      for (var i = 0; i < 6; i++) {
        if (diceCount - 1 == i) {
          displayFlag[i] = "";
          console.log(displayFlag[i])
        } else {
          displayFlag[i] = "none";
          console.log(displayFlag[i])
        }
        this.setData({
          displayFlag: displayFlag,
          historyCount: 0, //历史点数
          currentCount: 0, //当前点数
          genCount: [], //生成的骰子点数
          dicePng: this.data.initPng
        });
      }
    }
    console.log(this.data.diceCount);
  },
  //摇骰子事件
  diceWaveOpr: function() {
    console.log("diceWaveOpr");
    wx.playBackgroundAudio({
      dataUrl: "http://dx.sc.chinaz.com/Files/DownLoad/sound1/201510/6522.mp3",
    });
    var genCount = [];
    for (var i = 0; i < this.data.diceCount; i++) {
      //点子数
      var num = Math.floor(Math.random() * 6 + 1);
      genCount[i] = num;
    }
    console.log(genCount);
    this.setData({
      genCount: genCount, //生成的骰子点数
      dicePng: this.data.initPng
    });
    wx.vibrateLong({

    });
  },
  //开事件
  diceOpen: function() {
    console.log("diceOpen");
    var diceCount = this.data.diceCount;
    var currentCount = 0;
    var dicePng = this.data.dicePng;
    //生成的点子数
    var genCount = this.data.genCount;
    var len = 6;
    console.log("diceCount = " + diceCount)
    var dicePointPng = [];
    console.log("---genCount---" + genCount)
    console.log(this.data.diceConst)
    if (genCount.length > 0) {
      for (var i = 0; i < len; i++) {
        if (i < diceCount) {
          //生成的点数
          var dicePoint = genCount[i];
          console.log(dicePoint)
          console.log(this.data.diceConst[dicePoint])
          //改变png图片  dicePoint = 图片下标-1  数组从零开始
          dicePointPng[i] = this.data.diceConst[dicePoint-1];
          //点数=数组下标+1
          currentCount = currentCount + dicePoint;
        }
      }
      //变成历史
      var historyCount = this.data.currentCount;
      this.setData({
        historyCount: historyCount, //历史点数
        currentCount: currentCount, //当前点数
        dicePng: dicePointPng,
      });
      console.log(this.data.dicePng);
    } else {
      //提示
      wx.showToast({
        title: '先摇一摇',
        icon: 'success',
        duration: 1000,
        mask: true
      })
    }
  }
})

源码下载地址:

代码语言:javascript
复制
https://gitee.com/hjj520/xml/tree/master/mini

下载完代码后只要把project.config.json文件的如下标志换成自己申请的小程序appid即可。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2019-05-13,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 BUG弄潮儿 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
相关产品与服务
云开发 CloudBase
云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档