axure中用一個(gè)中繼器實(shí)現(xiàn)多選樹的效果。比如多級(jí)菜單，該怎么制作呢？下面我們就來看看axure制作三級(jí)菜單的教程。

原型設(shè)計(jì)工具Axure RP Pro 8.1特別版 中文漢化特別版(附漢化包+注冊(cè)碼+安裝教程)

• 類型：輔助設(shè)計(jì)
• 大?。?/span>90.5MB
• 語(yǔ)言：簡(jiǎn)體中文
• 時(shí)間：2018-05-24

查看詳情

1、添加中繼器:在中繼器里放入下拉符號(hào)和多選框

2、設(shè)置中繼器：

type：分1、2、3三個(gè)級(jí)別，1表示一級(jí)（如廣東?。?表示二級(jí)（如廣東省—廣州市），3表示（廣東省-廣州市-海珠區(qū)）。

memu1：表示第一級(jí)菜單

memu2：表示第二級(jí)菜單

memu3：表示第三級(jí)菜單

xiala：1表示有下拉符號(hào)，0表示沒有下拉符號(hào)

see：1表示可見，0表示隱藏

xuan：下拉符號(hào)的方向，0向右，1向下

xuanzhong：1表示選擇，0表示未選中

3、設(shè)置中繼器載入時(shí)交互事件。添加篩選[[Item.see=='1']]：篩選出see為1（可見）的行

4、設(shè)置中繼器每項(xiàng)加載時(shí)交互事件

1）設(shè)置多選框文本和位置

      如果是一級(jí)菜單，設(shè)置多選框文字=memu1

      如果是二級(jí)菜單，設(shè)置多選框文字=memu2，并且移動(dòng)下拉符號(hào)和多選框組合向右移動(dòng)20

      如果是三級(jí)菜單，設(shè)置多選框文字=memu3，并且移動(dòng)下拉符號(hào)和多選框組合向右移動(dòng)40

2）設(shè)置下拉符號(hào)

      如果xiala=0，隱藏下拉符號(hào)。

      如果xuan=0，下拉符號(hào)向右，表示收起下級(jí)菜單

      如果xuan=1，下拉符號(hào)向上，表示打開下級(jí)菜單

3）設(shè)置選中

      如果xuanzhong=1，選中該行多選框。

5、設(shè)置下拉符號(hào)鼠標(biāo)單擊時(shí)事件

如果xuan=0，更新行this，列xuan=1。設(shè)置文本1級(jí)文本標(biāo)簽=memu1，2級(jí)文本標(biāo)簽=memu2，出發(fā)鼠標(biāo)單擊展開按鈕。

如果xuan=1，更新行this，列xuan=0。設(shè)置文本1級(jí)文本標(biāo)簽=memu1，2級(jí)文本標(biāo)簽=memu2，出發(fā)鼠標(biāo)單擊收起按鈕。

6、設(shè)置展開按鈕鼠標(biāo)單擊時(shí)事件

如果2級(jí)文本標(biāo)簽為空，更新行條件[[Item.type=='2'&&Item.memu1==a]]，更新see=1

如果2級(jí)文本不為空。更新行條件，[[Item.type=='3'&&Item.memu1==a&&Item.memu2==b]]，更新see=0

7、設(shè)置收起按鈕鼠標(biāo)單擊時(shí)事件

如果2級(jí)文本標(biāo)簽為空，更新行條件[[Item.type!='1'&&Item.memu1==a]]，更新see=0，xuan=0

如果2級(jí)文本不為空。更新行條件，[[Item.type=='3'&&Item.memu1==a&&Item.memu2==b]]，更新see=0

8、設(shè)置多選框事件

選中時(shí)，更新行this，列選中=1，設(shè)置文本1級(jí)文本標(biāo)簽=memu1，2級(jí)文本標(biāo)簽=memu2，type文本標(biāo)簽=type，觸發(fā)鼠標(biāo)單擊選中按鈕的事件。

取消選中時(shí)，更新行this，列選中=0，設(shè)置文本1級(jí)文本標(biāo)簽=memu1，2級(jí)文本標(biāo)簽=memu2，type文本標(biāo)簽=type，觸發(fā)鼠標(biāo)單擊取消選中按鈕的事件。

9、設(shè)置選中按鈕鼠標(biāo)單擊時(shí)事件

如果type文本標(biāo)簽=1，更新行條件[[Item.memu1==a]]，更新xuanzhong=1。

如果type文本標(biāo)簽=2，更新行條件[[Item.memu1==a&&Item.memu2==b]]，更新xuanzhong=1。

10、設(shè)置取消選中按鈕鼠標(biāo)單擊時(shí)事件

如果type文本標(biāo)簽=1，更新行條件[[Item.memu1==a]]，更新xuanzhong=0。

如果type文本標(biāo)簽=2，更新行條件[[Item.memu1==a&&Item.memu2==b]]，更新xuanzhong=0。更新行條件[[Item.memu1==a&&Item.memu2==''&&Item.memu3=='']]，更新xuanzhong=0

如果type文本標(biāo)簽=3，更新行條件[[Item.memu1==a&&Item.memu2==b&&Item.memu3=='']]，更新xuanzhong=0。更新行條件[[[Item.memu1==a&&Item.memu2==''&&Item.memu3=='']]，更新xuanzhong=0

11、取消選中按鈕、選中按鈕、收起按鈕、展開按鈕、1級(jí)文本標(biāo)簽、2級(jí)文本標(biāo)簽、type文本標(biāo)簽設(shè)置為隱藏。

以上就是axure多級(jí)菜單的制作方法 ，希望大家喜歡，請(qǐng)繼續(xù)關(guān)注腳本之家。

相關(guān)推薦：

Axure動(dòng)態(tài)面板怎么制作三級(jí)菜單?

Axure怎么給網(wǎng)頁(yè)設(shè)計(jì)左側(cè)三級(jí)導(dǎo)航菜單欄? 

Axure怎么設(shè)計(jì)一個(gè)左側(cè)二級(jí)導(dǎo)航切換效果?

最新評(píng)論