《H5設(shè)計(jì)與運(yùn)營(yíng)》第八章H5制作工具-2課件

1、8.2.3 使用高級(jí)組件“快閃”組件8.2.3 使用高級(jí)組件“快閃”組件8.2.3 使用高級(jí)組件“點(diǎn)擊截圖”組件在左圖所示的H5場(chǎng)景中，中間為滾動(dòng)變換的文字圖片，點(diǎn)擊“確認(rèn)運(yùn)勢(shì)”按鈕，即可進(jìn)行截圖，效果如右圖所示。在組件列表中單擊“點(diǎn)擊截圖”按鈕 ，即可插入該組件，可以更改該組件的名稱或風(fēng)格，還可以自定義圖片。在H5場(chǎng)景中插入“點(diǎn)擊截圖”組件后，在手機(jī)微信環(huán)境下預(yù)覽H5頁(yè)面，點(diǎn)擊“點(diǎn)擊截圖”按鈕，可以對(duì)當(dāng)前頁(yè)面內(nèi)容進(jìn)行截圖，然后用手指長(zhǎng)按截圖，在彈出的菜單中設(shè)置將圖片保存到手機(jī)相冊(cè)。8.2.3 使用高級(jí)組件“點(diǎn)擊截圖”組件在左圖所示的H5場(chǎng)8.2.3 使用高級(jí)組件“畫(huà)板”組件8.2.3 使用高

2、級(jí)組件“畫(huà)板”組件8.2.3 使用高級(jí)組件“投票”組件8.2.3 使用高級(jí)組件“投票”組件8.2.3 使用高級(jí)組件“隨機(jī)事件”組件8.2.3 使用高級(jí)組件“隨機(jī)事件”組件8.2.3 使用高級(jí)組件“動(dòng)態(tài)數(shù)字”組件使用“動(dòng)態(tài)數(shù)字”組件可以生成一組數(shù)字的動(dòng)態(tài)變化。在組件列表中單擊“動(dòng)態(tài)數(shù)字”按鈕 ，在“組件設(shè)置”面板中選擇類(lèi)型，設(shè)置動(dòng)畫(huà)時(shí)長(zhǎng)和數(shù)值區(qū)間等參數(shù)。使用“動(dòng)態(tài)數(shù)字”組件還可以生成隨機(jī)數(shù)，按照前面介紹的方法為組件添加觸發(fā)條件，并開(kāi)啟“隨機(jī)停止”功能即可。8.2.3 使用高級(jí)組件“動(dòng)態(tài)數(shù)字”組件使用“動(dòng)態(tài)數(shù)字”組8.2.4 使用微信組件“頭像”組件8.2.4 使用微信組件“頭像”組件8.2.4

3、使用微信組件“聲音”組件8.2.4 使用微信組件“聲音”組件8.2.4 使用微信組件“照片”組件8.2.4 使用微信組件“照片”組件8.2.4 使用微信組件“照片墻”組件在組件列表中單擊“照片墻”按鈕 ，即可在頁(yè)面中添加“照片墻”組件。用戶可以在“組件設(shè)置”面板中設(shè)置頭像行數(shù)、頭像邊框、背景顏色等，如下圖所示。在微信上預(yù)覽場(chǎng)景時(shí)，將展示最近瀏覽者的微信頭像，默認(rèn)顯示3行頭像，每行8個(gè)頭像，最多展示24位最近的瀏覽者。8.2.4 使用微信組件“照片墻”組件在組件列表中單擊“照8.2.5 使用AI組件“自說(shuō)字畫(huà)”組件8.2.5 使用AI組件“自說(shuō)字畫(huà)”組件8.2.5 使用AI組件“立體魔方”組件8

4、.2.5 使用AI組件“立體魔方”組件目錄CONTENTH5基本編輯8.1使用易企秀H5編輯器組件8.2使用易企秀H5編輯器表單8.3目錄CONTENTH5基本編輯8.1使用易企秀H5編輯器組件表單能夠幫助企業(yè)或商家獲得用戶的聯(lián)系方式并收集用戶的信息，在制作企業(yè)招聘、活動(dòng)邀請(qǐng)等H5場(chǎng)景時(shí)都會(huì)用到表單。將鼠標(biāo)指針置于組件欄中的“組件”按鈕上，將顯示表單組件列表，如下圖所示。需要注意的是，使用表單組件時(shí)，需要添加“提交”按鈕，這樣才可以將數(shù)據(jù)提交到后臺(tái)。表單能夠幫助企業(yè)或商家獲得用戶的聯(lián)系方式并收集用戶的信息，在8.3.1 使用常用表單組件“聯(lián)系人”和“輸入框”表單組件8.3.1 使用常用表單組件

5、“聯(lián)系人”和“輸入框”表單組件8.3.1 使用常用表單組件“提交按鈕”表單組件8.3.1 使用常用表單組件“提交按鈕”表單組件8.3.1 使用常用表單組件“短信驗(yàn)證”表單組件短信驗(yàn)證功能用于驗(yàn)證輸入的手機(jī)號(hào)是否真實(shí)有效，該功能是需要付費(fèi)的，可以在易企秀中點(diǎn)擊購(gòu)買(mǎi)。當(dāng)短信條數(shù)不足時(shí)，短信驗(yàn)證碼將發(fā)送失敗。在“表單”列表中單擊“短信驗(yàn)證”按鈕 ，即可插入“短信驗(yàn)證”組件，在“組件設(shè)置”面板中可以設(shè)置輸入框顏色、文字顏色等樣式，如下圖所示。8.3.1 使用常用表單組件“短信驗(yàn)證”表單組件短信驗(yàn)證功8.3.1 使用常用表單組件“留言板”表單組件8.3.1 使用常用表單組件“留言板”表單組件8.3.2

6、使用基礎(chǔ)表單組件“單選”表單組件單選按鈕用于在一系列選項(xiàng)中選擇唯一的項(xiàng)目。在“表單”列表中單擊“單選”按鈕 ，即可在頁(yè)面中插入“單選”表單組件。在“組件設(shè)置”面板中單擊 或 按鈕添加或刪除選項(xiàng)。若要隱藏標(biāo)題，可以設(shè)置主題顏色和標(biāo)題顏色透明。在“功能設(shè)置”選項(xiàng)下打開(kāi)“設(shè)為必填”功能，可以將該組件設(shè)置為必填項(xiàng)，若用戶在填寫(xiě)表單時(shí)沒(méi)有選擇該選項(xiàng)，表單將無(wú)法提交，如下圖所示。8.3.2 使用基礎(chǔ)表單組件“單選”表單組件單選按鈕用于在8.3.2 使用基礎(chǔ)表單組件“多選”表單組件多選按鈕用于在一系列選項(xiàng)中選擇多個(gè)項(xiàng)目。在“表單”列表中單擊“多選”按鈕 ，即可在頁(yè)面中插入“多選”表單組件。在“組件設(shè)置”面板

7、中選擇“單選”或“多選”模式，可以迅速切換單選或多選類(lèi)型，如下圖所示。8.3.2 使用基礎(chǔ)表單組件“多選”表單組件多選按鈕用于在8.3.2 使用基礎(chǔ)表單組件“下拉列表”表單組件8.3.2 使用基礎(chǔ)表單組件“下拉列表”表單組件8.3.2 使用基礎(chǔ)表單組件“評(píng)分”表單組件在“表單”列表中單擊“評(píng)分”按鈕 ，即可在頁(yè)面中添加“評(píng)分”組件，對(duì)H5場(chǎng)景內(nèi)容進(jìn)行打分。在“組件設(shè)置”面板中可以設(shè)置評(píng)分標(biāo)題、按鈕圖標(biāo)、圖標(biāo)顏色等，如下圖所示。完成評(píng)分并提交后，在后臺(tái)可以看到評(píng)分?jǐn)?shù)據(jù)。8.3.2 使用基礎(chǔ)表單組件“評(píng)分”表單組件在“表單”列表8.3.2 使用基礎(chǔ)表單組件“上傳附件”表單組件“上傳附件”表單組件用

8、于收集圖片，在填寫(xiě)表單時(shí)，可以點(diǎn)擊連接到手機(jī)相冊(cè)，上傳手機(jī)相冊(cè)中的圖片。上傳圖片后，需要點(diǎn)擊“提交”按鈕，才能將收集的圖片上傳提交到后臺(tái)。在“表單”列表中單擊“上傳附件”按鈕 ，在“組件設(shè)置”面板中設(shè)置標(biāo)題、背景顏色、邊框等，如下圖所示。若要上傳Word、Excel、PDF等類(lèi)型的文件，可以在易企秀易表單中進(jìn)行操作。8.3.2 使用基礎(chǔ)表單組件“上傳附件”表單組件“上傳附件8.3.3 使用高級(jí)表單組件在易企秀H5編輯器中，可以使用高級(jí)表單組件插入簡(jiǎn)單的數(shù)據(jù)圖表，包括餅狀圖、柱狀圖、折線圖和曲面圖。在“表單”列表中單擊“餅狀圖”按鈕 ，然后在“組件設(shè)置”面板中設(shè)置標(biāo)題、圖例、標(biāo)識(shí)顏色等，如下圖（左）所示，單擊“編輯表單數(shù)據(jù)”按鈕可以更改數(shù)據(jù)和圖例顏色。采用同樣的方法，插入“柱狀圖”組件，或者在“圖表類(lèi)型”下拉列表中更改圖表類(lèi)型，如下圖（右）所示。8.3.3 使用高級(jí)表單組件在易企秀H5編輯器中，可以使用課后習(xí)題1在易企秀H5編輯器中，使用矩形形