天天看點

想做個答題類的微信小遊戲?讀這篇文章就夠了

想做個答題類的小程式?亦或者想做個背單詞類的小程式?這篇文章将會從原理到實踐,幫助你徹底弄明白答題類小程式的制作思路和制作方法。

答題類的小程式主要以内容為主,就是說要去編輯題目和答案,對于題目的編輯操作,最合适的方式當然是使用表格進行編輯了。下面就介紹一個答題類小程式實作中最重要的角色:表格。

在微信小遊戲制作工具中,建立和使用表格非常的簡單。在資料區中點選“建立表格”按鈕,即可建立表格了。

想做個答題類的微信小遊戲?讀這篇文章就夠了

可以看到這裡,我建立了一個叫做“題庫”的表格,用來盛放所有的題目。

想做個答題類的微信小遊戲?讀這篇文章就夠了

這裡我建立了一個 5 行 5 列的表格,第 1 列是題目,第 2,3,4 列是選項,第 5 列是答案,答案中記錄的是正确選項的列号。

通過這個表格我們可以知道下面這些資訊:

一共包含多少個題目(總行數)

每一題有多少個選項

每一題的題目是什麼

每一題的正确答案是什麼

我們隻需要從表格中取出一行資料,就能夠獲得目前的題目,選項以及答案。

微信小遊戲制作工具中的表格資料是可以進行導入,導出操作的, 你可以将表格資料導出來,然後在自己的電子表格軟體中進行編輯,編輯完之後,再将資料導入進去。

想做個答題類的微信小遊戲?讀這篇文章就夠了

資料導出後,會自動生成一個以 csv 為字尾名的檔案,該檔案可以直接使用電子表格軟體打開。下圖為我在 WPS表格 中打開的導出資料。

想做個答題類的微信小遊戲?讀這篇文章就夠了

當你在表格中編輯完所有的題目後,點選制作工具中表格對話框中的“導入”按鈕,選擇對應的檔案即可導入了。

想做個答題類的微信小遊戲?讀這篇文章就夠了

這裡選擇“覆寫”,會将原有表格中的資料删除,使用新的導入的資料進行填充。

以上就是一個答題類小程式最核心的資料了,接下來我們要做的就是如何去操作這樣的一個表格,讓這些資料變成一個可以互動的答題小遊戲。

我們将會實作一個這樣的答題小遊戲,每個回合随機地從題庫中抽取三道題來進行回答。

這裡有一個重點,要從題庫中随機的抽取題目,當然随機抽取的題目是不能重複的,那麼如何實作一個随機抽取不重複的題目的功能呢?

這裡,我們需要再引入一個重要角色:清單。清單可以把它了解成隻有一列的表格。在資料區中,點選“建立清單”按鈕即可以建立清單了。

想做個答題類的微信小遊戲?讀這篇文章就夠了

可以看到,清單中隻包含一列資料。

想做個答題類的微信小遊戲?讀這篇文章就夠了

實作思路:使用清單來記錄已經抽取的題目編号,當我們随機抽取到一個新的題目編号時,首先檢查一下這個題目的編号是否已經在清單中了,如果在的話,就證明了這個題目已經抽取了,不能再重複抽取了,需要去重新随機抽取。如果不在話,就把這個新的題目編号記錄在清單中。

首先,我們建立幾個變量。

想做個答題類的微信小遊戲?讀這篇文章就夠了

“随機題目編号”用于記錄抽取到的題目的清單,“全局-題目數量”表示的是需要抽取幾道題,“全局-抽取題目編号”表示的是目前随機到的題目編号。

接下來,看一下具體的實作邏輯。

想做個答題類的微信小遊戲?讀這篇文章就夠了

接着,我們來看一下如何将題目展現出來,并且能夠進行互動。

首先,來看一下界面和素材,這裡将所有的與題目相關的内容都放在一個容器中,包含了題目,選項以及一個倒計時。每當出現一道題目時,上方顯示問題,中間顯示 3 個選項,然後下方顯示剩餘倒計時。

想做個答題類的微信小遊戲?讀這篇文章就夠了

先來看一下标題的邏輯。

想做個答題類的微信小遊戲?讀這篇文章就夠了

題庫表格中的第 1 列對應的是題目。

想做個答題類的微信小遊戲?讀這篇文章就夠了

接着,來看一下如何建立選項。首先我們需要建立 2 個變量。

想做個答題類的微信小遊戲?讀這篇文章就夠了

一個局部變量“目前選項”,用于存儲目前選項在“題庫”表格中的列号,全局變量“全局-選項”則用于在克隆體建立時設定其“目前選項”。

看一下選項的建立邏輯。

想做個答題類的微信小遊戲?讀這篇文章就夠了

注意這裡的選項從 2 開始,因為在表格中 2 ,3 ,4 列對應的是題目的選項。

想做個答題類的微信小遊戲?讀這篇文章就夠了

接着看一下答題時的邏輯。

想做個答題類的微信小遊戲?讀這篇文章就夠了

這裡我們隻需要關注一個最核心的積木塊,當點選選項時,比較局部變量“目前選項”中儲存的列号,與正确答案的列号是否相同,相同的話則回答正确,不同的話則回答錯誤。

注意:題庫表格中第5列記錄的是“正确選項的列号”,這裡不要錯把第 5 列的資料當成了問題的答案。

想做個答題類的微信小遊戲?讀這篇文章就夠了

最後,再來看一下倒計時的實作。

想做個答題類的微信小遊戲?讀這篇文章就夠了

包含了3個素材,一個倒計時的數字,一個背景和一個進度。在這裡主要介紹一個“遮罩”插件的使用方法。

在行為中開啟遮罩插件。

想做個答題類的微信小遊戲?讀這篇文章就夠了

可以看到遮罩插件有很多的屬性,這裡我們使用“扇形”類型,用于實作一個圓圈的倒計時效果,利用遮罩插件可以實作遊戲中的諸如血條,冷卻等效果。

想做個答題類的微信小遊戲?讀這篇文章就夠了

看一下,倒計時效果的實作邏輯。

想做個答題類的微信小遊戲?讀這篇文章就夠了

通過設定扇形遮罩的角度,就可以實作一個不錯的圓圈倒計時效果了。

想做個答題類的微信小遊戲?讀這篇文章就夠了

最後,我們來看一下答題小程式的最終效果。

想做個答題類的微信小遊戲?讀這篇文章就夠了

開始後,顯示随機抽取的題目,在倒計時結束前選中正确的選項即可得分。

目前的所有的題目都是從題庫中随機抽取的,但是做多了難免會遇到相同的題目,而且選項順序也是相同的,這樣往往是掃一眼題目,就知道是哪個選項了,因為選項是固定不變的,那麼能不能實作,讓每道題目的選項也進行随機排列呢?

實作起來并不複雜,在我們目前的基礎上,隻需要在生成選項時,對選項的位置進行随機的排列即可。

想做個答題類的微信小遊戲?讀這篇文章就夠了

如圖,是目前的實作,我們按照選項的列号進行順序排列。選項的列号分别  2,3,4,我們是根據這 3 個列号計算的選項的位置,是以每道題的選項順序都是固定不變的。

如果想要實作選項的随機排列,那麼我們需要做的就是随機的對 2,3,4 這三個數字進行排列組合,然後根據随機的排列組合中的數字對選項的位置進行設定。

跟随機抽取題目的實作原理一樣,我們使用一個清單,來存儲随機的排列組合,然後根據清單中的資料對位置進行設定。

我們建立幾個新的變量。

想做個答題類的微信小遊戲?讀這篇文章就夠了

“随機選項順序”清單用于存儲随機的 2,3,4四個數字的随機組合,“全局-抽取順序”變量用于幫助建立清單,“全局-目前順序”用于設定選項的位置。

接着,看一下實作邏輯。

想做個答題類的微信小遊戲?讀這篇文章就夠了

紅線中圈出的部分為新增的邏輯,在建立選項前,我們先建立随機的選項順序清單,然後在建立選項克隆體的時候,根據“随機選項順序”清單中的資料對選項的位置進行設定。

這樣我們就實作了一個可以随機抽取題目,随機設定選項順序的答題小遊戲了。

總結一下,答題小程式的關鍵部分在于對表格的了解,設計好了表格,就相當于完成了最重要的資料部分。另外,借助清單我們可以實作各種随機的功能,包括随機從題庫中抽取不重複的題目,随機的排列題目的選項等等。

隻要原理了解了, 各種答題類的小程式就都可以制作了,對于背單詞類的小程式就更容易了,表格内容更加的簡單,隻需要兩列,一個單詞列,一個解釋列就可以了。