微信小游戏---猜拳游戏

最近几天在学习小程序，看了网上的学习视频，于是自己捣鼓着做出了视频里面的小程序。

这是实现的效果图

一个小程序页面，一般有三个部分文件组成，index.js 这个文件里面放的是实现小程序的js代码；index.wxml文件里面放的是页面的结构层代码；相当于html，index.wxss放的是样式层代码，相当于css代码。

index.wxml运用的是小程序里面的组件，代码如下：

<!--index.wxml-->
<view class="container"><text class="win-text">你已经获胜了</text>
<text class="win-num">{{winNum}}次</text><view class="result">
<image src="{{imgAi}}" class="imgAi"></image>
<text class="notice" >{{notice}}</text>
<image src="{{imgUser}}" class="imgUser"></image>
</view><view class="item"><text class="notice-punches">出拳吧，少年~</text><block wx:for="{{srcs}}" wx:key="*this">
<view class="img-item" id="{{index}}" >
<image src="{{item}}" class="img-size" bindtap="userChooseImg"></image>
</view>
</block><button class="btn-again" bindtap="again">再来！</button></view></view>

index.js 的代码如下：

//index.js
//获取应用实例
var numAi = 0;
var timer;
Page({
data: {
srcs: [
'/pages/images/shiyou.jpg',
'/pages/images/jiandao.jpg',
'/pages/images/bu.jpg',
],
imgAi: '', // 电脑随机显示的图片
imgUser: '/pages/images/wenhao.jpg', // 用户选中的图片
notice: '', // 猜拳对比结果

微信小游戏---猜拳游戏相关推荐

微信小程序猜拳游戏步骤及代码
完整步骤: 1. 创建小程序项目:使用微信开发者工具创建一个小程序项目,并在项目中添加一个页面,用于猜拳游戏. 2. 定义数据结构:定义一个数据结构,用于存储猜拳游戏的信息,包括玩家出拳.计算结果等信 ...
微信小程序（游戏）----拼图游戏（设计思路）
微信小程序(游戏)----拼图游戏(设计思路) 设计思路 1.将一张海报等分成 N*N 的矩阵方法一:利用两个组件循环完成,view组件和image组件,view组件作为盒子规定大小--超出部分不显 ...
微信小程序：游戏助手王者战力查询扫码登录多功能小程序源码
这是一款游戏多功能助手小程序内由王者战力查询(支持微信QQ双端查询,安卓IOS) 游戏扫码登录(内支持多种游戏扫码登录) 短视频去水印功能(支持各大平台) 游戏改名助手(支持空白名生成,符号名生成) ...
微信小程序-测试游戏生成六边多边形
背景基于wepy小程序框架最新又接到新的活动需求啦,是一个测试类的游戏. 大概的看了整个需求,这个活动的难点在于结果页面的六边形指标怎么实现. 效果demo类似分析背景首先,这是用户对应六个 ...
基于微信小程序的游戏账号交易小程序
文末联系获取源码开发语言:Java 框架:ssm JDK版本:JDK1.8 服务器:tomcat7 数据库:mysql 5.7/8.0 数据库工具:Navicat11 开发软件:eclipse/my ...
【联机对战】微信小程序联机游戏开发流程详解
现有一个微信小程序叫中国象棋项目,棋盘类的单机游戏看着有缺少了什么,现在给补上了,加个联机对战的功能,增加了可玩性,对新手来说,实现联机游戏还是有难度的,那要怎么实现的呢,接下来给大家讲一下. 考虑到 ...
Unity 与微信小程序（游戏）交互
本文基于minigame-unity-webgl-transform方案,此方案支持大部分Unity组件及方法,比较可惜的是目前版本不支持任何形式的Video播放(不管是MovieoTexture.V ...
毕业设计之《微信小程序连连看游戏》
从今天开始,有空便会更新关于我的毕业设计微信小程序连连看的相关博客,记录开发过程中所遇到的问题 #### 由于毕业设计涉及个人隐私,我会等毕业后再更新 #### 毕业已经告一段落,近期有时间我会更新博 ...
新版微信小程序的游戏：跳一跳游戏攻略
最近微信更新,小程序新增的小游戏功能引爆了朋友圈,很多人都想知道微信跳一跳怎么跳.跳哪些可以加更多分?微信跳一跳有没有隐秘的加分规则?想必这也是近期所有痴迷微信休闲小游戏跳一跳的玩家比较关注的,那么下 ...
2023基于微信小程序的游戏账号在线交易买卖平台(SSM+mysql)-JAVA.VUE(论文+开题报告+运行)
摘要随着网络和计算机技术的发展,各行各业出现了新的生机.各种办公软件和网站充斥到日常生活中,并在实践中不断的进步和发展.目前办公软件和网站技术已非常成熟,可以为用户提供更好的工作帮助.游戏近几年成 ...

微信小游戏---猜拳游戏

微信小游戏---猜拳游戏相关推荐

最新文章

热门文章