有哪些軟件或工具平臺比較好？

答題測試的H5作為不少商家活動的首選類型，需求自然就很大。學(xué)員們需要知道的是，答題測試按功能層面又分為根據(jù)趣味測試、問卷調(diào)查兩大類型。

趣味測試H5：根據(jù)得分獲得不同結(jié)果，用戶活動營銷問卷調(diào)查H5：統(tǒng)計答題人的選項/得分，用于數(shù)據(jù)收集

本期教程主要是向大家介紹一種簡單的【趣味測試H5】的教程。

我們使用的H5工具為 意派 Epub360

教程里用到的主要的組件是 圖片按鈕組件、測試題組件 和 參數(shù)變量組件。希望學(xué)員們通過本篇教程都能掌握這幾個組件使用方法并能獨立制作出來。

測試題組件作用：與圖片按鈕組合完成用戶選中時單選的狀態(tài)圖片按鈕組件作用：與測試題組件組合完成用戶選中時單選的狀態(tài)參數(shù)變量組件作用：統(tǒng)計用戶每題的得分并求和，可作不同得分顯示不同元素的觸發(fā)

在開始之前，老樣子，我們先預(yù)覽一下本期的教程的案例效果

（不能放二維碼，所以這里放一個GIF演示）

教程開始之前，我們先介紹一下使用的主要 測試題組件和它的能力：

喏，它長這樣，測試題組件可以添加多個圖片按鈕作為選項

可實現(xiàn)單選的效果，如多選可不綁定測試題組件可單獨設(shè)置每個選項的得分，也可以設(shè)置ABCD選項內(nèi)容，可配合數(shù)據(jù)庫收集用戶選擇的選項情況可設(shè)置正確答案選項可設(shè)置當(dāng)用戶選擇正確/錯誤選項觸發(fā)事件，比如播放正確的音效和圖片等可設(shè)置選擇結(jié)束時觸發(fā)事件，比如我們常用選擇結(jié)束時加分還是減分，或者跳轉(zhuǎn)到下一頁。

下面我們就開始教學(xué)吧，很詳細(xì)，相信您看完都能做出來。

1.第一頁是一個輸入用戶姓名的頁面，我們新建一個頁面，添加高級組件-高級表單里的“輸入框組件”，再添加一個全局變量和開始測試的圖片按鈕，將全局變量命名為“姓名變量”，調(diào)整類型為“文本”，圖片按鈕上設(shè)置點擊時“設(shè)置參數(shù)值”和“跳轉(zhuǎn)頁面”，設(shè)置參數(shù)值為全局變量=輸入框，跳轉(zhuǎn)頁面為下一頁，詳細(xì)面板見下；

注：第二頁是答題頁分為5個步驟講解（2-6步）

2.第二頁為答題頁，我們在左側(cè)頁面面板處右擊再新建一個空白頁面，需要添加圖片按鈕，我們選中按鈕的時候可以使用鍵盤上control+C+V的方式復(fù)制其余的三個按鈕，點選圖片按鈕右側(cè)面板上傳替換自己的選中和未選中的圖片；

3.圖片按鈕的初始狀態(tài)和激活狀態(tài)圖片替換好后，我們在工具欄上的高級組件-交互組件下面添加測試題組件，接著我們可以添加“題目圖片”和“確定按鈕圖片”到畫布上；

4.我們點選左側(cè)邏輯小面板的“測試題組件”，在右側(cè)面板添加四個圖片按鈕為選項并設(shè)置為每個選項設(shè)置分值（比如選項C是對的，我們給選項C為1，其余設(shè)置為0），接著設(shè)置其中一個為“正確答案”，觸發(fā)器上設(shè)置選擇結(jié)束后觸發(fā)“顯示元素”，這里顯示的是 下面那個“確定”圖片元素（它需要初始隱藏，第六步有說明）；

5.我們點擊左上角的頁面層級，切換到 Masterpge 里，在上方工具欄高級組件-邏輯組件里面找到“參數(shù)變量”，選擇添加到畫布上，給這個變量命名為“總分”，并設(shè)置為等待觸發(fā)，點擊小“+”號，添加三個觸發(fā)條件，我這里添加的是總分≤2，3≥總分≥4，總分≥5三個觸發(fā)條件；

6.我們點擊左上角的頁面層級，切換到 頁面 里，點選 “確定”圖片元素，右側(cè)面板勾選“初始隱藏”，觸發(fā)器上設(shè)置點擊“設(shè)置參數(shù)值”和“跳轉(zhuǎn)頁面”（注意順序，跳轉(zhuǎn)頁面一定要在最后一步執(zhí)行，上面的觸發(fā)事件才不會失效），設(shè)置參數(shù)值和跳轉(zhuǎn)頁面的詳細(xì)設(shè)置面板見下圖；

7.我們按照第二步到第六步的方法，接著制作剩下的四個頁面

8.新建一頁作為結(jié)果頁，我們把成績單圖片元素添加到畫布上，接著添加一個段落文本組件，命名為姓名。在這頁的頁面觸發(fā)器上設(shè)置切換到當(dāng)前頁時設(shè)置參數(shù)值和執(zhí)行參數(shù)判斷，把姓名的全局變量賦值給用來顯示姓名的段落文本，執(zhí)行參數(shù)判斷上執(zhí)行的是 Masterpage 上總分的判斷；

9.測試題案例大體上做好了，我們可以預(yù)覽下看看。

當(dāng)然，這里只是一種思路。有的項目不同得分不同結(jié)果的視覺上相差很大，這樣的話我們可以采用多個結(jié)果頁，比如總分參數(shù)≤2時跳轉(zhuǎn)結(jié)果1頁面，3≤總分參數(shù)≤4跳轉(zhuǎn)結(jié)果2頁面，總分參數(shù)≥5時跳轉(zhuǎn)跳轉(zhuǎn)結(jié)果3頁面這樣的邏輯方式實現(xiàn)，另外，執(zhí)行參數(shù)判斷的觸發(fā)也不應(yīng)該在結(jié)果頁觸發(fā)，而是應(yīng)該在上一頁的“確定按鈕”上去設(shè)置。

注意事項：

1.按鈕上點擊跳轉(zhuǎn)頁面觸發(fā)應(yīng)該設(shè)置在最后，因為跳轉(zhuǎn)頁面后面的觸發(fā)動作可能會失效；

2.如果結(jié)果需要顯示得分，可以把masterpage上總分參數(shù)賦值給一個段落文本來顯示；

3.輸入框為專業(yè)版功能，體驗版可用段落可編輯的方式替換；

好了，本期的測試題教程就到這里了，更多教程可以到 意派Epub360教程中心查看。