08第三章2網(wǎng)頁(yè)交互原型工具Axure的應(yīng)用規(guī)范_第1頁(yè)
08第三章2網(wǎng)頁(yè)交互原型工具Axure的應(yīng)用規(guī)范_第2頁(yè)
08第三章2網(wǎng)頁(yè)交互原型工具Axure的應(yīng)用規(guī)范_第3頁(yè)
08第三章2網(wǎng)頁(yè)交互原型工具Axure的應(yīng)用規(guī)范_第4頁(yè)
08第三章2網(wǎng)頁(yè)交互原型工具Axure的應(yīng)用規(guī)范_第5頁(yè)
已閱讀5頁(yè),還剩102頁(yè)未讀 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

網(wǎng)頁(yè)交互原型工具Axure的應(yīng)用規(guī)范電子信息職業(yè)技術(shù)學(xué)院知識(shí)要點(diǎn)05Axure元件——表帶|表格|標(biāo)記元件01Axure軟件界面介紹02Axure使用規(guī)范的介紹04Axure元件——基本元件03Axure元件的交互1.Axure基礎(chǔ):Axure軟件界面介紹第一部分1界面介紹1、菜單欄2、工作區(qū)域3、頁(yè)面欄4、概要視圖5、元件庫(kù)6、母版7、樣式窗格8、交互9、注釋菜單欄介紹復(fù)制、剪切及粘貼區(qū)域CtrlX為剪切CtrlC為復(fù)制CtrlV為粘貼選擇模式第一個(gè)相交選中第二個(gè)包含選中第三個(gè)連接在Axure中,可以選中一段交互進(jìn)行復(fù)制粘貼,值得注意的是,選擇某個(gè)元件,按下復(fù)制按鈕或快捷鍵,然后選中另一個(gè)元件按下CtrlAltV即可將前一個(gè)元件的格式及公共交互部分復(fù)制并粘貼到后一個(gè)元件上插入按鈕:繪畫(huà)矩形圓形線段文本圖片其他形狀拖動(dòng)方塊可以任意改變?cè)男螤畈藛螜诮榻B將選中的元件置于最下層或最上層選中多個(gè)元件點(diǎn)擊組合將元件打組實(shí)現(xiàn)放大和縮小屏快捷鍵按住Ctrl鍵,滑動(dòng)鼠標(biāo)滾輪8種對(duì)齊方式,左對(duì)齊居中對(duì)齊右對(duì)齊頂部對(duì)齊居中底部對(duì)齊橫向均與分布垂直均勻分布預(yù)覽和共享預(yù)覽就是預(yù)覽原型預(yù)覽和共享12缺點(diǎn)是不可展示動(dòng)態(tài)交互

使用axure直接預(yù)覽

文件->導(dǎo)出所有頁(yè)面為圖片使用Chrome瀏覽器預(yù)覽時(shí)添加插件預(yù)覽和共享34發(fā)布到Axure_shared上,生成鏈接

生成原型頁(yè)面到本地文件夾自定義界面自定義界面黑夜模式01Axure元件庫(kù)DefaultFlowIconsAxure自帶基礎(chǔ)元件庫(kù)庫(kù)的切換在元件庫(kù)的下拉菜單中可以看到所有的元件庫(kù),也可以查看加載好的本地圖片文件夾(需要導(dǎo)入圖片文件夾)。也可以通過(guò)AxureCloud來(lái)加載/切換庫(kù)。Axure元件庫(kù)庫(kù)的添加查看元件庫(kù)存儲(chǔ)位置以及刪除庫(kù)的刪除:在下拉菜單中選擇好該元件庫(kù)后,直接單擊選項(xiàng)Option按鈕(在右上角)然后選擇RemoveLibrary移除元件庫(kù)按鈕(圖片見(jiàn)上圖)Axure元件庫(kù)創(chuàng)建自己的元件庫(kù)Axure元件庫(kù)元件庫(kù)中元件的圖標(biāo)與提示Axure使用規(guī)范的介紹第二部分元件的使用031元件添加直接單擊選擇某一個(gè)元件將其拖至畫(huà)布(中間區(qū)域)中,也可以通過(guò)左上角的插入菜單選擇其他形狀的部件。元件的使用元件的移動(dòng)操作元件的移動(dòng):拖住元件并在畫(huà)布上松開(kāi)鼠標(biāo)即可;也可以直接在X和Y中直接輸入坐標(biāo)。元件的使用同時(shí)定位多個(gè)元件進(jìn)行操作按住CTRL使用鼠標(biāo)單擊每個(gè)元件可同時(shí)選中多個(gè)元件,可以看到坐標(biāo)X

或者Y(W

H、即寬和高)不盡相同。提示:X,Y,W,H

這些參數(shù)中只有當(dāng)多個(gè)元件的這些值相同時(shí)才會(huì)展示,否則在選中時(shí)不會(huì)展示。元件的使用元件的其他操作旋轉(zhuǎn)。元件的命名元件的組合元件的鎖定與隱藏元件的樣式

不透明度排版元件的樣式

填充邊框元件的樣式

陰影、圓角、邊距元件的樣式

元件樣式及樣式管理器元件的樣式

更新和創(chuàng)建樣式快速更新快速創(chuàng)建元件的組合元件的組合與取消元件的組合組合的交互元件選中狀態(tài)頁(yè)面及其樣式1.添加頁(yè)面:直接在左側(cè)頁(yè)面樣式欄中的右上角點(diǎn)擊添加按鈕,此時(shí)即可以添加一個(gè)空白的頁(yè)面,你也可以在某一個(gè)頁(yè)面上右擊,然后添加頁(yè)面或子頁(yè)面。2.頁(yè)面的刪除:直接右鍵單擊該頁(yè)面,選擇刪除,或者選中某一個(gè)頁(yè)面,然后直接按DELETE鍵。3.頁(yè)面的重命名:與WINDOWS電腦文件的重命名一樣,可以右鍵單擊,選擇重命名

或者緩慢單擊該文件名。頁(yè)面及其樣式頁(yè)面的樣式頁(yè)面的尺寸自適應(yīng)視圖自適應(yīng)視圖視圖的顏色通常有這幾種:1.藍(lán)綠色:當(dāng)前在畫(huà)布上顯示的視圖。修改將適用于本視圖2.黃色:當(dāng)前顯示視圖的子視圖。在當(dāng)前修改將會(huì)影響此視圖3.灰色:當(dāng)前顯示視圖的父視圖。在當(dāng)前修改不會(huì)影響此視圖4.綠色:當(dāng)前修改會(huì)影響所有視圖母版的創(chuàng)建母版的使用情形導(dǎo)航欄網(wǎng)站頂部header(包括LOGO)一些常用的按鈕或組合,比如分享至第三方平臺(tái)的按鈕Tab的切換(APP中居多)在原型設(shè)計(jì)中,部件元件或元件的組合會(huì)重復(fù)使用,這些元件的組合就可被用來(lái)創(chuàng)建母版。)母版的創(chuàng)建方法一:選中多個(gè)元件后,右鍵單擊,選擇轉(zhuǎn)換為母版方法二:從母版欄目中創(chuàng)建母版的使用母版的頁(yè)面屬性母版的頁(yè)面交互將會(huì)在母版所處的任何一個(gè)實(shí)例頁(yè)面被觸發(fā)(前提是達(dá)到觸發(fā)事件),比如你創(chuàng)建一個(gè)頁(yè)面載入時(shí)的事件,那么當(dāng)一個(gè)頁(yè)面包含該母版時(shí),就會(huì)觸發(fā)此事件。母版的添加任意位置:此為默認(rèn)情況,可將母版放至任意坐標(biāo)上。母版實(shí)例的位置鎖定到母版中的位置:此實(shí)例的位置與原母版中的位置相同。方法1:直接從母版窗格中拖至畫(huà)布中。同時(shí)該母版將會(huì)出現(xiàn)紅色遮罩(可在視圖–>遮罩中切換)方法2:在需要的母版上右鍵選擇添加母版到頁(yè)面中母版的添加母版的添加脫離母版母版使用情況母版的引發(fā)事件母版視圖視圖的繼承母版視圖的編輯窗口藍(lán)綠色:當(dāng)前編輯對(duì)其適用;黃色:當(dāng)下顯示的是子視圖,編輯對(duì)其適用;灰色:當(dāng)下顯示的是父視圖,編輯對(duì)其不適用;綠色:影響所有視圖被選中,編輯對(duì)所有視圖適用。連接器菜單的邊距填充連接器連接器(線)的形態(tài)改變形態(tài)添加文本形狀形狀的創(chuàng)建方法一:從左側(cè)庫(kù)中拖入畫(huà)布中;方法二:插入菜單,通過(guò)一些快捷鍵我們可以快速插入常用的圖形元件,各矢量圖形的快捷鍵如下:P鍵鋼筆工具R鍵矩形0鍵圓形L鍵線段T鍵文本鋼筆(繪畫(huà))工具AXURE中的鋼筆工具可以縱向矢量圖形形狀形狀的變換水平翻轉(zhuǎn)垂直翻轉(zhuǎn)合并去除相交排除結(jié)合分開(kāi)形狀形狀的轉(zhuǎn)換圖片引用頁(yè)面Axure元件的交互第三部分Axure的交互一個(gè)交互由3部分構(gòu)成:1.元件或頁(yè)面的事件;2.在此事件上的情形;3.針對(duì)該情形的動(dòng)作。4.事件是通過(guò)不同的情形和動(dòng)作來(lái)對(duì)外界輸入作出的一種反映。所以,事件包含一個(gè)或多個(gè)情形,而情形中又可包含多個(gè)動(dòng)作不同的情形通過(guò)判斷各自的條件來(lái)進(jìn)行將要做什么,也就是說(shuō),不同的情形是不會(huì)同時(shí)發(fā)生的。交互的構(gòu)成就相當(dāng)于寫(xiě)if()語(yǔ)句時(shí),if(條件1){

執(zhí)行case1中actions;}

if(條件2){

執(zhí)行case2中actions;}用集合的概念來(lái)描述上面三者的關(guān)系:事件>情形>動(dòng)作。因此事件可以理解為Function,情形理解為條件1,2,3,而動(dòng)作則理解為Actions。事件-情形-動(dòng)作查看一個(gè)元件或頁(yè)面的事件:?jiǎn)螕粼蝽?yè)面,在右側(cè)交互欄目中可查看;事件的刪除:選中某一個(gè)事件后,按Delete即可。事件情形情形主要是指附著在事件上的用例,一個(gè)事件可以有多個(gè)情形,當(dāng)鼠標(biāo)懸浮在事件上時(shí),可以看到右側(cè)的添加情形按鈕,可以設(shè)置觸發(fā)條件來(lái)設(shè)置情形的啟動(dòng)。情形的刪除:選中某一個(gè)情形后,直接按Delete即可。動(dòng)作動(dòng)作是在某一情形下的操作。動(dòng)作的添加:直接在情形的右側(cè)添加目標(biāo)按鈕,亦可單擊情形下方的+按鈕。同理,可用鼠標(biāo)來(lái)拖動(dòng)動(dòng)作的順序。頁(yè)面和母版的事件頁(yè)面載入時(shí):Web瀏覽器中加載頁(yè)面時(shí)頁(yè)面單擊時(shí):?jiǎn)螕繇?yè)面背景時(shí)頁(yè)面雙擊時(shí):雙擊頁(yè)面背景時(shí)頁(yè)面鼠標(biāo)右擊時(shí):右鍵單擊頁(yè)面的背景頁(yè)面鼠標(biāo)移動(dòng)時(shí):當(dāng)光標(biāo)在頁(yè)面上移動(dòng)時(shí)連續(xù)觸發(fā)頁(yè)面按鍵按下時(shí):按下鍵盤(pán)鍵時(shí)頁(yè)面按鈕松開(kāi)時(shí):釋放鍵盤(pán)鍵時(shí)窗口尺寸改變時(shí):調(diào)整瀏覽器窗口大小時(shí)頁(yè)面載入時(shí):Web瀏覽器中加載頁(yè)面時(shí)自適應(yīng)視圖改變時(shí):當(dāng)前自適應(yīng)視圖由于瀏覽器窗口大小調(diào)整而改變,或者通過(guò)設(shè)置自適應(yīng)視圖操作或原型播放器中的自適應(yīng)視圖下拉列表來(lái)設(shè)置視圖窗口滾動(dòng)時(shí):當(dāng)瀏覽器窗口向任何方向滾動(dòng)時(shí)窗口向上滾動(dòng)時(shí):當(dāng)瀏覽器窗口向上滾動(dòng)時(shí)窗口向下滾動(dòng)時(shí):當(dāng)瀏覽器窗口向下滾動(dòng)時(shí)所有元件適用的事件單擊時(shí):當(dāng)元件被點(diǎn)擊時(shí)。雙擊時(shí):元件被鼠標(biāo)雙擊時(shí)。右擊時(shí):當(dāng)元件被鼠標(biāo)右鍵單擊時(shí)。按下時(shí):當(dāng)鼠標(biāo)按下左鍵沒(méi)有被釋放時(shí)。松開(kāi)時(shí):當(dāng)元件被鼠標(biāo)點(diǎn)擊,這個(gè)事件由鼠標(biāo)按鍵釋放觸發(fā)。鼠標(biāo)移動(dòng)時(shí):當(dāng)光標(biāo)在一個(gè)元件上移動(dòng)時(shí)。鼠標(biāo)移入時(shí):當(dāng)光標(biāo)移入元件范圍時(shí)。鼠標(biāo)移出時(shí):當(dāng)光標(biāo)移出元件范圍時(shí)。鼠標(biāo)停放時(shí):當(dāng)光標(biāo)在元件上方懸停時(shí)。鼠標(biāo)長(zhǎng)按時(shí):當(dāng)鼠標(biāo)按下超過(guò)2秒沒(méi)有被釋放時(shí)。移動(dòng)時(shí):當(dāng)元件移動(dòng)時(shí),在頁(yè)面中的坐標(biāo)位發(fā)生了變化。按鍵按下時(shí):鍵盤(pán)上的按鍵被按下時(shí)。按鍵松開(kāi)時(shí):當(dāng)鍵盤(pán)上的按鍵彈起時(shí)。旋轉(zhuǎn)時(shí):當(dāng)元件旋轉(zhuǎn)時(shí)。尺寸改變時(shí):當(dāng)元件寬度或高度發(fā)生改變時(shí)。顯示時(shí):當(dāng)元件通過(guò)交互動(dòng)作顯示時(shí)。隱藏時(shí):當(dāng)元件通過(guò)交互動(dòng)作隱藏時(shí)。獲取焦點(diǎn)時(shí):當(dāng)一個(gè)輸入項(xiàng)獲取焦點(diǎn)時(shí)。失去焦點(diǎn)時(shí):當(dāng)一個(gè)輸入項(xiàng)失去焦點(diǎn)時(shí)。選中時(shí):當(dāng)復(fù)選框或單選按鈕被選中時(shí)。取消選中時(shí):當(dāng)復(fù)選框或單選按鈕取消選中時(shí)。選中改變時(shí):適用于下拉框,當(dāng)下拉框被選中的項(xiàng)發(fā)生了改變時(shí),通常作為事件的一個(gè)邏輯條件。載入時(shí):當(dāng)元件從一個(gè)頁(yè)面的加載中載入時(shí)。其他元件特有的事件選項(xiàng)改變時(shí):當(dāng)下拉列表或列表框中的選定選項(xiàng)發(fā)生更改時(shí)狀態(tài)改變時(shí):當(dāng)動(dòng)態(tài)面板被設(shè)置了“設(shè)置面板狀態(tài)”動(dòng)作時(shí)。拖動(dòng)開(kāi)始時(shí):當(dāng)一個(gè)拖動(dòng)動(dòng)作開(kāi)始時(shí)。拖動(dòng)時(shí):當(dāng)一個(gè)動(dòng)態(tài)面板正在被拖動(dòng)時(shí)。拖動(dòng)結(jié)束時(shí):當(dāng)一個(gè)拖動(dòng)動(dòng)作結(jié)束時(shí)。向左拖動(dòng)結(jié)束時(shí):當(dāng)一個(gè)面板向左拖動(dòng)結(jié)束時(shí)。向右拖動(dòng)結(jié)束時(shí):當(dāng)一個(gè)面板向右拖動(dòng)結(jié)束時(shí)。向上拖動(dòng)結(jié)束時(shí):當(dāng)一個(gè)面板向上拖動(dòng)結(jié)束時(shí)。向下拖動(dòng)結(jié)束時(shí):當(dāng)一個(gè)面板向下拖動(dòng)結(jié)束時(shí)。滾動(dòng)時(shí):當(dāng)一個(gè)有滾動(dòng)的面板上下滾動(dòng)時(shí)。向上滾動(dòng)時(shí):當(dāng)一個(gè)有滾動(dòng)的面板,向上滾動(dòng)時(shí)。向下滾動(dòng)時(shí):當(dāng)一個(gè)有滾動(dòng)的面板,向下滾動(dòng)時(shí)。僅用于下拉列表和列表框的事件僅限動(dòng)態(tài)面板僅限中繼器每項(xiàng)加載時(shí):當(dāng)中繼器的項(xiàng)目首次加載到Web瀏覽器中并且中繼器的數(shù)據(jù)集以任何方式更改時(shí)列表項(xiàng)尺寸改變時(shí):當(dāng)中繼器項(xiàng)目的大小因任何交互而變化時(shí)(例如項(xiàng)目中的小部件被顯示,隱藏或調(diào)整大?。┰膭?dòng)作集鏈接元件1.打開(kāi)鏈接:可在以下三個(gè)位置中打開(kāi)URL或原型內(nèi)部頁(yè)面:當(dāng)前窗口:當(dāng)前的瀏覽器窗口新窗口/選項(xiàng)卡:新的瀏覽器窗口或選項(xiàng)卡彈出窗口:彈出窗口父窗口:彈出窗口的父窗口(必須在彈出窗口中加載的頁(yè)面中使用)2.關(guān)閉窗口:關(guān)閉當(dāng)前瀏覽器窗口或選項(xiàng)卡3.在框架中打開(kāi)鏈接:更改內(nèi)嵌框架窗口小部件或包含嵌入框架的頁(yè)面中加載的頁(yè)面內(nèi)聯(lián)框架:和頁(yè)面上的內(nèi)聯(lián)框架父框架:包含內(nèi)聯(lián)框架的頁(yè)面(必須在內(nèi)聯(lián)框架中加載的頁(yè)面中使用)4.滾動(dòng)到窗口小部件(錨點(diǎn)鏈接):將瀏覽器窗口滾動(dòng)到頁(yè)面上窗口小部件的位置1.顯示/隱藏:更改窗口小部件的可見(jiàn)性2.設(shè)置面板狀態(tài):更改動(dòng)態(tài)面板的可見(jiàn)狀態(tài)3.設(shè)置文本:更改窗口小部件上的文本4.設(shè)置圖像:更改圖像窗口小部件上的圖像5.設(shè)置選中:將指定元件的選中狀態(tài)設(shè)置為真6.設(shè)置選定列表選項(xiàng):更改下拉列表或列表框的選定列表選項(xiàng)7.啟用/禁用:?jiǎn)⒂没蚪么翱谛〔考?。禁用的窗小部件無(wú)法在Web瀏覽器中進(jìn)行交互,并且如果它具有“已禁用”樣式效果,則其可視外觀會(huì)更改8.移動(dòng):將小部件移動(dòng)到頁(yè)面上的新位置9.旋轉(zhuǎn):圍繞選定的錨點(diǎn)旋轉(zhuǎn)窗口小部件10.設(shè)置大?。焊男〔考拇笮?1.帶到前/后:將小部件帶到頁(yè)面深度順序的最前層或最后層12.設(shè)置不透明度:更改窗口小部件的不透明度13.焦點(diǎn):提供窗口小部件瀏覽器焦點(diǎn),將文本光標(biāo)移動(dòng)到文本輸入窗口小部件并突出顯示可單擊的窗口小部件14.展開(kāi)/折疊樹(shù)節(jié)點(diǎn):展開(kāi)或折疊樹(shù)窗口小部件的選定節(jié)點(diǎn)元件的動(dòng)作集中繼器其他動(dòng)作1.添加排序:使用指定的排序條件對(duì)中繼器數(shù)據(jù)集進(jìn)行排序2.刪除排序:從中繼器中刪除排序3.添加過(guò)濾器:使用指定的過(guò)濾條件過(guò)濾中繼器數(shù)據(jù)集4.刪除過(guò)濾器:從中繼器中刪除過(guò)濾5.設(shè)置當(dāng)前頁(yè)面:顯示分頁(yè)中繼器的特定頁(yè)面6.每頁(yè)設(shè)置項(xiàng)目數(shù):設(shè)置分頁(yè)中繼器每頁(yè)顯示的項(xiàng)目數(shù)7.數(shù)據(jù)集>添加行:向中繼器的數(shù)據(jù)集添加新行8.數(shù)據(jù)集>標(biāo)記行:標(biāo)記中繼器數(shù)據(jù)集中符合指定條件的行9.數(shù)據(jù)集>取消標(biāo)記行:取消標(biāo)記中繼器數(shù)據(jù)集中符合指定條件的行10.數(shù)據(jù)集>更新行:更新中繼器數(shù)據(jù)集中的現(xiàn)有數(shù)據(jù)11.數(shù)據(jù)集>刪除行:從中繼器的數(shù)據(jù)集中刪除行1.設(shè)置自適應(yīng)視圖:更改Web瀏覽器中顯示的自適應(yīng)視圖2.等待:在執(zhí)行任何后續(xù)操作之前,以毫秒為單位添加指定時(shí)間的暫停3.其他:顯示指定的文本描述(作為尚未原型化的操作的占位符)4.設(shè)置變量值:設(shè)置全局變量的值5.觸發(fā)事件:在頁(yè)面,主控或窗口小部件上觸發(fā)指定的事件變量變量是儲(chǔ)存文本和數(shù)值的容器。變量的值可在其它元件中顯示為文本,也可以在條件邏輯中使用。系統(tǒng)變量:是系統(tǒng)已經(jīng)創(chuàng)建好的變量,用于直接獲取對(duì)象的特定屬性值。變量可以分類(lèi)全局變量:主要是用于不同頁(yè)面之間值的傳遞。局部變量:主要是用于指定頁(yè)面內(nèi)某個(gè)特定對(duì)象,往往和系統(tǒng)變量配合使用。變量的本質(zhì)就是:數(shù)值的獲取和使用系統(tǒng)變量變量全局變量全局變量的設(shè)置通過(guò)交互設(shè)置變量值變量全局變量的訪問(wèn)變量在WEB瀏覽器中查看全局變量的值在預(yù)覽原型時(shí),可以在WEBBROWER的控制臺(tái)中查看該原型所有全局變量的值。變量局部變量的創(chuàng)建可以在編輯文本的對(duì)話框中直接輸入局部變量的名稱并對(duì)其表達(dá)式進(jìn)行加工,同時(shí)也可以在插入變量或函數(shù)菜單中插入一個(gè)局部變量。此外,當(dāng)你更改下方局部變量名稱時(shí),上方的局部變量名稱亦會(huì)同步變動(dòng)。局部變量的訪問(wèn)條件邏輯條件邏輯的設(shè)定條件邏輯是一個(gè)規(guī)則系統(tǒng),比如,你可以規(guī)定在滿足何種條件時(shí)才執(zhí)行某一個(gè)動(dòng)作條件邏輯多個(gè)情形的設(shè)定注意,在IF-ELSE情況下,如果IF中的條件為T(mén)RUE時(shí),后面所有的將不再執(zhí)行。多個(gè)IF-ELSE默認(rèn)情況下,事件的第一個(gè)情形為IF,后面的為ELSE??梢詫⒑竺娴腅LSE改為IF來(lái)繼續(xù)創(chuàng)建IF-ELSE鏈。右鍵單擊情形名稱選擇切換為[如果]或[否則]動(dòng)畫(huà)和邊界可見(jiàn)性效果通常有4+4+1,一共9種效果可供選擇。這些效果適用于動(dòng)作顯示/隱藏”操作及“

設(shè)置面板狀態(tài)”動(dòng)畫(huà)和邊界1.擺動(dòng):動(dòng)畫(huà)在開(kāi)始和結(jié)束時(shí)略慢2.線性:動(dòng)畫(huà)在整個(gè)時(shí)間內(nèi)以相同的速度進(jìn)入3.緩慢進(jìn)入:開(kāi)始緩慢,逐漸變快,直到結(jié)束4.緩慢退出:開(kāi)始較愉,逐漸緩慢,直到結(jié)束5.緩進(jìn)緩出:開(kāi)始慢,到中點(diǎn)前快,然后變慢。6.彈跳:具有回彈效果7.彈性:具有彈簧效果運(yùn)動(dòng)效果動(dòng)畫(huà)和邊界移動(dòng)操作可以指定目標(biāo)元件(部件)的移動(dòng)范圍。在更多選項(xiàng)中,單擊添加邊界,即可。上下左右分別可設(shè)置。移動(dòng)的邊界交互樣式鼠標(biāo)懸停:當(dāng)鼠標(biāo)懸停在元件上時(shí),元件的顯示樣式。鼠標(biāo)按下:當(dāng)鼠標(biāo)按下元件時(shí),元件的顯示樣式。選中:元件被選中時(shí)的顯示樣式。禁用:元件被停止使用時(shí)的顯示樣式。獲取焦點(diǎn):當(dāng)光標(biāo)聚焦在元件(如文本框)上的顯示樣式基本樣式:部件的基本樣式,選中“基本樣式”,點(diǎn)擊下拉基本樣式選擇列表,可選擇基本樣式,一般只有“默認(rèn)樣式”,如果用戶有設(shè)置新樣式,則可選擇其他樣式;字體:字體設(shè)置。選中“字體”,點(diǎn)擊字體下拉列表,選擇字體。字體類(lèi)型:字體類(lèi)型設(shè)置。選中“字體類(lèi)型”,點(diǎn)擊字體類(lèi)型下拉列表,選擇字體類(lèi)型。字號(hào):字號(hào)設(shè)置。選中“字號(hào)類(lèi)型”,點(diǎn)擊字號(hào)下拉列表,選擇字號(hào)。粗體:字體粗體設(shè)置。選中“粗體”,點(diǎn)擊粗體按鈕切換粗體。斜體:字體斜體設(shè)置。選中“斜體”,點(diǎn)擊粗體按鈕切換斜體。下劃線:字體下劃線設(shè)置。選中“下劃線”,點(diǎn)擊下劃線按鈕切換斜。字體顏色:字體顏色設(shè)置。選中“字體顏色”,點(diǎn)擊字體按鈕旁的下拉按鈕,打開(kāi)顏色選擇器,選擇字體顏色。線條顏色:線條顏色設(shè)置。選中“線條顏色”,點(diǎn)擊線條按鈕旁的下拉按鈕,打開(kāi)顏色選擇器,選擇線條顏色。線寬:線條寬度設(shè)置。選中“線寬”,點(diǎn)擊線寬按鈕旁的下拉按鈕,打開(kāi)線寬列表,選擇線寬類(lèi)型。線型:線條類(lèi)型設(shè)置。選中“線型”,點(diǎn)擊線型按鈕旁的下拉按鈕,打開(kāi)線型列表,選擇線條類(lèi)型。圓角半徑:圓角半徑設(shè)置。選中“圓角半徑”,在輸入框內(nèi)輸入圓角半徑的數(shù)值。填充顏色:填充顏色設(shè)置。選中“填充顏色”,點(diǎn)擊油漆桶旁的下拉按鈕,打開(kāi)顏色選擇器,選擇填充顏色。不透明度(%):填充顏色透明度設(shè)置。選中“不透明度(%)”,在輸入框內(nèi)輸入不透明度(%)的數(shù)值。外部陰影:外部陰影設(shè)置。選中“外部陰影”,點(diǎn)擊外部陰影旁的下拉按鈕,打開(kāi)設(shè)置窗口,設(shè)置偏移范圍、模糊參數(shù)、陰影顏色。內(nèi)部陰影:內(nèi)部陰影設(shè)置。選中“內(nèi)部陰影”,點(diǎn)擊內(nèi)部陰影旁的下拉按鈕,打開(kāi)設(shè)置窗口,可以設(shè)置偏移范圍、模糊參數(shù)、延伸、陰影顏色。文字陰影:文字陰影設(shè)置。選中“文字陰影”,點(diǎn)擊文字陰影旁的下拉按鈕,打開(kāi)設(shè)置窗口,設(shè)置偏移范圍、模糊參數(shù)、陰影顏色。對(duì)齊:字體對(duì)齊設(shè)置。選中“對(duì)齊”,選擇右邊字體對(duì)齊類(lèi)型:左對(duì)齊、中間對(duì)齊、右對(duì)齊。預(yù)覽:選中“預(yù)覽”可以在設(shè)置時(shí)對(duì)設(shè)置的交互樣式進(jìn)行預(yù)覽。

交互樣式設(shè)置窗口說(shuō)明選擇組1.在畫(huà)布或頁(yè)面概要中選多個(gè)元件;2.在交互窗格的更多屬性中,在“指定選擇組”字段中輸入新選擇組的名稱。此時(shí)即可新增一個(gè)選擇組。3.通過(guò)選擇并清除“指定選擇組”字段的選擇,從選擇組中刪除某元件的選項(xiàng)組指定。選擇組的創(chuàng)建與清除Axure元件——基本元件第四部分圖片圖片的添加123注意、點(diǎn)擊插入后選擇需要插入的圖片即可,插入到畫(huà)布中。而選擇本地文件夾加載,需要在元件庫(kù)里進(jìn)行選擇圖片放到畫(huà)布中。圖片圖片的編輯圖片的切割與裁剪單擊右鍵該圖片,可選擇切割或裁剪。也可以使用S和C鍵盤(pán)快捷鍵。切割工具將圖像分成幾個(gè)部分,每個(gè)部分都成為一個(gè)新的圖像元件??梢允褂盟?,垂直或橫切切割。色彩調(diào)整固定邊角范圍圖片的切割與裁剪線條線條的創(chuàng)建直線改曲線12熱區(qū)熱區(qū)的添加和作用1.可以添加成鏈接2.跳轉(zhuǎn)到層或區(qū)域3.可以添加交互4.用作跳轉(zhuǎn)5.作為錨點(diǎn)用6.自定義按鈕動(dòng)態(tài)面板動(dòng)態(tài)面板的創(chuàng)建動(dòng)態(tài)面板動(dòng)態(tài)面板的創(chuàng)建動(dòng)態(tài)面板的遮罩關(guān)閉動(dòng)態(tài)面板遮罩開(kāi)啟動(dòng)態(tài)面板遮罩動(dòng)態(tài)面板設(shè)置單個(gè)面板狀態(tài)動(dòng)態(tài)面板概要窗格中設(shè)置隱藏和可見(jiàn)從首個(gè)狀態(tài)脫離動(dòng)態(tài)面板邊框樣式和背景填充對(duì)動(dòng)態(tài)特定的事件和交互動(dòng)態(tài)面板的選擇組動(dòng)態(tài)面板動(dòng)態(tài)面板與其他元件的聯(lián)動(dòng)我們?cè)谧鲈偷臅r(shí)候,有時(shí)候會(huì)遇到各種列表的聯(lián)動(dòng)情況,這里我們做一個(gè)使用動(dòng)態(tài)面板實(shí)現(xiàn)聯(lián)動(dòng)的實(shí)例。一個(gè)省級(jí)選擇的下拉列表,下一個(gè)是相對(duì)于省級(jí)列表的各個(gè)市區(qū)的動(dòng)態(tài)面板內(nèi)聯(lián)框架內(nèi)聯(lián)框架的使用內(nèi)聯(lián)框架內(nèi)聯(lián)框架的使用中繼器中繼器1.由多個(gè)零件組成的item,這個(gè)item重復(fù)多個(gè)(你可以在右側(cè)的樣式欄目中設(shè)置他的布局方式)。2.數(shù)據(jù)集:用來(lái)控制顯示外觀的數(shù)據(jù)表。存儲(chǔ)在數(shù)據(jù)集中的文本、圖像、數(shù)字等等通過(guò)中繼器的“載入時(shí)”交互事件來(lái)顯示在每個(gè)要展示的項(xiàng)目上。中繼器中繼器的屬性間距:指每個(gè)item之間的間距像素布局:可選擇水平或垂直適應(yīng)HTML內(nèi)容啟用此選項(xiàng)后,每個(gè)中繼器項(xiàng)將自動(dòng)調(diào)整大小以適合其包含的小部件瀏覽器展示時(shí)每個(gè)頁(yè)面展示多少個(gè)同時(shí)可以設(shè)置從第幾頁(yè)開(kāi)始載入中繼器項(xiàng)目中繼器有多少行說(shuō)明有多少個(gè)重復(fù)的item;有多少個(gè)列,說(shuō)明就有多少個(gè)需要傳遞的變量(數(shù)據(jù))??梢酝ㄟ^(guò)Ctrl+V(Windows)或者CMD+V(Mac)將數(shù)據(jù)直接粘貼到這里(當(dāng)然圖片還是需要單獨(dú)導(dǎo)入的)數(shù)據(jù)集的介紹導(dǎo)入圖片需要在,每行的圖片列里右鍵選擇導(dǎo)入圖片,找到需要圖片。中繼器數(shù)據(jù)集的數(shù)據(jù)顯示中繼器數(shù)據(jù)集項(xiàng)目的交互使用點(diǎn)擊中繼器中圖片后跳轉(zhuǎn)到指定的網(wǎng)頁(yè),能夠通過(guò)剛創(chuàng)建的交互導(dǎo)航到中繼器數(shù)據(jù)集中引用的URL和原型頁(yè)面。文本框和文本域文本框和文本域?qū)儆诒韱慰丶梢杂糜谳斎虢K端的鍵入響應(yīng)。文本框與文本域的提示文字文本域:針對(duì)多行輸入,例如一些反饋的表單等等。文本框:針對(duì)單行輸入,例如用戶名或密碼等等。文本框與文本域的介紹文本框輸入類(lèi)型的控制注意:輸入類(lèi)型的控制僅針對(duì)文本框,文本域無(wú)此功能。在移動(dòng)設(shè)備上預(yù)覽時(shí),對(duì)于不同類(lèi)型的輸入類(lèi)型控制會(huì)喚起不同的輸入鍵盤(pán)類(lèi)型,比如數(shù)字小鍵盤(pán)等。文本字段類(lèi)型是HTML的一個(gè)特性,并非Axure的特有發(fā)明。文本:默認(rèn)輸入密碼:文本在輸入時(shí)被屏蔽郵箱:可以在移動(dòng)端上提示電子郵件數(shù)字:只接受數(shù)字輸入,移動(dòng)設(shè)備上喚起數(shù)字鍵盤(pán)電話號(hào)碼:移動(dòng)設(shè)備上喚起撥號(hào)鍵盤(pán)URL:移動(dòng)設(shè)備上喚起URL輸入鍵盤(pán)搜索:默認(rèn)輸入但是多了一個(gè)快速清除功能文件:將文本字段更改為Web瀏覽器中的文件上傳按鈕,單擊該按鈕將打開(kāi)設(shè)備的文件瀏覽器日期:可喚起日期選擇器或日歷控件月份:可喚起月份和年份選擇器時(shí)間:可能會(huì)提示瀏覽器樣式的時(shí)間選擇器下拉列表添加,刪除和重新排序下拉列表選項(xiàng)下拉列表特殊交互交互演示下拉列表下拉框的提交按鈕指定提交按鈕列表框復(fù)選框復(fù)選框復(fù)選框選中與特殊交互復(fù)選框復(fù)選框的提交按鈕按住Enter鍵可以觸發(fā)指定元件的鼠標(biāo)單擊事件單選按鈕單選按鈕組單選按鈕單選按鈕的交互按鈕添加交互,單擊時(shí),切換單選按鈕的選中狀態(tài),在設(shè)置單選按鈕選中改變時(shí)設(shè)置文本的改變。Axure元件——菜帶|表格|標(biāo)記元件第五部分樹(shù)樹(shù)較常用于模擬文件瀏覽器和其他層次結(jié)構(gòu)的可視化展示。單擊樹(shù)上面各個(gè)節(jié)點(diǎn)可以在頁(yè)面上顯示不同的元件或打開(kāi)項(xiàng)目中的不同頁(yè)面。創(chuàng)建、添加、移動(dòng)樹(shù)節(jié)點(diǎn)創(chuàng)建:在樹(shù)元件上右鍵,

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論