微信小游戏制作工具中实现计时功能

简介: 微信小游戏制作工具中实现计时功能

在游戏中经常会有需要倒计时的需求,例如倒计时 10 分钟可以获得 1 点体力,倒计时 1 小时后可以开启一个宝箱,或者是根据游戏的计时获得奖励等等。


今天就分享一下如何使用微信小游戏制作工具来实现在线计时器和离线计时器的功能。


在线计时器


首先布置一下场景。



如图的场景中,只有一个背景,以及一个基础的文字,我们将会使用基础的文字来显示倒计时。


实现倒计时功能的一个关键点就是进行时间的换算,如何将一定的“秒数”,转换成多少分,多少秒,然后最终使用“分:秒”的形式进行显示。


我们使用“除法”运算来计算当前的分钟数,然后使用“取余”运算来计算当前的秒数。

假设当前剩余的时间为 158 秒。

分钟数 = 向下取整(158 / 60)= 向下取整(2.6333) = 2

秒数 = 158 % 60 = 38


最终就可以将分钟数和秒数拼接起来,就是“2:38”,通常分钟和秒数都会使用两位数来显示,所以需要为分钟数前方添加一个 0 ,即最终的显示时间为 "02:38" 。

下面,我们就来看一下具体的实现。


首先创建几个全局变量。



“剩余时间”记录的是倒计时的总时间(以秒计),“分钟”和“秒数”记录的是根据剩余时间计算得到的分钟数和秒数,“倒计时数字”记录的最终要显示的倒计时。


接着,为“基础文字”添加倒计时的积木逻辑。



积木逻辑并不复杂,设置了倒计时的总时间 158 秒,计算出对应的分钟数和秒数,使用拼接积木将分钟数和秒数拼接起来,最终显示在文本上。


运行一下场景。



可以看到,我们将 158 秒换算成了 “02:38” 的形式正确的显示了。

让时间动起来


接下来,我们就让倒计时动起来吧!


接着在上方的积木下增加如下的积木块,让计时器跑起来。



我们使用了一个“重复执行”积木来处理跑动的倒计时,然后使用了一个“等待 1 秒”积木块实现了每间隔 1 秒去进行一次处理。至于时间的换算和显示则跟上方一样,如果还有剩余时间,则每隔 1 秒,处理显示一次。如果没有剩余时间了,则倒计时结束,退出循环。


运行一下,看看最终的效果。



计时器正常跑起来了。



使用函数来复用积木块


在计时器的积木块逻辑中,关于时间换算、拼接、显示部分的积木块,其实是使用了两次,对于这种情况,我们可以把这些会重复使用的积木块放到一个“函数”中。


我们创建一个“时间换算”的函数,然后把这部分可以复用的积木块放到函数中。



最终的倒计时的所有积木就变成了这样,看起来简洁了许多。


实现离线的计时器


通常我们在游戏中不光需要在线计时器,也需要离线的计时器。那么什么是离线的计时器呢?就是当玩家在退出游戏之后,计时器仍然能够计时。


举个例子,在“精致1010”有一个“种朵小花”的功能,玩家每隔 30 分钟就能够给植物浇一次水,通过浇水植物能够生长,并且生成金币。如果玩家在浇过一次水后,退出了游戏,然后等了 30 分钟后,再次回到游戏,此时计时应该是结束的,玩家可以再次为小花浇水。也就是说,虽然玩家退出了游戏,但是计时器并没有停止,仍然在计时,这就是离线计时功能了。



想实现这样的一个离线计时器的功能,我们需要借助 2 个东西。


第 1 个东西是“本地缓存”功能,它可以帮助我们把游戏中的数据缓存在本地,这样等玩家下次再打开游戏时,就可以通过“本地缓存”得到之前存储的数据。(有关于本地缓存的具体使用方法,可以参见这篇文章)


第 2 个东西叫做“时间戳”,它指的是从某一时间开始经过的秒数。通常所说的时间戳指的都是“UNIX时间”。

维基百科对于UNIX时间的定义:

UNIX时间,或称POSIX时间UNIX类UNIX系统使用的时间表示方式:从UTC1970年1月1日0时0分0秒起至现在的总秒数,不考虑闰秒。


通俗点儿来讲这个“时间戳”指的就是从某一时间开始到此刻为止,一共经历了多少时间。我们怎样通过它来计算离线时间呢?比方说,我在 8 点钟退出了游戏,那么就可以在退出游戏前,把此时的“时间戳”做个记录,使用缓存功能把这个时间记录下来。然后,我 9 点钟的时候,又重新进入了游戏。这时就可以将当前的“时间戳”减去之前缓存的“时间戳”,就可以计算出离线的时间了。


这就是计算离线时间的原理了。其实并不是指游戏退出后,偷偷的在背后运行进行计时,而是通过“本地缓存”和“时间戳”这两样东西,通过计算来得到离线的那段时间。


下面,我们就来实现一下离线计时的功能。


首先,开启本地缓存的插件。



开启之后,就可以使用与本地缓存有关的积木块了。


接着,找到获取“时间戳”的积木块,它位于“计算”类别中的“当前时间的XX”积木块中,点击下拉,可选中获得“时间戳”。



最后,看一下实现的积木逻辑。



我们梳理一下整个逻辑,每次进入游戏时,首先去计算一下离线时间,通过“当前的时间戳”减去“之前缓存的时间戳”,然后通过换算,得到离线时间的总秒数,然后将“剩余时间”减去“离线时间”得到最新的“剩余时间”。如果“剩余时间”大于 0 的话,就开始倒计时,否则的话就表明倒计时结束。


这里需要注意的一点儿就是倒计时中新增的两块缓存积木,每当“剩余时间”发生变化时,我们都将最新的“剩余时间”和“时间戳”进行缓存。这样,不论何时玩家退出游戏,或者是进入到游戏的其他场景,缓存中的“剩余时间”和“时间戳”记录的都是最后的那一刻。


最后,我做了一个计时器的示例项目,里面包含了在线计时器和离线计时器功能的实现,已经开源到了社区,大家可以自行获取项目进行改编或学习。

计时器示例项目地址:

https://gamemaker.weixin.qq.com/#/game?game_id=lbM2VmZjhmYmUtZGY5ZS00ZjU1LWIwYjUtOGMyYzZhNDE2Mzc4


今天分享的内容就到这里了,希望这篇文章能够帮助你彻底的搞懂在游戏中实现一个计时器的原理以及方法。


相关文章
|
1月前
|
安全 API 开发者
微信开发者工具里面没有企业微信模式
企业微信与普通微信在应用场景和开发体系上存在本质区别,主要体现在身份认证、功能丰富性和开放能力等方面。企业微信开发需使用特定的API和工具,本文介绍了企业微信开发的基本步骤、特点及开发进度安排,帮助开发者更好地理解和应用企业微信的开发环境。
|
2月前
|
数据可视化 前端开发 小程序
5G时代-探索微信小游戏
5G时代-探索微信小游戏
33 2
5G时代-探索微信小游戏
|
2月前
|
存储 自然语言处理 小程序
微信小程序多语言切换神器:简繁体切换功能完全指南
随着全球化的发展,支持多种语言的应用程序愈发重要。本文介绍了如何在微信小程序中实现简体与繁体字体之间的切换功能,以满足不同地区用户的需求。通过创建utils文件夹并编写相应的转换函数,开发者可以方便地实现语言切换,从而提升用户体验。文章中还附带了示例代码和效果图,帮助读者更好地理解和应用这一功能。
112 0
微信小程序多语言切换神器:简繁体切换功能完全指南
|
2月前
|
缓存 数据可视化 Serverless
微信小游戏 案例一 像素飞机
微信小游戏 案例一 像素飞机
22 2
|
2月前
|
移动开发 小程序 数据可视化
微信小程序可视化开发工具之动态数据
微信小程序可视化开发工具之动态数据
48 3
|
3月前
|
算法 JavaScript 前端开发
切西瓜法实现微信抢红包功能
该文章介绍了使用“切西瓜法”和“栅栏法”两种算法来模拟微信抢红包的随机分配机制,并通过具体的JavaScript代码实现了红包金额的公平随机分配过程。
切西瓜法实现微信抢红包功能
|
4月前
|
人工智能 小程序 Java
【工具】轻松解锁SQLite数据库,一窥微信聊天记录小秘密
本文介绍了一款名为PyWxDump的开源工具,它可以获取微信账户信息、解密SQLite数据库以查看和备份聊天记录。此工具适用于已登录电脑版微信的用户,通过GitHub下载后简单几步即可操作。适合对数据恢复感兴趣的开发者,但请注意合法合规使用并尊重隐私。
628 2
【工具】轻松解锁SQLite数据库,一窥微信聊天记录小秘密
|
3月前
|
人工智能 前端开发 JavaScript
MacTalk 测评通义灵码,实现“微信表情”小功能
墨问西东创始人池建强分享了团队使用通义灵码的经验。
|
3月前
|
小程序 API 开发工具
使用python 实现微信签到提醒功能
【9月更文挑战第4天】使用python 实现微信签到提醒功能
86 2
|
4月前
|
Web App开发 缓存 小程序
【Azure API 管理】从微信小程序访问APIM出现200空响应的问题中发现CORS的属性[terminate-unmatched-request]功能
【Azure API 管理】从微信小程序访问APIM出现200空响应的问题中发现CORS的属性[terminate-unmatched-request]功能