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

中繼器——Axure中復(fù)雜的元件，沒(méi)有之一。中繼器是Axure中最強(qiáng)大的元件，通常用于頁(yè)面效果展示時(shí)使用。但對(duì)于新手小白來(lái)說(shuō)，這個(gè)元件的使用不是那么的友好，學(xué)習(xí)成本較高……在本文中，將對(duì)中繼器的基礎(chǔ)和簡(jiǎn)單的使用包括數(shù)據(jù)展示、新增、刪除功能的實(shí)現(xiàn)進(jìn)行詳細(xì)講解，希望能幫助你更好的理解中繼器~

目錄：

• 中繼器是什么
• 中繼器什么時(shí)候用
• 怎么使用中繼器（包括各模塊與基本使用流程介紹）
• 基礎(chǔ)應(yīng)用1——表單數(shù)據(jù)集展示
• 基礎(chǔ)應(yīng)用2——PC端表單數(shù)據(jù)新增
• 基礎(chǔ)應(yīng)用3——PC端表單數(shù)據(jù)刪除

中繼器是什么

中繼器（repeater）英文為“重復(fù)”的意思，在Axure中可以理解為重復(fù)的使用同一個(gè)模板，通過(guò)向行列數(shù)據(jù)矩陣中進(jìn)行數(shù)據(jù)處理后展示的小型數(shù)據(jù)庫(kù)。

（由于這個(gè)是原型而不是真的數(shù)據(jù)庫(kù)沒(méi)有進(jìn)行存儲(chǔ)，因此通過(guò)演示處理的數(shù)據(jù)不會(huì)真正的進(jìn)行存儲(chǔ)）

中繼器什么時(shí)候用

在日常文檔與原型說(shuō)明中，由于不需要?jiǎng)討B(tài)演示，進(jìn)行原型說(shuō)明即可，所以較少使用。

在特殊場(chǎng)景，如跟老板演示，需要進(jìn)行頁(yè)面效果展示時(shí)則需要使用該元件。

具體用處：

• 通過(guò)了解中繼器的使用，可以了解數(shù)據(jù)庫(kù)、函數(shù)、變量的基本概念，拓展知識(shí)。
• PC端/移動(dòng)端列表展示統(tǒng)一模板。
• 動(dòng)態(tài)交互包括列表新增、刪除、修改、查詢等，可以通過(guò)動(dòng)態(tài)交互實(shí)現(xiàn)。

怎么使用中繼器

使用模塊介紹：

主要分三個(gè)部分，包括：中繼器、“數(shù)據(jù)庫(kù)”、交互設(shè)置。

1. 中繼器：設(shè)置該模塊的模板樣式；
2. “數(shù)據(jù)庫(kù)”：設(shè)置中繼器中需要展示的數(shù)據(jù)數(shù)量與內(nèi)容；
3. 交互設(shè)置：主要進(jìn)行中繼器與“數(shù)據(jù)庫(kù)”的關(guān)聯(lián)處理等操作。

下圖中包括各模塊位置與對(duì)應(yīng)使用流程順序：

基礎(chǔ)應(yīng)用——表單數(shù)據(jù)集展示

關(guān)聯(lián)數(shù)據(jù)展示為中繼器最簡(jiǎn)單的使用方式，我們先來(lái)看下完成效果。

實(shí)現(xiàn)流程：開始–>在中繼器中繪制模板–>展示表格美化–>對(duì)“數(shù)據(jù)庫(kù)”列數(shù)據(jù)進(jìn)行命名–>數(shù)據(jù)錄入–>關(guān)聯(lián)模板元件與數(shù)據(jù)庫(kù)列數(shù)據(jù)–>完成。

（1）拖入中繼器，進(jìn)入編輯中繼器模板與對(duì)應(yīng)模板命名

設(shè)置中繼器單條數(shù)據(jù)的模板，后續(xù)在“數(shù)據(jù)庫(kù)”中增加多條數(shù)據(jù)都會(huì)應(yīng)用同一個(gè)模板進(jìn)行重復(fù)，對(duì)應(yīng)模板中使用的元件進(jìn)行命名，是為了后續(xù)關(guān)聯(lián)展示數(shù)據(jù)的元件與數(shù)據(jù)庫(kù)的“列”時(shí)方便查找對(duì)應(yīng)元件

Tips：如果有通用的功能，即所有數(shù)據(jù)都有，如刪除、復(fù)選框，可在模板直接放置。（后續(xù)不進(jìn)行關(guān)聯(lián)則所有數(shù)據(jù)都展示）

（2）對(duì)展示表格進(jìn)行美化、對(duì)“數(shù)據(jù)庫(kù)”列數(shù)據(jù)進(jìn)行命名與數(shù)據(jù)錄入

1條數(shù)據(jù)為單條數(shù)據(jù)，多行則為重復(fù)使用多次模板的多條數(shù)據(jù)，如錄入2行則重復(fù)2次模板展示；錄入3行則重復(fù)3次模板展示。

（3）將中繼器模板元件與“數(shù)據(jù)庫(kù)”關(guān)聯(lián)，展示數(shù)據(jù)庫(kù)的數(shù)據(jù)

在交互設(shè)置中，選擇【Onitemload（每項(xiàng)加載時(shí)）】，雙擊進(jìn)入設(shè)置關(guān)聯(lián)內(nèi)容；選擇Set Text（設(shè)置文字），勾選中繼器的模板元件對(duì)應(yīng)設(shè)置為“數(shù)據(jù)庫(kù)”中的對(duì)應(yīng)“列”，具體演示如下圖所示。

以上操作做完后，即可達(dá)到完成效果拉，后續(xù)需要增加數(shù)據(jù)直接在“數(shù)據(jù)庫(kù)”中增加就可以啦~

與PC端表單使用同樣的方法進(jìn)行移動(dòng)端的頁(yè)面繪制：

移動(dòng)端模仿淘寶頁(yè)面進(jìn)行繪制，以下為完成效果。其中商品列表部分是使用中繼器進(jìn)行繪制，繪制的方法與pc端基本相同，下面對(duì)不同點(diǎn)進(jìn)行說(shuō)明。

不同點(diǎn)：圖片導(dǎo)入。

若需要使用圖片，第一步：則在“數(shù)據(jù)庫(kù)”中對(duì)應(yīng)數(shù)據(jù)點(diǎn)擊右鍵選擇【Import Image（導(dǎo)入圖片）import制器最基礎(chǔ)的方便后續(xù)對(duì)數(shù)據(jù)處理的】進(jìn)行本地圖片選擇。

第二步：對(duì)中繼器進(jìn)行交互設(shè)置，選擇【Onitemload（每項(xiàng)加載時(shí)）】，雙擊進(jìn)入設(shè)置關(guān)聯(lián)內(nèi)容；選擇Set image（設(shè)置圖片），勾選中繼器模板中需要展示圖片的元件對(duì)應(yīng)設(shè)置為“數(shù)據(jù)庫(kù)”中的對(duì)應(yīng)“列”后，保存即可，具體演示如下圖所示。

基礎(chǔ)應(yīng)用2——PC端表單數(shù)據(jù)新增

完成效果圖：

實(shí)現(xiàn)流程：開始–>建立中繼器與對(duì)應(yīng)數(shù)據(jù)庫(kù)關(guān)聯(lián)關(guān)系–>繪制新增框–>對(duì)“添加”按鈕設(shè)置交互實(shí)現(xiàn)數(shù)據(jù)庫(kù)賦值–>完成。

（1）建立中繼器與對(duì)應(yīng)數(shù)據(jù)庫(kù)的關(guān)聯(lián)關(guān)系

該部分已經(jīng)在上文【基礎(chǔ)應(yīng)用1——表單數(shù)據(jù)集展示】部分已經(jīng)講過(guò)，這里不再細(xì)說(shuō)。

（2）繪制新增框

使用基礎(chǔ)常用的元件包括輸入框、單選框、文本框等進(jìn)行繪制，并對(duì)填寫文本框、選擇框等進(jìn)行命名（方便后續(xù)進(jìn)行關(guān)聯(lián)時(shí)候查找）。

（3）對(duì)“添加”按鈕設(shè)置交互實(shí)現(xiàn)數(shù)據(jù)庫(kù)賦值

通過(guò)使用局部變量獲取文本框中輸入的內(nèi)容對(duì)數(shù)據(jù)庫(kù)進(jìn)行賦值，具體操作如下圖。

（4）其他操作

以上操作完成后，你已經(jīng)基本掌握了新增列的知識(shí)，但是還不能到達(dá)所展示的完成效果，還需幾點(diǎn)操作。

1）實(shí)現(xiàn)點(diǎn)擊“+添加”彈出新增彈框效果

2）實(shí)現(xiàn)點(diǎn)擊添加關(guān)閉新增彈窗效果

3）序號(hào)：實(shí)現(xiàn)自動(dòng)添加序號(hào)

若要實(shí)現(xiàn)在新增時(shí)，不填寫序號(hào)自動(dòng)添加序號(hào)，則需要在進(jìn)行中繼器與數(shù)據(jù)庫(kù)關(guān)聯(lián)時(shí)關(guān)聯(lián)對(duì)應(yīng)函數(shù)進(jìn)行賦值處理即可。

如下圖：

4）提交時(shí)間：實(shí)現(xiàn)自動(dòng)獲取系統(tǒng)當(dāng)前時(shí)間

要實(shí)現(xiàn)新增時(shí)，不填寫提交時(shí)間自動(dòng)獲取當(dāng)前時(shí)間，實(shí)現(xiàn)方法與【實(shí)現(xiàn)自動(dòng)添加序號(hào)】一樣，都需要關(guān)聯(lián)函數(shù)，具體實(shí)現(xiàn)方式看下圖。

5）單選框賦值：實(shí)現(xiàn)通過(guò)全局變量賦值的方式對(duì)所選的單選進(jìn)行賦值（這部分稍微有點(diǎn)難度）

設(shè)置在選中“是（否）”時(shí)，取消選擇“否（是）”，后將單選框中的文字“是（否）”賦值給全局變量，在對(duì)新增彈框的“添加”按鈕設(shè)置賦值時(shí)賦值對(duì)應(yīng)的全局變量即可。

基礎(chǔ)應(yīng)用3——PC端表單數(shù)據(jù)刪除

完成效果圖：

• 單條刪除實(shí)現(xiàn)流程：開始–>進(jìn)入中繼器–>對(duì)刪除按鈕設(shè)置點(diǎn)擊后刪除行事件–>完成
• 批量刪除實(shí)現(xiàn)流程：開始–>進(jìn)入中繼器–>對(duì)復(fù)選框設(shè)置標(biāo)記事件–>回到頁(yè)面–>對(duì)批量刪除按鈕設(shè)置刪除標(biāo)記行事件–>完成

1）單條刪除：進(jìn)入中繼器后對(duì)刪除按鈕設(shè)置點(diǎn)擊后刪除行事件即可，具體操作見(jiàn)下圖。

2）批量刪除：先對(duì)復(fù)選框設(shè)置標(biāo)記事件，后對(duì)刪除按鈕進(jìn)行刪除標(biāo)記行事件即可，具體操作見(jiàn)下圖：

簡(jiǎn)單的中繼器數(shù)據(jù)集使用也可以提升原型繪制效率喲，簡(jiǎn)單酷炫的新增刪除操作，你學(xué)會(huì)了嗎？

作者：小樹懶，正在努力提升自己的小辣雞，公眾號(hào)：瘋子家的樹懶

本文由 @小樹懶 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載

題圖來(lái)自Unsplash，基于CC0協(xié)議