“手術刀”測試題H5制作

測試題類型H5建造受到良多企業的偏心，長久不衰，屢試不爽，出格是每年節日時代，測試新一年的命運，星座，性格等等隨機出成果的H5刷爆伴侶圈，個個pv過百萬，下面來介紹下這類型的H5是若何做出來的：

東西/原料

mugeda

方式/步調

1
起首，登岸木疙瘩平臺，建立新作品
2
點擊“素材庫”添加素材，并調整素材巨細、位置等屬性，如下圖：
3
新建第2頁面，在“素材庫”添加一個手術刀圖像元素，點擊“線條”東西在“舞臺”上繪制一個線條，并點竄其線條類型為“點線”
4
繼續彌補繪制線條、添加“殺人”“完美”“合格”文本框，再添加一個文本框，定名為“分數”，輸入內容為“0”，并調整巨細、字體顏色等屬性
5
新建“圖層1”，將“圖層0”上的手術刀剪切粘貼進“圖層1”上，改變手術刀“Z軸扭轉角度”為“-90”，調整其巨細位置
6
新建“圖層2”，在該圖層添加一個手指點擊的圖片素材，同時添加一個文本框，輸入文字內容為“按住屏幕，起頭手術”，調整字體巨細、顏色等屬性
7
為便利辨識，我們可點竄“圖層0”名稱為“底部”，“圖層1”名稱為“手術刀”，“圖層2”名稱為“提醒”
8
選中“手術刀”以及“底部”兩個圖層的第30幀位置，右鍵→“插入幀”
9
將“手術刀”圖層的第1關頭幀拖動至第2幀，同時設置手術刀從下往上移動的動畫
10
新建“圖層3”，在該圖層第2幀“插入關頭幀”，將虛線復制粘貼進關頭幀內，點竄線條顏色為紅色，線條類型為“實線”
11
在“圖層3”關頭幀之后“插入曲線變形動畫”，利用“節點”東西將第2幀上的曲線縮短至底端，做一個線條由短標的目的上變長的動畫，可點擊“預覽”不雅察結果
12
別離在“手術刀”和“圖層3”的第19幀（手術刀對齊“合格”文字框的時候點）、27幀（手術刀對齊“完美”文字框的時候點）插入關頭幀
13
為手術刀素材定名為“刀子”
14
提前不雅察手術刀在最底端、“合格”“完美”“殺人”文字框位置時，其“上”值是幾多（此處別離為“467.6”“184.9”“51.9”“2”）
15
如下圖，選中“分數”文本框，在其“屬性”面板下點擊文字內容右邊的“聯系關系”按鈕，鄙人拉的聯系關系屬性菜單欄下設置聯系關系對象：“刀子”聯系關系屬性：“上”聯系關系體例：“主動聯系關系”當本家兒控量=“467.6”（手術刀在最底端位置）時被控量=“0”當本家兒控量=“184.9”（手術刀在“合格”位置）時被控量=“60”當本家兒控量=“51.9”（手術刀在“完美”位置）時被控量=“100”當本家兒控量=“2”（手術刀在“殺人”位置）時被控量=“0”
16
為手指點擊圖像添加一個呈現即暫停行為：“動畫播放節制”→“暫停”→觸發前提：“呈現”
17
新建圖層“節制層”，并將“圖層3”重定名為“紅線”
18
在“節制層”圖層添加一個矩形，調整巨細使其合適“舞臺”巨細，并調整其透明度為“0”
19
為矩形添加兩個編纂行為：“動畫播放節制”→“播放”→觸發前提：“手指按下”“動畫播放節制”→“下一頁”→觸發前提：“手指抬起”
20
可新建第3頁面，添加一張圖片素材作為跳轉后的頁面，之后點擊“預覽”不雅察動畫結果
21
建造第3頁：如下圖，在第3頁添加一個文本框，輸入文字內容為“0”，調整文字巨細、顏色、位置等。點擊文字內容右邊的“聯系關系”按鈕，設置聯系關系屬性聯系關系對象：“分數”聯系關系屬性：“文本取值”聯系關系體例：“公式聯系關系”被控量=“聯系關系屬性”即設置了該文本的取值等于第2頁“分數”文本取值
22
將“舞臺”上的圖片元轉換為元件，雙擊該元件進入元件編纂頁面。在時候軸上第4幀“插入幀”
23
為圖片元件設置“編纂行為”：“動畫播放節制”→“暫停”→觸發前提：“呈現”
24
同時在時候軸上的2、3、4幀“插入關頭幀”
25
別離在第2、3、4幀上點擊“屬性”面板下的“編纂”按鈕，在彈出的“媒體庫”中選擇所需的圖片素材，點擊“添加”，替代原有的圖片
26
回到“舞臺”，將元件定名為“評判”
27
在第2頁面，為“節制層”上矩形添加四個“跳轉到幀并遏制”行為：“動畫播放節制”→“跳轉到幀并遏制”→“觸發前提”：“手指抬起”，點竄描述為“100分”“80”“60”“死”
28
設置“100分”行為的“參數”幀號：“3”感化對象：“評判”執行前提：“查抄元素狀況”元素名稱：“分數”考查屬性：“文本取值”邏輯前提：“小于等于”參考值：“100”，點擊“確認”
29
設置“80”行為的“參數”幀號：“2”感化對象：“評判”執行前提：“查抄元素狀況”元素名稱：“分數”考查屬性：“文本取值”邏輯前提：“小于等于”參考值：“80”，點擊“確認”
30
設置“60”行為的“參數”幀號：“1”感化對象：“評判”執行前提：“查抄元素狀況”元素名稱：“分數”考查屬性：“文本取值”邏輯前提：“小于等于”參考值：“60”，點擊“確認”
31
設置“死”行為的“參數”幀號：“4”感化對象：“評判”執行前提：“查抄元素狀況”元素名稱：“刀子”考查屬性：“上”邏輯前提：“小于等于”參考值：“51”（手術刀在“完美”擺布位置），點擊“確認”
32
注重：Mugeda的行為邏輯是從上往下的挨次執行的，我們起首會執行“播放”的行為，然后是“跳轉下一頁”的行為，其次是100分的“跳轉到幀并遏制”行為，同理依次執行其他行為。若中心有一個行為前提不知足，則不會繼續執行下一行為。
33
建造“再來一次”按鈕：在第3頁面添加“再來一次”按鈕素材
34
添加“再來一次”按鈕編纂行為：“動畫播放節制”→“跳轉到頁”→觸發前提：“點擊”，跳轉幀號為“1”“屬性節制”→“改變元素屬性”→觸發前提：“點擊”，設置“參數”元素名稱：“分數”元素屬性：“文本取值”賦值體例：“用設置的值替代現有值”取值：“0”點擊“確認”即設置重來一次時將原先的分數值清零行為
35
設置第1頁“起頭游戲”按鈕編纂行為“跳轉下一頁”行為：“動畫播放節制”→“下一頁”→觸發前提：“點擊”“禁止翻頁”行為：“動畫播放節制”→“禁止翻頁”→觸發前提：“呈現”
36
可點擊“預覽”動畫結果