Axure中利用中繼器快速實現APP中設置面的各種列表選項_第1頁
Axure中利用中繼器快速實現APP中設置面的各種列表選項_第2頁
Axure中利用中繼器快速實現APP中設置面的各種列表選項_第3頁
Axure中利用中繼器快速實現APP中設置面的各種列表選項_第4頁
Axure中利用中繼器快速實現APP中設置面的各種列表選項_第5頁
免費預覽已結束,剩余2頁可下載查看

下載本文檔

版權說明:本文檔由用戶提供并上傳,收益歸屬內容提供方,若內容存在侵權,請進行舉報或認領

文檔簡介

1、中繼器是 AxureAxure 中的一個高級元件,可以當做 AxureAxure 中的小型數據庫使用,用于實現一些增刪查改的效果,同時可用于一些具有相同元件組合的組件的快速生成,比如 APPAPP 中的設置,如下圖所示。下面我們介紹一下怎么用中繼器實現。隱私用口i i 隹可以評觸所有人通用 igBigB 帶圖標金語言簡體中文開啟 WifiWifi口直播設置中繼器基礎知識我們先介紹一下中繼器的基礎知識,拖入一個中繼器,可以看到顯示的是縱排的三個矩形框,框中內容分為為 123,123,交互中有一個事件每項加載時, 元件動作是設置矩形框的文本為 Item.Column0Item.Column0, ,

2、點擊樣式,可以看到有一個數據表格,默認只有一列 Column0Column0 列中數據為123123。雙擊中繼器,可以看到其中只有一個矩形框。從中不難看出以下幾點:1 1)雙擊進入中繼器后,添加的各種元件相當于中繼器本身的模板,后面會按這個模板進行渲染;2 2)模板渲染多少次是由樣式中數據表的行數決定的,比如默認只有三行數據,就只生成了三個矩形框;3)3)樣式表中的每一行數據就是每次渲染時可以傳入模板中的數據,數據傳入需要通過中繼器的每項加載時”這個事件進行觸發設置,比如比如默認的是把 Column0Column0 這列的數據傳給了矩形框。通過增加列,可以增加每次渲染時可以使用的數據,列名可以

3、自定義(英文字符)。圖表的,應該要包含一下元件:1)1) 一個矩形框,用于規定模板的邊界大小,同時用于裝載選項的名字,邊框不顯示,元件命名為”選項名:注意設置文字的左邊距;2)2) 一個 swichswich 切換開關;3)3) 一個標簽,用于存放右側的提示文字,命名為”提示文字:注意選擇右對齊;4)4) 一個“符號;5)5) 一根直線,放于底邊,作為每行的分隔線,命名為“分隔線:如下圖所示,把這幾個元素組合好。點擊后按鈕開始添加新 fl首先我們要確定一下我們的模板組成,對于不帶最后,數據表中的數據除了字符串外,通過右鍵還可以引入圖片或則頁面,這個功能非常強在數據表中輸入下面的內容,一共四行數

4、據,表示我們要生成四個選項。namename 表示選項名;swsw 讓 chch 為標志位,如果需要使用開關按鈕就填入 true,true,否則不填為 truetrue 時后面都不用填;optionoption 是選項右側的文字,如果不需要則不填;dayufudayufu 為標志位,需要顯示大于符號時填 true,true,與 switchswitch 不能同時設置;pageUrlpageUrl 用于引用頁面,對于設置了大于符號的項,一般都要跳轉頁面,直接引用該頁面即可。nameswrtchoption:dayufupageUrl添加列語言簡體中文truetrue語言EJEJ隱私用戶true誰

5、可以評論我所有人true誕可以評論目true添加行數據和模板都設置好了,下面要控制每一項渲染時的數據傳入,首先先設置文字類的數據,主要有兩個:1 1)把模板中的選項名設置為 I;I;2 2)把提示文字設置為 Item.optionItem.option。通過 fxfx 中插入變量,ItemItem 表示中繼器本身。簡體中文瞪私用戶誰可以評論我通用設置接下來就是控制顯示 switchswitch 開關還是顯示”符號,這個可以為模板添加載入事件,在載入時判斷改行的數據switchswitch 是否為 true,true,不為 truetrue 時將其隱藏,否則將”提

6、示文字和”符號隱藏:I甑工加上11111111k k人北口|-tiUe-tiUe- -I*i-JS皿*H三示他說斯 EX舞宿文亞生通臉尺文卑為里在斷電去在立虹;在工+.9sa:-J”克里廿War其取金型”.黃嚴的詈削庭;-搔人表達式【的遇*VarB),我收為盧4聞.氈A多生量三|舊小川河,心.貨通刖出的咎由.五兄兄IT心二年字母整字不先聲色力士網.市消這樣設置以后,顯示如下:語言簡體中文所有人中亨富制品集-Fir-.l-Fir-.lM最后為模板添加一個單擊事件,當 pageUrlpageUrl 不為空時,執行打開鏈接的操作最后,最后一項一般是沒有分隔線的,這個可以用到中繼器中的一個變量 isL

7、ast,isLast,就是當前項是不是中繼器中的最后一項,是的話,這個值是 truetrue。因此我們可以單獨為下劃線加入一個載入時的事件(放在模板組合上也可以),這樣最后一項的分隔線就不顯示了。帶圖標的下面在以上的基礎上再實現一個帶圖標的,有了以上基礎,其實就比較簡單了,就是在模板里面添加一個圖片元件。在數據表中增加一列 pic,pic,右鍵從本地引入圖標(推薦從阿里巴巴矢量圖標庫下載 pngpng 圖片)然后在每項加載時”增加一個設置圖片的元件動作即可。由于有些 pngpng 圖片的空白邊距過大,可能導致顯示的圖標大小不一,所以可以先把圖標自己編輯一下。T抵項加載時設置文本選頊名為qtltemnameqtltemname1 1, ,選項文字為PtemopcionlPtemopcionl設置圖片圖插為gEEgEEpitpit最后,中繼器自身還有一些變量如 index:i

溫馨提示

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

評論

0/150

提交評論