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

編輯導(dǎo)語：點(diǎn)擊「菜單」時(shí)自動(dòng)生成「標(biāo)簽頁/面包屑」，并打開「對(duì)應(yīng)頁面」；刪除「標(biāo)簽頁/面包屑」，頁面關(guān)閉并定位到最近「標(biāo)簽頁/面包屑」，打開「對(duì)應(yīng)頁面」。如何完成這種效果呢？本文作者分享了用Axure自動(dòng)生成標(biāo)簽頁/面包屑的詳細(xì)教程，一起來看一下吧。

下載演示地址：

https://pan.baidu.com/s/1z_5GGwiS0qhjG7owPft5_Q（提取碼：c36r）

教程大綱：

1. 完成整體布局
2. 制作菜單區(qū)交互
3. 制作標(biāo)簽區(qū)交互
4. 聯(lián)動(dòng)菜單區(qū)和標(biāo)簽區(qū)
5. 設(shè)置點(diǎn)擊打開頁面
6. 待優(yōu)化思考中

01 完成整體布局

創(chuàng)建1個(gè)主頁面（命名“主頁面”），3個(gè)子頁面（分別命名“菜單1”、“菜單2”、“菜單3”）

使用元件：矩形、內(nèi)聯(lián)框架、中繼器、白色取消icon、黑色取消icon（icon下載地址：https://www.iconfont.cn/）

在【主頁面】按照下圖完成整體布局，如下圖：

02 制作菜單交互

右鍵選中【菜單1】- 選中【交互樣式…】- 點(diǎn)擊【選中】，設(shè)置“字體顏色”為白色、“填充顏色”為“666666”，如下圖：

點(diǎn)擊【菜單1】設(shè)置“鼠標(biāo)單擊時(shí)”用例，如下圖：

點(diǎn)擊【菜單1】設(shè)置選項(xiàng)組，選項(xiàng)組命名“menu”，如下圖：

【菜單2】和【菜單3】重復(fù)上述步驟

點(diǎn)擊【菜單1】設(shè)置為“選中狀態(tài)”，如下圖：

03 制作標(biāo)簽交互

雙擊打開【中繼器】，復(fù)制【黑色icon】放置到中繼器，如下圖：

右鍵點(diǎn)擊【黑色icon】- 選中【交互樣式…】- 點(diǎn)擊【選中】，設(shè)置【圖片】并導(dǎo)入【白色icon】，如下圖：

選中【黑色icon】設(shè)置選項(xiàng)組，選項(xiàng)組命名“del”，默認(rèn)“選中”，如下圖：

選中【黑色icon】設(shè)置“鼠標(biāo)單擊時(shí)”用例，如下圖：

右鍵點(diǎn)擊【矩形】- 選中【交互樣式…】- 點(diǎn)擊【選中】，設(shè)置“字體顏色”為白色、“填充顏色”為“666666”（參考【菜單1】設(shè)置）

點(diǎn)擊【矩形】設(shè)置選項(xiàng)組，選項(xiàng)組命名為“l(fā)abel”，默認(rèn)“選中”（參考【黑色icon】設(shè)置）

點(diǎn)擊【矩形】設(shè)置“鼠標(biāo)單擊時(shí)”用例，如下圖：

返回【主頁面】，點(diǎn)擊【中繼器】，添加1行1列（雙擊重命名“title”和“page”），并取消“隔離單選按鈕效果”和“隔離選項(xiàng)組”效果，如下圖：

點(diǎn)擊【中繼器】設(shè)置樣式，設(shè)置布局“水平”、間距列“10”，如下圖：

04 菜單區(qū)和標(biāo)簽區(qū)聯(lián)動(dòng)

點(diǎn)擊【菜單1】設(shè)置“鼠標(biāo)單擊時(shí)”用例，如下圖：

【菜單2】和【菜單3】與重復(fù)上述【菜單1】步驟，添加“鼠標(biāo)單擊時(shí)”用例

點(diǎn)擊【中繼器】刪除1行，設(shè)置第1行（title為“菜單1”、page為“菜單1.html”），如下圖：

05 設(shè)置點(diǎn)擊打開頁面

分別打開【子頁面-菜單1】、【子頁面-菜單2】、【子頁面-菜單3】，放入不同的元件，以便對(duì)于打開頁面做出區(qū)分，如下圖：

返回【主頁面】，雙擊【中繼器】打開中繼器頁面，點(diǎn)擊矩形，設(shè)置“選中時(shí)”用例，如下圖：

點(diǎn)擊【內(nèi)聯(lián)框架】設(shè)置“載入時(shí)”用例，默認(rèn)打開“菜單1”，如下圖：

點(diǎn)擊【主頁面】進(jìn)行效果預(yù)覽。

06 待優(yōu)化思考中…

多次點(diǎn)擊菜單后，導(dǎo)致標(biāo)簽區(qū)超長，解決方案：將標(biāo)簽區(qū)轉(zhuǎn)換為動(dòng)態(tài)面板。

加入動(dòng)態(tài)面板，新的標(biāo)簽頁被隱藏，想要實(shí)現(xiàn)菜單縮小，并左移效果。解決方案：真的很麻煩，建議算了吧。

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

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