中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

在Axure中，中繼器可以與自建部件庫搭配著來使用，中繼器的優(yōu)點(diǎn)是可以添加交互事件來實(shí)現(xiàn)想要的動(dòng)效，缺點(diǎn)則是制作起來相對(duì)復(fù)雜。自建部件庫則能很好的解決這個(gè)缺點(diǎn)，因?yàn)榭梢詫⑻砑恿私换ナ录闹欣^器制作成自建部件，這樣就只需要復(fù)雜一次，以后在需要使用的時(shí)候就可以直接引用。

本文主要分為以下四部分，中繼器案例、中繼器是什么、中繼器的基本構(gòu)成以及中繼器的案例實(shí)踐。

中繼器案例

中繼器是Axure中相對(duì)而言比較復(fù)雜的元件，上手難度相對(duì)較高，但是中繼器的功能也是比較強(qiáng)大的，除了可以直接進(jìn)行復(fù)用和數(shù)據(jù)的批量操作，還可以對(duì)數(shù)據(jù)進(jìn)行增加、刪除、篩選、修改等操作，掌握了中繼器之后，能夠做出很多我們常見的一些動(dòng)效，先簡(jiǎn)單的看幾個(gè)利用中繼器做出來的效果。

簡(jiǎn)單列表頁

下圖是利用中繼器做出來的一個(gè)列表頁，列表頁在App中使用的情況非常多，比如圖文列表（常見于各種App，如微信聊天列表、今日頭條列表、商品列表等）、文字列表（個(gè)人信息、地址、商品詳情）、二級(jí)列表菜單等。

利用中繼器制作列表頁之后，可以將中繼器做成自建部件，這樣在進(jìn)行列表頁創(chuàng)建的時(shí)候就能夠直接拿來復(fù)用，另外利用中繼器創(chuàng)建的列表頁也無需進(jìn)行重復(fù)排版，直接在中繼器里修改數(shù)據(jù)即可。

添加與刪除數(shù)據(jù)

下圖為一個(gè)數(shù)據(jù)列表的添加與刪除數(shù)據(jù)效果圖，在實(shí)際的使用中可能是某一列表的添加與刪除，比如用戶信息的添加與刪除、比如外賣的地址信息的添加與刪除等，除了純文本的添加與刪除，中繼器也能夠?qū)崿F(xiàn)圖文列表的添加與刪除。

排序與篩選

下圖為簡(jiǎn)單的排序與篩選效果，Axure中繼器中支持日期、數(shù)字和文本的排序，篩選則需要使用函數(shù)，利用中繼器可以實(shí)現(xiàn)條件篩選的效果，比如在App中通過距離、價(jià)格、銷量等數(shù)據(jù)來進(jìn)行篩選。

分頁與頁面跳轉(zhuǎn)

分頁與切換是將列表頁進(jìn)行分頁設(shè)置每頁顯示的數(shù)據(jù)量，然后進(jìn)行上一頁、下一頁、首頁、尾頁等這些頁面之間的跳轉(zhuǎn)操作。

動(dòng)態(tài)搜索

動(dòng)態(tài)搜索在一些搜索的頁面用到的比較多，比如各種搜索框中都會(huì)通過關(guān)鍵字的匹配來實(shí)現(xiàn)動(dòng)態(tài)的搜索，從而減少用戶的輸入，以達(dá)到更好的用戶體驗(yàn)，在Axure中就可以利用中繼器實(shí)現(xiàn)這樣的效果。

看完中繼器的可以實(shí)現(xiàn)的一些動(dòng)效之后，有沒有躍躍欲試，想直接嘗試的小伙伴可以直接跳到文章的中繼器案例實(shí)踐部分，接下來會(huì)先介紹一下中繼器相關(guān)的知識(shí)，最后才是中繼器案例實(shí)踐。

中繼器是什么

中繼器（英文名Repeater）是Axure RP 7.0推出的新功能，中繼器相當(dāng)于程序開發(fā)中的小型數(shù)據(jù)庫，用于存放同種結(jié)構(gòu)的數(shù)據(jù)，可對(duì)其中的數(shù)據(jù)進(jìn)行刪除，增加與更新，以及根據(jù)設(shè)定好的條件對(duì)呈現(xiàn)的數(shù)據(jù)組進(jìn)行過濾等操作，學(xué)習(xí)它的使用有助于我們快速設(shè)計(jì)一些復(fù)雜的交互界面。

中繼器在Axure的默認(rèn)部件庫里，拖入到操作區(qū)中之后顯示的是一個(gè)簡(jiǎn)單3行表格，在中繼器外部無法對(duì)中繼器進(jìn)行操作，雙擊后進(jìn)入中繼器內(nèi)部進(jìn)行操作，中繼器內(nèi)部的一個(gè)部件對(duì)應(yīng)著外部元件的一個(gè)縱列，對(duì)單一部件進(jìn)行修改，則會(huì)在中繼器外部的整個(gè)縱列產(chǎn)生修改。

中繼器的基本構(gòu)成

中繼器主要分為數(shù)據(jù)集、交互、樣式三大部分

數(shù)據(jù)集

數(shù)據(jù)集是中繼器的數(shù)據(jù)來源，可以通過在數(shù)據(jù)集中添加數(shù)據(jù)，然后將數(shù)據(jù)賦值給中繼器的具體元件來實(shí)現(xiàn)賦值的效果，如果需要在中繼器中添加圖像，點(diǎn)擊右鍵選擇【導(dǎo)入圖像】即可。如下圖所示，最上面是數(shù)據(jù)列的名稱，只支持英文命名，中間的部分是中繼器的數(shù)據(jù)，兩側(cè)分別是新增列與新增行。

一個(gè)元件的數(shù)據(jù)值會(huì)對(duì)應(yīng)中繼器數(shù)據(jù)集中一列的數(shù)據(jù)，所以在命名的時(shí)候，最好將元件的名稱與中繼器數(shù)據(jù)集中的列的名稱保持一致，這樣在進(jìn)行賦值的時(shí)候會(huì)比較方便，在上圖中可以看到我在對(duì)元件進(jìn)行命名的時(shí)候，元件的名稱與中繼器數(shù)據(jù)集的列名稱是保持一致的。

交互

1. 數(shù)據(jù)賦值

在中繼器的數(shù)據(jù)集中添加的數(shù)據(jù)，是不會(huì)自動(dòng)填充到中繼器里的，需要在中繼器中添加交互之后，才會(huì)將數(shù)據(jù)集中數(shù)據(jù)賦值給具體的元件。具體賦值操作如下，在中繼器交互中的【每項(xiàng)加載時(shí)】添加用例，然后將中繼器中數(shù)據(jù)列的值，賦給具體的元件。

在【步驟1】中進(jìn)行文本的設(shè)置，如果是設(shè)置圖像，則選擇設(shè)置圖像即可，如果說需要將文本進(jìn)行其他的處理，比如字體、顏色等進(jìn)行變更，則將【步驟4】中的值更換為富文本即可。

賦值后的結(jié)果如下圖所示，其中【刪除】操作是富文本，標(biāo)題為單獨(dú)的元件，下方的紅線區(qū)域?yàn)橹欣^器部分。

2. 添加交互

在中繼器中主要的交互分為兩大塊，一塊是針對(duì)中繼器整體的，一塊是關(guān)于數(shù)據(jù)集的，見下圖 ：

可以看到在關(guān)于中繼器的部分中，有著排序、過濾、分頁這些功能，在關(guān)于中繼器中有著新增、標(biāo)記、取消標(biāo)記、更新、刪除行這些操作，相對(duì)來說這些操作比較簡(jiǎn)單，稍微摸索一下就能夠掌握，就不贅述了。

3. 樣式

中繼器的樣式主要分為布局、背景、分頁、間距這些功能，布局就是選擇列表的縱向和橫向排列，以及每一列顯示幾個(gè)數(shù)據(jù)即換行，分頁功能則是將數(shù)據(jù)集中的數(shù)據(jù)進(jìn)行分頁展示。例如數(shù)據(jù)集中有30行數(shù)據(jù)，設(shè)置每頁顯示3個(gè)，則能夠顯示10頁，稍微摸索一下就能夠掌握，不贅述。

中繼器案例實(shí)踐

簡(jiǎn)單列表頁

先在中繼器中選擇需要賦值的元件，將元件的名稱修改為自定義的名稱，然后在中繼器的數(shù)據(jù)集中添加需要的數(shù)據(jù)

添加完數(shù)據(jù)之后，將數(shù)據(jù)集中的數(shù)據(jù)賦值給相應(yīng)的元件

最后實(shí)現(xiàn)的效果如下：

添加與刪除數(shù)據(jù)

在添加與刪除數(shù)據(jù)中首先需要對(duì)中繼器進(jìn)行賦值，前文已講述，不贅述，將中繼器賦值完之后，需要將個(gè)文本輸入框的值與中繼器中對(duì)應(yīng)的列的數(shù)據(jù)進(jìn)行綁定，然后在【添加】按鈕上添加交互事件“新增行到中繼器”，具體如下操作。

首先將輸入信息的輸入框進(jìn)行命名，并且在中繼器的【每項(xiàng)加載時(shí)】里添加交互事件：

然后是將每個(gè)輸入框的值與中繼器中的列的值進(jìn)行綁定，與中繼器的賦值非常相似，將輸入框的值賦值給中繼器的數(shù)據(jù)集：

最后在【添加】按鈕上新增交互事件，“點(diǎn)擊新增行至中繼器”，刪除操作需要在中繼器的內(nèi)部添加交互事件，添加“刪除行從中繼器”。

排序與篩選

排序與篩選都是在中繼器數(shù)據(jù)集添加好數(shù)據(jù)的基礎(chǔ)上的，選擇新增排序和篩選規(guī)則即可，至于重置，選擇移除排序或者篩選即可。

分頁與頁面跳轉(zhuǎn)

在按鈕上添加交互事件，然后在中繼器的交互中添加分頁的設(shè)置即可實(shí)現(xiàn)中繼器的分頁效果，移除分頁之后，中繼器的顯示的內(nèi)容就會(huì)恢復(fù)至原狀，在不同的按鈕上設(shè)置跳轉(zhuǎn)至不同的中繼器的頁數(shù)，就可以實(shí)現(xiàn)切換的效果。

動(dòng)態(tài)搜索

動(dòng)態(tài)搜索相對(duì)而言會(huì)復(fù)雜一點(diǎn)，因?yàn)閯?dòng)態(tài)搜索用到了中繼器中的一些函數(shù)，首先在中繼器中填充相應(yīng)的數(shù)據(jù)，然后將中繼器轉(zhuǎn)化為動(dòng)態(tài)面板，并且將它進(jìn)行隱藏，之后是在輸入框中添加交互事件“當(dāng)文字長(zhǎng)度改變時(shí)”觸發(fā)交互事件：

當(dāng)觸發(fā)交互事件時(shí)，進(jìn)行條件判斷：

如果輸入框內(nèi)的文字長(zhǎng)度大于等于1時(shí)，則新增過濾器：

新增局部變量，在數(shù)據(jù)集中截取0到輸入框內(nèi)輸入的文字長(zhǎng)度的數(shù)據(jù)，如果截取的數(shù)據(jù)值與文本輸入框中輸入的值相等，則顯示隱藏狀態(tài)下的中繼器：

如果截取的值與文本輸入框的值不相等，則隱藏中繼器。

以上就是最近關(guān)于中繼器使用的一些心得體會(huì)，還有很多中繼器的函數(shù)并不會(huì)使用，還有一些功能掌握的也不全面，望諸位不要見笑，歡迎斧正、指點(diǎn)、拍磚…

文中涉及的案例RP文件下載

作者鏈接：http://pan.baidu.com/s/1nv2KkVR

官方鏈接：http://pan.baidu.com/s/1dF1EAC5 密碼: 3b8d

關(guān)于我：王家郴，喜歡網(wǎng)球和騎行的產(chǎn)品汪。公眾號(hào)：產(chǎn)品經(jīng)理從0到1，每周都會(huì)在公眾號(hào)上寫點(diǎn)東西，歡迎關(guān)注,求指教、求分享、求交流。目前奔走在產(chǎn)品的道路上，漫漫產(chǎn)品路，與君共勉。

本文系起點(diǎn)學(xué)院廣州1509期優(yōu)秀學(xué)員@王家郴 原創(chuàng)發(fā)布，未經(jīng)作者許可，禁止轉(zhuǎn)載。