樱花飘落模拟器-情人节祝你表白成功

简介: 嗨!大家好,我是小蚂蚁。这是我去年做的一个漂亮的樱花飘落模拟器,你可以改编一下,然后发功给想你爱的人,祝你表白成功。

嗨!大家好,我是小蚂蚁。这是我去年做的一个漂亮的樱花飘落模拟器,你可以改编一下,然后发功给想你爱的人,祝你表白成功。


今天是一个美好的日子,所以小蚂蚁决定教大家用微信小游戏制作工具做一个温暖而美好的“樱花飘落模拟器”小程序,然后把它送给所爱的人。


先看一下最终的效果图。


640.gif


看着樱花缓缓的飘落,然后不觉间竟下起了绵绵的细雨。因为今天我所在的城市正下着小雨,所以就在这个小应用中增加了阵阵的细雨功能。


下面我们就学习一下如何实现一个这样温暖的小程序。


首先准备一下素材。一个粉色的背景,两个樱花花瓣,一个模拟雨滴的长方形,以及两句要显示的话。

2e991bf8e4b1aeca68250e04c6b20e74.png


项目以及所有素材已开源,大家可以拿过来随意的改编,然后通过微信分享给自己所爱的人,文章最后有获取和改编的方法。

接下来我们会为樱花花瓣增加两个行为:翻转旋转。用于模拟花瓣飘落的感觉。


在“层级管理”中选择“樱花花瓣-1”,然后在“图层属性”区域中选择“管理行为”。


d8301bb812faf840b042fb09228dae70.jpg


在“管理行为”面板中开启“翻转”和“旋转”。


d59079e1f4c2eeda864895b8e2550085.png

小提示:你会看到这里有很多已经做好的各种各样行为,都可以直接拿过来用。

开启行为后,会出现两处变化:


  • 在积木区域的”行为“模块下出现了新增的行为积木。可以看到新增了控制“翻转”的积木和控制“旋转”的积木。

  • 在图形属性区中的“管理行为”按钮下新增许多了“翻转”和“旋转”的各种控制参数。

311e9501d3e61df600be924530627337.png


接着,我们还需要为樱花花瓣增加两个局部变量。


f56a9cfddb3242c3e3290212d4da6de1.png


这两个变量是用于记录花瓣飘落时在X和Y方向上的偏移(后续后详细解释)。


下面,我们看一下樱花飘落的逻辑积木。


07796ad4b614c0a4a98951c0d4544bd1.png


上半部分很简单,场景启动后就开始不断的创建花瓣,这里使用了一块随机的积木来增加随机性,每1~1.5的时间,克隆一个花瓣。当花瓣飘出屏幕以后,我们就应该将其删除。


接着看下半部分。


1096dd9fe267bbfaecf0a0dacb13678e.png


整体逻辑并不复杂,主要是设置了各种随机的数值,随机的大小,随机的透明度,随机的移动位置,随机的翻转和旋转。因为影响樱花如何飘落的因素有很多,包括:重力,空气阻力,重力,风等等,可以说是一个完全随机的过程。我们无法完全进行真实的模拟,只是增加了一些随机的数值让它看上去还不错而已。这里整体上樱花的飘落方向都是向右下方的,因为樱花飘落通常都会伴随着微风,这里我就假装有一阵向右吹的风了。


这样,樱花的飘落就完成了。你可以试着调整其中的各种随机数值,然后看看效果如何。


接下来,我们就看一下如何增加阵阵的细雨 。


雨水并不是一打开应用就开始下,而是会随机的间隔一段时间,下一阵,然后再随机的间隔一段时间再下一阵,很像是让人琢磨不透的阵雨。


要实现这种随机的阵雨功能,首先,我们先选中“雨滴”,为它增加一个“下雨计时器”的局部变量,这个变量用于判断下一场雨何时会来。

722454ffc232fef2471aa1a2df479e80.png


接着,为“雨滴”增加如下的逻辑。

6ec16f02be9042fdd78f9cfa049e982a.png


这里,我们通过比较“全局计时器”和被设置随机数值的局部变量“下雨计时器”,来判断何时开始下雨。而且每次下雨后,又会重新随机设置下一场雨的间隔时间。

注意这里有一个“全局计时器”的积木块,主要作用在于记录游戏的时间,即当你打开游戏的那一刻,“全局计时器”就开始记录时间。“全局计时器归零”这块积木的作用就是把“全局计时器”中记录的时间重置清零。


最后,看一下下雨的逻辑。


38ea4055f9a9264ecc2ee5c93ab76ae0.png


与樱花飘落类似,不过这里要简单的多,不需要翻转和旋转,雨滴只需要垂直下落即可。


对于场景中显示的文字,只需要在打开后先将其隐藏,然后2秒钟过后,再慢慢的显示出来即可。


ab5d62eec3e75b0cef1bc4d3f755ed3b.png


最后,看一下效果吧!


ad9e6988e756b4b319a1b48223acd015.gif


打开后,慢慢的显示第一句话。


05444e434b81e3e350c66ed04246c031.gif


间隔一段时间后,下起小雨,慢慢的显示第二句话。


最后,也将这两句温暖的话送给你。


静看那樱花飘落,莫忘了生活的美。

生活中难免有雨,但雨水总会过去。

---小蚂蚁

相关文章
|
JavaScript 前端开发 API
详解React与Vue的性能对比
详解React与Vue的性能对比
619 0
|
安全 Java 数据安全/隐私保护
通过java实现ldap修改AD域用户密码(最新,详细)
环境及说明,AD证书安装过程,AD证书的导出与导入,AD证书导入java密钥库中,java实现ldap改密
22717 0
|
10月前
|
人工智能 自然语言处理 算法
《DevEco CodeGenie——人工智能开发者的得力助手》
华为推出的DevEco CodeGenie为AI开发者提供了全方位的支持,涵盖智能知识问答、代码补全与生成、万能卡片生成等功能。它基于生成式搜索能力,快速解决开发难题,显著提升开发效率,缩短项目周期。尤其对新手友好,降低入门门槛,助力其快速上手鸿蒙原生应用开发。通过解放开发者于繁琐任务中,激发创新思维,专注于业务逻辑实现与技术创新,推动AI技术在鸿蒙生态中的深度融合与发展。
391 21
|
11月前
|
存储 编译器 C语言
【C语言】指针大小知多少 ?一场探寻C语言深处的冒险 !
在C语言中,指针的大小(即指针变量占用的内存大小)是由计算机的体系结构(例如32位还是64位)和编译器决定的。
1275 9
|
小程序 JavaScript
微信小程序之input组件及其获取用户输入信息
微信小程序之input组件及其获取用户输入信息
313 2
|
编解码 文字识别
印刷文字识别操作报错合集之在尝试将PDF文件转换为图片时出现了问题,具体的错误代码是415,该怎么处理
在使用印刷文字识别(OCR)服务时,可能会遇到各种错误。例如:1.Java异常、2.配置文件错误、3.服务未开通、4.HTTP错误码、5.权限问题(403 Forbidden)、6.调用拒绝(Refused)、7.智能纠错问题、8.图片质量或格式问题,以下是一些常见错误及其可能的原因和解决方案的合集。
|
机器学习/深度学习 人工智能 编解码
Adobe Photoshop 2023新增功能及电脑系统要求
Adobe 图像处理软件 Photoshop 2023 正式版( 24.1.0 )2022 年12 月版发布。Adobe Photoshop2023是一款流行的专业图像处理软件及照片和设计软件,Adobe Creative Cloud 创意云桌面程序中心的图形设计软件,是平面设计领域和数字图象处理行业标准。
2471 0
|
存储 NoSQL Shell
InfluxDB的存储引擎演化过程
InfluxDB的存储引擎从LSM Tree,到mmap B+ Tree,再到TSM Tree。
6954 0
|
存储 关系型数据库 数据管理
【最佳实践】高性价比的数据归档解决方案(DMS + AnalyticDB PostgreSQL)
发布全新数据归档方案,依托DMS + AnalyticDB PostgreSQL Serverless版本,帮助客户用低价格实现海量数据的持久化,还可以对归档数据进行完善管理、高效寻回、查看并进行分析
【最佳实践】高性价比的数据归档解决方案(DMS + AnalyticDB PostgreSQL)