tft每日頭條

 > 生活

 > axure導航欄怎麼固定在頁面

axure導航欄怎麼固定在頁面

生活 更新时间:2024-09-03 11:14:54

最近在學習Axure的基礎教程,在網上看到了很多例子,整理了一下分享給大家~

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)1

第一種方法

(1)首先在面闆上畫幾個矩形,大小一樣排列好。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)2

(2)把A1、A2、A3設為動态面闆,取名p1;同樣B1、B2、B3;C1、C2、C3分别取名為p2、p3。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)3

(3)給導航欄A設置動作,導航欄對應正确的動态面闆。導航欄B導航欄C同理設置好。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)4

(4)這樣就大功告成了,很簡單的一種方法。

第二種方法

(1)第二種方法不同的地方是導航欄會發生變化,同樣先畫幾個矩形。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)2

(2)把導航欄A、A1、A2、A3設為動态面闆。注意:不單單是下面的子菜單,是整個一塊設為動态面闆。導航欄B、C一樣轉換成動态面闆,分别取名p1、p2、p3。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)6

(3)雙擊p1,面闆狀态管理。把state1改名為展開狀态。在點擊 号按鈕,新添一項,取名為收起狀态。p2,p3同理。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)7

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)8

(4)雙擊打開收起狀态,在面闆中畫一個導航欄A一樣的矩形。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)9

(5)給動态面闆p1設置動作,選擇狀态那裡選擇“Next”。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)10

(6)來看下效果,可以看到導航欄A收起的時候變成收起狀态了。

axure導航欄怎麼固定在頁面(用Axure實現左側動态導航欄)11

2種方法不同的地方是第一種不改變主菜單的樣式,第二種改變樣式。産品小白第一次發帖,如有不足的地方還請各位多多指教。

本文由 @七彩螺旋蒲公英 原創發布于人人都是産品經理。未經許可,禁止轉載

題圖來自Unsplash,基于CC0協議

,

更多精彩资讯请关注tft每日頭條,我们将持续为您更新最新资讯!

查看全部

相关生活资讯推荐

热门生活资讯推荐

网友关注

Copyright 2023-2024 - www.tftnews.com All Rights Reserved