天天看點

女神節你也能自己動手制作一個漂亮的微信小遊戲

本文首發于微信公衆号【小螞蟻教你做遊戲】,歡迎關注,學習更多遊戲開發原創教程。

嗨!大家好,我是小螞蟻。

這是我之前制作的一個非常漂亮的微信小遊戲,你可以給予它進行改編,然後自己制作一個小遊戲送給你想送的人。

我發現這篇文章每年至少可以發四次,情人節一次,女神節一次,520一次,七夕一次[陰險]。

今年的我做了點兒改進,增加了一首背景音樂,是經典的《卡農》鋼琴曲,希望你喜歡。

忘了準備禮物,或者總是沒什麼新意?那就快來自己動手試試吧!

今天是一個美好的日子,是以小螞蟻決定教大家用微信小遊戲制作工具做一個溫暖而美好的“櫻花飄落模拟器”小遊戲,然後把它送給所愛的人。

先看一下最終的效果圖。

女神節你也能自己動手制作一個漂亮的微信小遊戲

看着櫻花緩緩的飄落,然後不覺間竟下起了綿綿的細雨。因為今天我所在的城市正下着小雨,是以就在這個小應用中增加了陣陣的細雨功能。

下面我們就學習一下如何實作一個這樣溫暖的小程式。

首先準備一下素材。一個粉色的背景,兩個櫻花花瓣,一個模拟雨滴的長方形,以及兩句要顯示的話。

女神節你也能自己動手制作一個漂亮的微信小遊戲

接下來我們會為櫻花花瓣增加兩個行為:翻轉和旋轉。用于模拟花瓣飄落的感覺。

在“層級管理”中選擇“櫻花花瓣-1”,然後在“圖層屬性”區域中選擇“管理行為”。

女神節你也能自己動手制作一個漂亮的微信小遊戲

在“管理行為”面闆中開啟“翻轉”和“旋轉”。

女神節你也能自己動手制作一個漂亮的微信小遊戲
小提示:你會看到這裡有很多已經做好的各種各樣行為,都可以直接拿過來用。

開啟行為後,會出現兩處變化:

  • 在積木區域的”行為“子產品下出現了新增的行為積木。可以看到新增了控制“翻轉”的積木和控制“旋轉”的積木。
  • 在圖形屬性區中的“管理行為”按鈕下新增許多了“翻轉”和“旋轉”的各種控制參數。
女神節你也能自己動手制作一個漂亮的微信小遊戲

接着,我們還需要為櫻花花瓣增加兩個局部變量。

女神節你也能自己動手制作一個漂亮的微信小遊戲

這兩個變量是用于記錄花瓣飄落時在X和Y方向上的偏移(後續後詳細解釋)。

下面,我們看一下櫻花飄落的邏輯積木。

女神節你也能自己動手制作一個漂亮的微信小遊戲

上半部分很簡單,場景啟動後就開始不斷的建立花瓣,這裡使用了一塊随機的積木來增加随機性,每1~1.5的時間,克隆一個花瓣。當花瓣飄出螢幕以後,我們就應該将其删除。

接着看下半部分。

女神節你也能自己動手制作一個漂亮的微信小遊戲

整體邏輯并不複雜,主要是設定了各種随機的數值,随機的大小,随機的透明度,随機的移動位置,随機的翻轉和旋轉。因為影響櫻花如何飄落的因素有很多,包括:重力,空氣阻力,重力,風等等,可以說是一個完全随機的過程。我們無法完全進行真實的模拟,隻是增加了一些随機的數值讓它看上去還不錯而已。這裡整體上櫻花的飄落方向都是向右下方的,因為櫻花飄落通常都會伴随着微風,這裡我就假裝有一陣向右吹的風了。

這樣,櫻花的飄落就完成了。你可以試着調整其中的各種随機數值,然後看看效果如何。

接下來,我們就看一下如何增加陣陣的細雨 。

雨水并不是一打開應用就開始下,而是會随機的間隔一段時間,下一陣,然後再随機的間隔一段時間再下一陣,很像是讓人琢磨不透的陣雨。

要實作這種随機的陣雨功能,首先,我們先選中“雨滴”,為它增加一個“下雨計時器”的局部變量,這個變量用于判斷下一場雨何時會來。

女神節你也能自己動手制作一個漂亮的微信小遊戲

接着,為“雨滴”增加如下的邏輯。

女神節你也能自己動手制作一個漂亮的微信小遊戲

這裡,我們通過比較“全局計時器”和被設定随機數值的局部變量“下雨計時器”,來判斷何時開始下雨。而且每次下雨後,又會重新随機設定下一場雨的間隔時間。

注意這裡有一個“全局計時器”的積木塊,主要作用在于記錄遊戲的時間,即當你打開遊戲的那一刻,“全局計時器”就開始記錄時間。

“全局計時器歸零”這塊積木的作用就是把“全局計時器”中記錄的時間重置清零。

最後,看一下下雨的邏輯。

女神節你也能自己動手制作一個漂亮的微信小遊戲

與櫻花飄落類似,不過這裡要簡單的多,不需要翻轉和旋轉,雨滴隻需要垂直下落即可。

對于場景中顯示的文字,隻需要在打開後先将其隐藏,然後2秒鐘過後,再慢慢的顯示出來即可。

女神節你也能自己動手制作一個漂亮的微信小遊戲

最後,看一下效果吧!

女神節你也能自己動手制作一個漂亮的微信小遊戲

打開後,慢慢的顯示第一句話。

女神節你也能自己動手制作一個漂亮的微信小遊戲

間隔一段時間後,下起小雨,慢慢的顯示第二句話。

最後,也将這兩句溫暖的話送給你。

靜看那櫻花飄落,莫忘了生活的美。

生活中難免有雨,但雨水總會過去。

---小螞蟻

項目開源連結擷取方式:關注小螞蟻,發送私信“櫻花飄落”,擷取項目開源連結。