【正文】 的區(qū)分，其實(shí)是參考程序編程的結(jié)構(gòu)而做的，這就把程序構(gòu)成人性化、語義化了。這章我著重講解交互觸發(fā)與交互行為中的快速鏈接，詳情的交互行為與交互條件留待后面兩章進(jìn)行詳解。還是照例先給三個(gè)名詞做出名詞解釋。交互觸發(fā)：是發(fā)生交互的導(dǎo)火索，說明引起交互的觸發(fā)動(dòng)作是什么。 以此文字鏈為例，交互的觸發(fā)原因，是“點(diǎn)擊文字鏈”。交互條件：是達(dá)成我們目標(biāo)行為的前提條件。如果目標(biāo)行為只有一個(gè)，對(duì)觸發(fā)沒有任何條件限制，交互條件則可以被忽略。 再以此文字鏈接為例，如果對(duì)查看文章列表沒有任何限制，則不設(shè)置交互條件，用戶點(diǎn)擊文字鏈，直接發(fā)生交互行為。如果對(duì)查看文章列表有權(quán)限限制，只允許作者查看，則觸發(fā)交互行為的條件就是“以文章作者h(yuǎn)awking的身份登錄”。 PS：有條件本身，就必然會(huì)有條件的反面?；蛘哂卸鄠€(gè)條件，就會(huì)有多個(gè)條件之外的例外情況。在寫文檔的時(shí)候，必須考慮進(jìn)去，說明清楚，這一點(diǎn)最容易疏漏，而造成程序員在開發(fā)的時(shí)候想當(dāng)然，或者再回來問你。針對(duì)這個(gè)例子，條件的反面就是“登錄者不是hawking，或沒有登錄”。交互行為：是機(jī)器依據(jù)觸發(fā)事件與條件，做出的反應(yīng)動(dòng)作或行動(dòng)。 此文字鏈接的的交互行為，就是“頁(yè)面跳轉(zhuǎn)到hawking 的 axure rp 5 文章列表頁(yè)面”。一、交互觸發(fā)觸發(fā)主要有兩種，一種是頁(yè)面載入觸發(fā)，一種是鼠標(biāo)行為觸發(fā)。頁(yè)面載入觸發(fā)，針對(duì)的對(duì)象就是我們所編輯的頁(yè)面，axure將其放在了page notesamp。page interactions面版中。如下圖所示，就是page interactions。Axure暫時(shí)僅支持一種頁(yè)面觸發(fā)條件，就是OnPageLoad當(dāng)頁(yè)面載入時(shí)。如圖所示，針對(duì)我們?cè)O(shè)置的case事件，axure提供了三個(gè)功能。Add case：給所選對(duì)象增加事件。Edit case：編輯所選事件。（功能前提，選擇你索要編輯的事件，比如鼠標(biāo)選擇case 1）。Delete case：刪除所選事件。（功能前提，選擇你索要編輯的事件，比如鼠標(biāo)選擇case 1）。鼠標(biāo)行為觸發(fā)是當(dāng)用戶使用鼠標(biāo)操作界面時(shí)，引發(fā)交互。Axure支持的鼠標(biāo)觸發(fā)行為根據(jù)你所選擇的對(duì)象不同而不同，選擇圖形、文字、鏈接會(huì)出現(xiàn)三種觸發(fā)行為：Onclick：當(dāng)鼠標(biāo)點(diǎn)擊目標(biāo)時(shí)，觸發(fā)交互行為。OnMouseEnter：當(dāng)鼠標(biāo)移入目標(biāo)熱區(qū)時(shí)，觸發(fā)交互行為。OnMouseOut：當(dāng)鼠標(biāo)從目標(biāo)熱區(qū)移出時(shí)，觸發(fā)交互行為。如果選擇的是輸入框、多選框等則會(huì)出現(xiàn)對(duì)應(yīng)功能的觸發(fā)行為：OnKeyUp：Fires when the user releases a 。OnFocus：當(dāng)鼠標(biāo)選擇、聚焦到對(duì)象時(shí)，觸發(fā)交互行為。OnLostFocus：當(dāng)鼠標(biāo)失去對(duì)目標(biāo)對(duì)象的選擇、聚焦時(shí)，觸發(fā)交互行為。特別的，選擇下拉框、列表框會(huì)出現(xiàn)：Onchange：當(dāng)所選項(xiàng)被更改時(shí)，觸發(fā)交互行為。而選擇我們所編輯的對(duì)象后，如果對(duì)象之前沒有編輯過交互事件，則有兩個(gè)選項(xiàng)Add case：給所選對(duì)象增加事件。Quick link：快速添加鏈接。如果曾經(jīng)編輯過交互事件，則有三個(gè)功能，和頁(yè)面載入觸發(fā)是一樣的，這里也就不再累述。二、交互行為—快速鏈接選擇好交互觸發(fā)后，在對(duì)交互沒有特定條件設(shè)置的前提下，我們可以直接設(shè)置此次觸發(fā)引起的交互行為。由于鏈接跳轉(zhuǎn)是網(wǎng)頁(yè)中最常用的交互行為，因此axure特意提供了一個(gè)快速鏈接的功能。選擇對(duì)象后，點(diǎn)擊快速鏈接則會(huì)彈出如下link properties 鏈接屬性面版：如圖所示，此面版中有四條可選命令：link to a page in this design：鏈接到這個(gè)項(xiàng)目中的某一特定頁(yè)面。你可以通過鼠標(biāo)點(diǎn)擊，選擇你想要跳轉(zhuǎn)的，樹型目錄中的相應(yīng)頁(yè)面。link to an external url or file：鏈接到一個(gè)外部鏈接或者文件。你可以通過在hyperlink框中輸入鏈接地址，完成鏈接導(dǎo)向。注意：鏈接最好是絕對(duì)鏈接地址，不然就容易出錯(cuò)。reload current page：重新載入當(dāng)前頁(yè)面。Variable changes are applied變量變化生效。back to previous page：返回瀏覽前一頁(yè)面。Varable changes are not applied變量變化不生效。（九）交互interactions（中）本章要介紹的是交互條件。交互條件是axure的學(xué)習(xí)中的難點(diǎn)，也是axure高段進(jìn)階功能。其實(shí)我們不設(shè)置條件，直接靠文字說明，也可以完成我們的思想傳達(dá)，如果你設(shè)計(jì)的原型文檔，能模擬真實(shí)的交互環(huán)境，當(dāng)然就非常優(yōu)秀了。但是，我要強(qiáng)調(diào)一點(diǎn)觀點(diǎn)，傳達(dá)思想是首要的工作，傳達(dá)思想也是有成本的，如果為了傳達(dá)思想要耗費(fèi)更多無意義的勞動(dòng)，損耗更多的時(shí)間，增加更多的溝通難度，不要也罷！我個(gè)人覺得，我們?cè)谧鲈驮O(shè)計(jì)的時(shí)候，有沒有必要把頁(yè)面模擬到和真實(shí)情況一模一樣，這個(gè)還值得探討。言歸正傳，開始來說設(shè)置 交互條件。一、進(jìn)入 交互條件設(shè)置當(dāng)我們選擇好了交互觸發(fā)，通過雙擊選擇促發(fā)動(dòng)作，或者點(diǎn)擊add case ，就會(huì)彈出interaction case properties 交互事件屬性窗口。通過這個(gè)面板，我們要表達(dá)我們偉大的交互行為。面板告訴了我們?nèi)讲呗裕篠tep1 description 描述描述后的input輸入框，可以編寫事件的名稱，或者事件的描述文字，以供生成html頁(yè)面展示時(shí)標(biāo)注此事件，也供生成需求文檔的時(shí)候辨識(shí)此功能功能。Add condition （if necessary）增加條件（如果需要的話）。這就是這章所要說的重點(diǎn)內(nèi)容，為我們要?jiǎng)?chuàng)建的交互事件，設(shè)置前提條件。我想，axure在這里添加這么一 句話，也許同樣是在提醒我們，我們把交互做到如此之細(xì)，是否真的必要？思考清楚了目的，考量準(zhǔn)確了我們需要投入的精力，再開始做這一步。我想會(huì)清晰很多。Step2 select action 選擇動(dòng)作Step3 edit the actions description（click an underlined value to edit）編輯動(dòng)作描述，你可以通過點(diǎn)擊有下劃線的文字，編輯動(dòng)作的具體參數(shù)。第二步與第三步，就是我下一章要說的交互行為，或者叫交互動(dòng)作也可以。第二步是選擇我們要進(jìn)行的動(dòng)作，第三步則是為我們的動(dòng)作設(shè)置具體的參數(shù)。這些我們稍后再看，還是先來了解下，我們可以怎么設(shè)置條件。二、條件設(shè)置的功能與細(xì)節(jié)點(diǎn)擊step 1 后面帶下劃線的文字，add condition，彈出condition builder條件設(shè)置 窗口條件設(shè)置窗口也分三個(gè)部分：A、滿足條件類型選擇與條件清理 我們可以同時(shí)設(shè)置多個(gè)條件，但是我們是需要滿足所有條件，還是僅僅滿足其中一個(gè)條件就可以了呢？ 在satisfy “any / all”of the following 中就提供了這個(gè)選擇。 選擇all，則需要滿足我們?cè)O(shè)置的所有條件；假設(shè)，你設(shè)置了條件a、b、c，則你需要同時(shí)滿足條件a、b、c，才能產(chǎn)生最后的交互。 選擇any，就是需要滿足我們?cè)O(shè)置的任一條件。假設(shè)，你設(shè)置了條件a、b、c，則你需要滿足a、b、c中任何一個(gè)條件，就能產(chǎn)生最后的交互。另外，如果我們對(duì)我們?cè)O(shè)置的眾多條件都不滿意，想全部刪除重新設(shè)置，clear all 就是為了滿足我們這一需要的按鈕。B、設(shè)置具體條件a)增加條件與刪除條件。初始默認(rèn)我們只有一個(gè)條件，通過點(diǎn)擊條件末尾的“”、“+”按鈕，我們可以刪除、添加新的條件。b)條件設(shè)置注意：在設(shè)置條件前，需要給條件所涉及的widgets對(duì)象設(shè)置label名稱，因?yàn)闂l件設(shè)置，需要用label定位widgets。條件設(shè)置分五個(gè)部分，但是其實(shí)只需要將其看做三個(gè)部分。為什么這么說呢？這是我的深刻教訓(xùn)，我在寫這篇攻略的時(shí)候走了一段比較長(zhǎng)的彎路，最后才發(fā)現(xiàn)自己的錯(cuò)誤，所以也非常希望朋友們不走我一樣的彎路。下面且聽我道來。我最開始把條件設(shè)置看做5個(gè)部分，1是作為條件類型的設(shè)置，則2是設(shè)置要比較的對(duì)象，3是比較方式，然后根據(jù)你選擇的對(duì)象，后面5會(huì)分別出現(xiàn)不 同的可比較條件或設(shè)置條件。這樣理解是沒有錯(cuò)的，但是就繞了一個(gè)非常大的彎路，而且表述起來要逐條羅列，非常繁瑣。所以一開始，我根據(jù)1可能出現(xiàn)的六種類 型，畫了6個(gè)大表格，企圖把所有的情況囊括，做了很多無用功。現(xiàn)在我們嘗試把它理解為三個(gè)部分，那么怎么理解呢？細(xì)心的人可能發(fā)現(xiàn)了，3是設(shè)置的比較方式，可以是等于，也可以是不等于，或者是大于小于。而左右兩邊是被比較的兩個(gè)對(duì)象。對(duì)了，這就是關(guān)鍵，2設(shè)置的是條件的比較方，我們把它看做a，5是條件的被比較方，我們把它看做b，而3就是比較方式。而我們要做的工作就是設(shè)置a與b的關(guān)系。但是設(shè)置比較關(guān)系是有原則的，就是數(shù)值可以和數(shù)值比較，區(qū)域選擇狀態(tài)可以和區(qū)域選擇狀態(tài)比較。我們不可能設(shè)置讓一個(gè)變量，等于一個(gè)區(qū)域被選擇的狀態(tài)。所以根據(jù)a的不同，b的可選項(xiàng)也會(huì)相應(yīng)的改變，但是他們的內(nèi)容基本上是一致的。比較對(duì)象類型 比較針對(duì)目標(biāo) 注意 check state of 多項(xiàng)/單項(xiàng)選擇框的選擇狀態(tài) 多項(xiàng)選擇（checkbox）、單項(xiàng)選擇（radio button）。注意：這里會(huì)顯示頁(yè)面上的多項(xiàng)選擇、單項(xiàng)選擇的label名稱，所以做頁(yè)面工作的時(shí)候，要保持有效命名label的好習(xí)慣，以下不再累述。 此項(xiàng)目只能與選擇狀態(tài)比較，或者value of variable變量值比較，不能與其他類型的對(duì)象比較。這是最特殊的一項(xiàng)，以下不再做強(qiáng)調(diào)。 selected option of 所選擇的菜單 下拉菜單條droplist或者list box列表文本框。這里也是顯示你所設(shè)置的label名稱 value of variable 變量的值Onloadvariable系統(tǒng)默認(rèn)的變量 Add new..自己新增一個(gè)變量 如果你設(shè)置了其他變量，這里會(huì)提供選擇 length of variable value 變量值的長(zhǎng)度 同上 check state of多項(xiàng)/單項(xiàng)選擇框的選擇狀態(tài) 這里會(huì)提供文本輸入框input、文本框text供你選擇 length of widget value 圖形原件上的文字長(zhǎng)度 提供文本輸入框input、文本框text、下拉菜單條droplist或者list box列表文本框的label名稱選擇 Value值 當(dāng)a比較對(duì)象是list時(shí)，這里是選擇狀態(tài)，當(dāng)a的比較對(duì)象是數(shù)值時(shí)，這個(gè)數(shù)值由用戶自定義設(shè)置。 此選項(xiàng)根據(jù)條件設(shè)置情況只出現(xiàn)在b。 以上列出了可操作的對(duì)象情況，大家可以自行研究一下，寫得有點(diǎn)不太形象，有機(jī)會(huì)我再專門做實(shí)例來說明。其實(shí)很簡(jiǎn)單，朋友們可以自己做一兩個(gè)例子，把 所有的wigets拖到頁(yè)面里，并根據(jù)各自的情況命名label，然后一條條的選擇，操作一下就清楚了，我這里主要提的是一個(gè)理解的方法，條件含義的說 明。當(dāng)然，不能忘了說明一下，3比較方式有哪些，如下： equals 對(duì)象的值等于 does not equals 對(duì)象的值不等于 is less than 對(duì)象的值小于 is greater than 對(duì)象的值大于 is less or equals 對(duì)象的值小于等于 is greater or equals 對(duì)象的值大于等于 is 對(duì)象是 ，需要注意的是，這里不是關(guān)注的值，而是關(guān)注的對(duì)象組成的內(nèi)容以上內(nèi)容，大家可以對(duì)照著參考學(xué)習(xí)。C、自動(dòng)生成對(duì)條件的文字描述條件的第三部份基本上不需要我們手動(dòng)設(shè)置，在進(jìn)行第二步條件設(shè)置的時(shí)候，這里會(huì)自動(dòng)生成描述性的英文。即便是可以選擇的部分，也會(huì)提示鏈接，讓我們點(diǎn)擊鏈接，手動(dòng)選擇。所以這里的重點(diǎn)意義，在于生成prd文檔的時(shí)候，會(huì)生成條件的說明文字。三、綜合談一談設(shè)置合理的條件。好了，交互條件設(shè)置基本上說完了，可能會(huì)有一些不清楚，因?yàn)檫@里的條件設(shè)置會(huì)涉及到部分的程序的內(nèi)容，而且條件設(shè)置有點(diǎn)繞，有點(diǎn)暈。但是大家沒有必要那么著急，一方面因?yàn)槿绻汜槍?duì)我的文字多對(duì)應(yīng)操作一下，就很容易了解，另一方面因?yàn)槲椰F(xiàn)在要說的，還是條件設(shè)置不重要。為什么條件設(shè)置不重要？我要提出我的幾點(diǎn)理由：設(shè)置過于復(fù)雜的條件，做成的展示文件，可能根本沒有用途。程序員可能根本不看，