Axure教程：用中繼器做穿梭框_第1頁
Axure教程：用中繼器做穿梭框_第2頁
Axure教程：用中繼器做穿梭框_第3頁
Axure教程：用中繼器做穿梭框_第4頁
Axure教程：用中繼器做穿梭框_第5頁
全文預覽已結(jié)束

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權，請進行舉報或認領

文檔簡介

Axure教程：用中繼器做穿梭框穿梭框是常用的一個選擇器，它使用直觀方式在左右列表框移動數(shù)據(jù)，實現(xiàn)數(shù)據(jù)的多項選擇。所以今天和大家分享如何用中繼器做一個高保真的穿梭框原型，本教程主要是講解兩個中繼器的聯(lián)動交互，屬于中高級教程。原型預覽地址：一、材料準備中繼器（內(nèi)含矩形）*2；背景框*2；左箭頭*1；右箭頭*2；文本*2，如下圖所示擺放：中繼器內(nèi)的矩形需要取消邊框，然后設置鼠標移入時填充顏色為灰色，選中時填充顏色為藍色，這樣會有更好的交互感。背景框置于底層，調(diào)整合適的大小和位置即可。左邊的為未選項中繼器1，在中繼器表格內(nèi)填寫對應選項文字；然后復制到右面，為已選項中繼器2，由于已選項默認為0，所以需要刪除中繼器所有行，默認空值即可。中繼器1和2均需取消隔離選項組和隔離單選按鈕組效果，兩個中繼器內(nèi)的矩形需要設置單選組。文本元件命名為邏輯1和邏輯2，默認為空且隱藏，后續(xù)用于邏輯交互。二、交互設置中繼器1每項載入時：設置中繼器1內(nèi)矩形文字為列表Column0的值，這個交互是中繼器默認設置的。中繼器1內(nèi)矩形鼠標單擊時：選中當前元件：因為之前我們設置了選中的顏色變藍，所以這樣做以后，就可以知道選中了那一項，而且因為設置了單選組，所以也不會同時選中多個。設置邏輯1的文本為列表Column0的值：這里其實就是把選中的值記錄下來，方便后面左右箭頭穿梭的操作。中繼器2每項加載時及內(nèi)部矩形鼠標單擊時：交互和中繼器1一致，不過需要注意的是，中繼器2里面設置的文本是邏輯2的文本。右箭頭鼠標單擊時：這里需要判斷邏輯1的文字是否為空，如果為空就是還沒選中，就不發(fā)生交互，如果不為空，就需要做一個增加行和刪除行的交互。增加行：在中繼器2里增加行，增加的值為邏輯1文本值；刪除行：刪除中繼器1里的和邏輯1文本值相同的行。完成上述兩個交互之后，我們還需要清空邏輯1的文本，因為如果不清空，我們點右箭頭就可以無限增加同一個選項，所以這里需要清空邏輯1的文本值。左箭頭鼠標單擊時：左箭頭和右箭頭的交互其實是一個道理的，首先需要判斷邏輯2的文本是否為空，如果為空就是還沒選中，就不發(fā)生交互，如果不為空，就需要做一個增加行和刪除行的交互，不過這里和中繼器1的交互是反過來的。增加行：在中繼器1里增加行，增加的值為邏輯2文本值；刪除行：刪除中繼器2里的和邏輯2文本值相同的行。設置邏輯2的文本值為空值，那這樣一個實用的穿梭框原型就制作完成了。完成之后，以后我們需要使用的話，只需要填寫在左邊中

溫馨提示

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

評論

0/150

提交評論