中繼器是Axure中的一個重難點,掌握中繼器的用法,在Axure原型設(shè)計中,會有很大的幫助。本文為大家詳細解說axure中繼器實現(xiàn)數(shù)據(jù)查詢、修改、判斷功能方法。
中繼器函數(shù)
目前中繼器中提供可以查詢內(nèi)部數(shù)據(jù)的函數(shù)只有「Repeater」,當(dāng)我們使用此函數(shù)時只能獲得以數(shù)組形式排列的整個中繼器內(nèi)的數(shù)據(jù)。例如:
對中繼器使用函數(shù) Repeater.text 時,得到以下數(shù)據(jù)
由此我們得知:中繼器內(nèi)的數(shù)據(jù)是以「數(shù)組」形式儲存的,當(dāng)輸出時,每個數(shù)組之間通過換行符 ‘n’ 連接。
這時候有人會問,為什么不像數(shù)據(jù)庫一樣,直接按照 Repeater [ 0 ] [ 0 ] 類似的形式直接輸出某個字段呢?很抱歉,通過測試發(fā)現(xiàn),目前 Axure 中的函數(shù)是不能識別數(shù)組的,而「Item. 列名」這個函數(shù)也只能直接對中繼器的動作中(例如篩選、更新等)使用,并不能在其他函數(shù)賦值中直接使用。如下圖:
字符串處理
現(xiàn)在我們已經(jīng)知道,通過直接調(diào)用中繼器某個具體字段的方式已經(jīng)破滅了。
回到開始,目前我們外部組件能獲取中繼器數(shù)據(jù)只有「Repeater」一個函數(shù)可以用了,但是它里面的數(shù)據(jù)是整個中繼器的所有數(shù)據(jù),而且還是每個數(shù)據(jù)換行展示的,離我們想要的某個字段差距太遠了,怎么辦呢?
1. 篩選中繼器,獲取指定行內(nèi)容
首先我們做的的是篩選,通過中繼器的篩選功能,將中繼器數(shù)據(jù)指定到我們想要的那一行數(shù)據(jù)中,例如當(dāng)我們想獲得 ID 是 1 的人的姓名時,我們直接對 ID 進行篩選。
此時我們看到,其他沒用行的數(shù)據(jù)已經(jīng)消失了,貌似離我們想要的結(jié)果進了很多。
2. 格式化數(shù)據(jù)
如果想要獲得姓名這個字段,我們需要將得到的數(shù)據(jù)進行格式化,調(diào)整為一行字符串顯示,并且每個字段之間通過「,」隔開。這時候需要用到「split ( ‘separator‘,limit ) 」函數(shù)(返回字符串),第一個參數(shù)是分割字符,此時我們用換行符 ’n‘ 進行分割,第二個字符是分割最長的字符串個數(shù),這里可以省略。
是不是已經(jīng)有點感覺了呢?Axure 提供了那么多的字符串處理函數(shù),如果想獲得 ‘li’ 這個字符串,是不是很簡單呢?
3. 截取字符串
字符串都是以「0」開始排列的,‘li’ 的位置應(yīng)該是從 2 到 3. 那么我們使用「substring ( from,to ) 」函數(shù)(返回字符串),就可以得到這個姓名了。
這時候有人會問,如果姓名字符長度不確定呢?沒問題,我們已經(jīng)知道了每個字符組是通過「,」隔開的,那么我們直接截取第一個 ‘,’ 到第二個 ‘,’ 之間的內(nèi)容就可以了。
怎么找到 ‘,’ 的位置呢?使用「indexOf(‘searchValue’,start)」(返回數(shù)字)函數(shù)就可以了,前面的字段是查找內(nèi)容 ‘,’,后面的字段是字符串開始查找的位置,例如通過
LVAR.substring ( LVAR.indexOf ( ‘,‘ ) ,LVAR.indexOf ( ‘,’, ( LVAR.indexOf ( ‘,‘ ) +1 ) ) )
OH,NO!你已經(jīng)亂了?突然來了一個這么長的,到底是什么東西?那好,我給你分析下:
查找字符串 LVAR 中第一個 ‘,’ 出現(xiàn)的位置,返回數(shù)字。為什么要 +1 呢?因為它的輸出作為前面 LVAR.indexOf(2)的起始查找位置,就是說查找 2 字符串時候,是從它第一個 ‘,’ 后面的一個字符開始查找的。
從字符串 LVAR 第一個 ‘,’ 的后一位開始查找 ‘,’,說白了就是得到字符串 LVAR 第二個 ‘,’ 的位置。
截取字符串 LVAR 從第一個 ‘,’ 出現(xiàn)的位置開始到第二個 ‘,’ 出現(xiàn)的位置。
這下明白了嗎?還要記住一點,就是substring函數(shù)截取的時候,是保留前面的第一個字符,不保留最后面的字符。所以當(dāng)讀取到第一個 ‘,’ 的時候,要從它后面開始截取,一直到第二個 ‘,’ 出現(xiàn)為止。
挑戰(zhàn)升級
不知道還有幾個人能看到這里,因為大部分人可能還是抱著一個失望的態(tài)度,『看了半天你就告訴我怎么截取字符串嗎?老子 800 年前就會了,這跟數(shù)據(jù)庫查的太遠了吧,我怎么能隨便查詢?nèi)我鈪?shù)呢?』
別急,上面都是基礎(chǔ),干貨來了。
需要函數(shù):
Repeater.text 確保中繼器返回的是字符串
split ( “ ) 按照特定分隔符分割字符串
substring ( from,to ) 按照指定位置分割字符串
indexOf ( ) 查找某個字符串在字符串出現(xiàn)位置
concat ( ) 連接字符串
length 獲取字符串長度
場景設(shè)計
學(xué)校有一個【人員管理系統(tǒng)】,系統(tǒng)里包含所有學(xué)生的姓名、學(xué)院、電話、年齡等各種信息。使用者可以通過姓名查詢學(xué)生的任意其他特定信息,也可以修改任意信息。
例如:查詢王剛的班級,查詢鄧爽的電話號碼等。
構(gòu)架分析
由需求得知我們需要查詢指定姓名人員的某項信息,即數(shù)據(jù)庫中特定行中的某項。由上文得知,我們可以通過篩選中繼器方式得到指定行數(shù)據(jù),即指定姓名的所有信息。然后通過切割字符串的方式查找到指定項目的信息。
在整個環(huán)節(jié)中,只有「查找項目字段位置」是個難點,因為項目是不確定的,在輸出后的字符串中,只有按照「,」分割的數(shù)據(jù)內(nèi)容,并不能知道每個數(shù)據(jù)代表著什么,所以如何查找指定項目的位置呢?
這里我們引入了一個類似「列名」的輔助字段,即將所有的數(shù)據(jù)內(nèi)容前面加上一個列名標(biāo)識,例如:
姓名中的數(shù)據(jù)變?yōu)?王剛—— name_ 王剛
班級中的數(shù)據(jù)變?yōu)?通信信息—— class_ 通信信息
手機中的數(shù)據(jù)變?yōu)?23456 —— phone_23456
年齡中的數(shù)據(jù)變?yōu)?22 —— age_22
這樣我們獲得某一行的字符串?dāng)?shù)據(jù)就變化成了:
王剛,通信信息,23456,22 —— name_ 王剛,class_ 通信信息,phone_23456,age_22
看到了嗎?我們得到了一個有標(biāo)識的字符串,相信有些人已經(jīng)想明白了,我們在字符串中通過數(shù)據(jù)前面的標(biāo)識就可以判斷每個數(shù)據(jù)是什么意思了。如果想得到班級,識別 ‘class_’, 如果想得到年齡,識別 ‘a(chǎn)ge_’ 就可以了,無論數(shù)據(jù)有多少項,無論它位置在哪,只要我們指定想要數(shù)據(jù)的標(biāo)識就可以了。
系統(tǒng)搭建
優(yōu)化數(shù)據(jù)表
將原有數(shù)據(jù)按照指定數(shù)據(jù)格式優(yōu)化(關(guān)于在 excel 中為同一列中每項數(shù)據(jù)增加字符的方法有很多),優(yōu)化后添加到中繼器數(shù)據(jù)中。
設(shè)置全局變量
首先設(shè)置一個表示查詢項目的變量「Finder」,通過查詢的項目內(nèi)容為「Finder」賦值。 之后設(shè)置每個查詢項目對應(yīng)的特定前綴,name_、class_ 等。
設(shè)置查詢面板
查詢面板包括姓名文本框,查詢項目列表框,查詢按鈕。
當(dāng)切換查詢項目時,系統(tǒng)將查詢項目賦值給項目變量「Finder」,項目變量默認(rèn)值與查詢項目列表默認(rèn)值相同。
當(dāng)點擊查詢按鈕時,將「姓名」賦值給全局變量「Name」,然后按照「姓名」文本框篩選中繼器數(shù)據(jù),之后按照項目變量「Finder」將具體項目數(shù)值顯示到查詢結(jié)果中。
設(shè)置查詢結(jié)果面板
查詢結(jié)果包括姓名及查詢內(nèi)容結(jié)果,對應(yīng)文本框顯示相應(yīng)信息即可,在此不再贅述。
函數(shù)分析
以下是查詢結(jié)果顯示的函數(shù):
[ [ A2.text.split ( ‘n‘ ) .concat ( ‘,’ ) .substring ( ( A2.text.split ( ‘n‘ ) .indexOf ( Finder ) +Finder.length ) ,A2.text.split ( ‘n’ ) .concat ( ‘,‘ ) .indexOf ( ‘,’, ( A2.text.split ( ‘n‘ ) .indexOf ( Finder ) ) ) ) ] ]
如果上文看懂的人會發(fā)現(xiàn)這里有幾個特殊的地方:
A2.text.split ( ‘n’ ) .concat ( ‘,‘ ) :在重新排列字符串最后加一個 ’,‘,為了防止查找不到最后一個 ’,‘ 而出現(xiàn) bug。
A2.text.split ( ‘n’ ) .indexOf ( Finder ) +Finder.length:因為 Finder 字符串長度的不確定性,切割的起始位置是從「Finder」字符串后開始切割的。
系統(tǒng)優(yōu)化
由于時間原因功能做的比較簡單,但是通過這個方法我們可以查找或修改任意項目的內(nèi)容,比如查找某個學(xué)生的全部信息,按照班級查找某個姓名的學(xué)生等。
評論