Axure實現(xiàn)漢字拼音首字母的查詢
發(fā)布時間:2022-03-17 09:39 [ 我要自學(xué)網(wǎng)原創(chuàng) ] 發(fā)布人: 小劉2175 閱讀: 1438

上圖就是我們要實現(xiàn)的目標(biāo):輸入一個漢字能夠查到它的拼音首字母。

實際上,明白了實現(xiàn)原理之后,通過漢字查拼音、查聲母都是可以實現(xiàn)的。

關(guān)鍵在于有沒有一個能夠使用的源數(shù)據(jù)。

我們先來看看元件的準(zhǔn)備工作。

上面這張圖,大家能夠看到這個案例使用的所有元件。

最關(guān)鍵的就是命名為“PinYin”的這個元件,它的文字包含了所有的文字以及對應(yīng)的拼音首字母。

我們能夠看到源數(shù)據(jù)的格式有一定的規(guī)律:[相同拼音首字母的所有文字][拼音首字母][逗號]……

那么,試想一下,當(dāng)我們輸入一個文字點查詢時:

1、查詢到漢字在源數(shù)據(jù)中出現(xiàn)的位置;

2、從查詢到的位置向后查詢逗號所在的位置;

3、獲取到逗號所在位置前一位的拼音首字母。

完美!

所以,當(dāng)我們準(zhǔn)備好元件(注意將元件“PinYin”縮小尺寸后隱藏),就可以添加交互了。

交互如上圖所示:

查找按鈕“Search”【鼠標(biāo)單擊時】,添加用例與動作:【設(shè)置文字】于元件“Result”為一個公式…

具體公式是什么樣子的呢?

如下圖所示:

公式的完整內(nèi)容是:“漢字的首字母是:[[p.charAt(p.indexOf(\’,\’,p.indexOf(w))-1)]]”。

簡單說明一下:

  • “p”和“w”是兩個局部變量,分別存入了源數(shù)據(jù)和輸入的漢字內(nèi)容;
  • “p.charAt()”能夠獲取指定位置的字符;
  • “p.indexOf(w)”能夠獲取漢字在源數(shù)據(jù)中出現(xiàn)的位置。
  • “p.indexOf(\’,\’,p.indexOf(w))-1”能夠從漢字位置開始向右查找逗號所在的位置,找到的位置減1就是拼音首字母的位置。

這里值得一提的是“indexOf()”這個函數(shù),它能夠由左至右的從一個字符串中查詢參數(shù)字符串出現(xiàn)的位置,它有兩個參數(shù),分別是“被查詢的字符串”和“查詢的起始位置”,如果沒有提供第二個參數(shù)默認(rèn)從最左側(cè)向右查詢。

好了,到這里這個案例就完成了。

希望大家能夠從這個案例中學(xué)習(xí)到有用的知識點。

UI交互app及axure設(shè)計教程
我要自學(xué)網(wǎng)商城 ¥50 元
進(jìn)入購買
文章評論
0 條評論 按熱度排序 按時間排序 /350
添加表情
遵守中華人民共和國的各項道德法規(guī),
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任,
本站有權(quán)保留或刪除有爭議評論。
參與本評論即表明您已經(jīng)閱讀并接受
上述條款。
V
特惠充值
聯(lián)系客服
APP下載
官方微信
返回頂部
分類選擇:
電腦辦公 平面設(shè)計 室內(nèi)設(shè)計 室外設(shè)計 機(jī)械設(shè)計 工業(yè)自動化 影視動畫 程序開發(fā) 網(wǎng)頁設(shè)計 會計課程 興趣成長 AIGC