《軟件原型設(shè)計(jì)與應(yīng)用-基于Axure RP 8交互設(shè)計(jì)項(xiàng)目實(shí)踐》課件-CORE-04

學(xué)習(xí)目標(biāo)了解動(dòng)態(tài)面板的屬性、樣式熟悉動(dòng)態(tài)面板的創(chuàng)建掌握動(dòng)態(tài)面板的常用功能具有能夠熟練使用動(dòng)態(tài)面板的能力基本框架與界面效果動(dòng)態(tài)面板簡介動(dòng)態(tài)面板作為原型制作中最常用的組件之一，主要用來實(shí)現(xiàn)動(dòng)態(tài)的交互效果。一個(gè)動(dòng)態(tài)面板可以有多個(gè)狀態(tài)，可以設(shè)置狀態(tài)的增加、刪除、顯示及隱藏。一個(gè)動(dòng)態(tài)面板就相當(dāng)于一組狀態(tài)的集合。動(dòng)態(tài)面板簡介動(dòng)態(tài)面板的創(chuàng)建動(dòng)態(tài)面板的創(chuàng)建有兩種方式。具體創(chuàng)建方式依照設(shè)計(jì)情況進(jìn)行選擇。第一種：選中“動(dòng)態(tài)面板”元件，拖動(dòng)到畫布中，創(chuàng)建空白的動(dòng)態(tài)面板。動(dòng)態(tài)面板簡介動(dòng)態(tài)面板的創(chuàng)建第二種：選中畫布中任意一個(gè)元件，點(diǎn)擊右鍵，選擇“轉(zhuǎn)換為動(dòng)態(tài)面板”，生成有內(nèi)容的動(dòng)態(tài)面板。動(dòng)態(tài)面板簡介動(dòng)態(tài)面板的事件拖動(dòng)時(shí)：是指因面板的點(diǎn)擊、拖拽、釋放所觸發(fā)的事件狀態(tài)改變時(shí)：是指因觸發(fā)面板狀態(tài)而產(chǎn)生的一系列交互的事件載入時(shí)：是指在頁面初始加載動(dòng)態(tài)面板時(shí)觸發(fā)的事件滾動(dòng)時(shí)：是指因動(dòng)態(tài)面板滾動(dòng)欄滾動(dòng)所觸發(fā)的事件調(diào)整尺寸時(shí)：是指因面板大小的改變而觸發(fā)的事件動(dòng)態(tài)面板的樣式及屬性動(dòng)態(tài)面板的樣式在“檢視”面板下的“樣式”界面，可設(shè)置動(dòng)態(tài)面板的“位置/尺寸”，“背景顏色”以及“背景圖片”等樣式。動(dòng)態(tài)面板的樣式及屬性動(dòng)態(tài)面板的屬性（1）自動(dòng)調(diào)整為內(nèi)容尺寸“自動(dòng)調(diào)整為內(nèi)容尺寸”屬性是根據(jù)元件內(nèi)容的尺寸，調(diào)整動(dòng)態(tài)面板的大小，不需要添加滾動(dòng)欄也可以完整的顯示動(dòng)態(tài)面板中的內(nèi)容。（2）滾動(dòng)條滾動(dòng)條，即在不改變動(dòng)態(tài)面板大小的情況下，能夠通過上下滾動(dòng)查看動(dòng)態(tài)面板中的內(nèi)容。（3）固定到瀏覽器固定到瀏覽器，可以將頁面中的某一部分固定到瀏覽器中，不會(huì)隨頁面滑動(dòng)而移動(dòng)。動(dòng)態(tài)面板的使用顯示與隱藏在原型測試過程中，往往會(huì)因?yàn)槟承┎徽_操作，彈出一些提示性文字等。比如：用戶進(jìn)行登錄時(shí)，在不填寫用戶名的情況下點(diǎn)擊登錄按鈕，便會(huì)彈出“用戶名不能為空”的提示標(biāo)簽?；虍?dāng)用戶輸入錯(cuò)誤驗(yàn)證碼時(shí)，便彈出“驗(yàn)證碼錯(cuò)誤”的提示標(biāo)簽。動(dòng)態(tài)面板的使用水平拖動(dòng)在Axure中，“動(dòng)態(tài)面板”是唯一可以使用拖動(dòng)效果的元件，主要用于APP的產(chǎn)品原型設(shè)計(jì)，結(jié)合系統(tǒng)自帶變量來實(shí)現(xiàn)面板被拖動(dòng)時(shí)產(chǎn)生的一些效果。比如：手機(jī)的滑動(dòng)解鎖功能、手機(jī)頁面的縱向?yàn)g覽功能、調(diào)節(jié)音量大小功能等。動(dòng)態(tài)面板的使用滾動(dòng)效果動(dòng)態(tài)面板的滾動(dòng)效果是通過其他交互事件來激發(fā)的，可能是點(diǎn)擊某個(gè)按鈕，也可能是頁面加載時(shí)實(shí)現(xiàn)。比如：網(wǎng)站上的一些滾動(dòng)文字的效果、點(diǎn)擊登錄按鈕，登錄面板的彈出收起效果等。動(dòng)態(tài)面板的使用多狀態(tài)效果多狀態(tài)管理是原型設(shè)計(jì)師常用的一種元件屬性，被普遍應(yīng)用于原型設(shè)計(jì)中。一個(gè)動(dòng)態(tài)面板可以通過添加或復(fù)制創(chuàng)建多個(gè)面板狀態(tài)，多個(gè)面板狀態(tài)可用于實(shí)現(xiàn)圖片輪播、圖形轉(zhuǎn)動(dòng)、滑進(jìn)滑出等效果，且在增強(qiáng)動(dòng)態(tài)效果的同時(shí)，也減少了動(dòng)態(tài)面板的數(shù)量。任務(wù)總結(jié)本任務(wù)使用動(dòng)態(tài)面板、熱區(qū)以及觸發(fā)事件等知識(shí)，實(shí)現(xiàn)了“滑動(dòng)解鎖”原型