专栏首页JAVA乐园王者骰子源码分享

王者骰子源码分享

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

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

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

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

//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
      })
    }
  }
})

源码下载地址:

https://gitee.com/hjj520/xml/tree/master/mini

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

本文分享自微信公众号 - JAVA乐园(happyhuangjinjin88),作者:java乐园

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2019-05-13

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 国人开发的一套MVC框架

    最近经常闲逛码云,发现了一款国人开发的MVC,感觉非常不错。用在中小型的项目非常合适,它就是JFinal。已经有不少开源的项目基于这个MVC框架开发。

    java乐园
  • Apollo配置中心源码编译及搭建

    Apollo(阿波罗)是携程框架部门研发的分布式配置中心,能够集中化管理应用不同环境、不同集群的配置,配置修改后能够实时推送到应用端,并且具备规范...

    java乐园
  • 分布式爬虫管理平台Crawlab开发搭建

    分布式爬虫管理平台Crawlab发现挺不错,但是官方文档中涉及二次开发的环境启动章节比较模糊。

    java乐园
  • JSON.stringify出现 “Converting circular structure to JSON”

    JSON.stringify大家已经不陌生了,是一个将json对象转换为字符串的方法。但是如果你在浏览器控制台中输出 JSON.stringify(window...

    无邪Z
  • 微信小程序从零开始开发步骤(三)底部导航栏

    祈澈菇凉
  • 基础拾遗-----数据注解与验证

    前言 其实对于这块知识点,一直觉得没有必要进行总结,只是新到的公司当时用到了 kendo for asp.net mvc ,里面有用到,自动初始化页面,而依据基...

    kmonkey
  • RavenDb学习(四)处理文档相关性

    RavenDb是文档型数据库,但是我们常常也需要定义对象之间的关系,那RavenDb当中是如何处理的呢? RavenDb提供了优雅的解决方式,使用正确的话,可以...

    岑玉海
  • openlayers4中闪烁点的实现

    lzugis
  • Attribute(特性),怎么用才更好?

    前几年:   2008年的某一天,我坐火车去北京。硬卧上铺,一晚上就到北京了。爬到上铺之后发现,旁边上铺有一老兄抱着一个笔记本,一开始还以为是看电影呢,仔细一...

    用户1174620
  • js设计模式补白之 this/call和apply

    这里call(this)显然是把当前的作用域(window)绑定给了getName方法。

    一粒小麦

扫码关注云+社区

领取腾讯云代金券