編輯導(dǎo)語(yǔ)：標(biāo)簽導(dǎo)航欄是常見(jiàn)的產(chǎn)品動(dòng)效，如何用Axure8進(jìn)行制作呢？本文作者對(duì)此做了展示，一起來(lái)看看吧。

本次分享的的案例是Axure8.0制作的標(biāo)簽導(dǎo)航欄。

預(yù)覽及下載地址：https://40074m.axshare.com

一、制作原型

1）用兩個(gè)矩形制作一個(gè)LOGO和導(dǎo)航菜單，如圖：

2）用兩個(gè)矩形制作兩個(gè)菜單，如圖：

3）用中繼器制作菜單，如圖：

點(diǎn)擊中繼器進(jìn)入，用一個(gè)矩形制作左側(cè)菜單，如圖：

4）用一個(gè)矩形制作首頁(yè)標(biāo)簽，如圖：

5）用中繼器制作一個(gè)標(biāo)簽菜單，如圖：

點(diǎn)擊中繼器進(jìn)入，制作左側(cè)菜單以及關(guān)閉按鈕,如圖：

6）制作一個(gè)動(dòng)態(tài)面板用來(lái)切換頁(yè)面，如圖：

7）制作一個(gè)框架，選擇框架目標(biāo)為首頁(yè)。

二、交互設(shè)置

1）對(duì)菜單中繼器進(jìn)行“每項(xiàng)加載時(shí)”事件設(shè)置，如圖：

點(diǎn)擊中繼器進(jìn)入，對(duì)數(shù)據(jù)菜單進(jìn)行“鼠標(biāo)點(diǎn)擊時(shí)”、“選中時(shí)”以及“取消選中時(shí)”事件進(jìn)行設(shè)置。

2）點(diǎn)擊“首頁(yè)”標(biāo)簽，對(duì)其進(jìn)行”鼠標(biāo)點(diǎn)擊時(shí)”事件設(shè)置。

3）對(duì)標(biāo)簽中繼器進(jìn)行“每項(xiàng)加載時(shí)”事件進(jìn)行設(shè)置。

點(diǎn)擊中繼器進(jìn)入，對(duì)“菜單標(biāo)簽”進(jìn)行“鼠標(biāo)點(diǎn)擊時(shí)”和“選中時(shí)“事件設(shè)置。

對(duì)關(guān)閉按鈕進(jìn)行”鼠標(biāo)點(diǎn)擊時(shí)“事件設(shè)置。

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

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