【側(cè)邊導(dǎo)航欄一二級菜單伸縮】是工作中繪制后臺管理系統(tǒng)時常用的功能劳较，現(xiàn)將實現(xiàn)過程分享。首先看看效果：
AxShare鏈接：原型演示
帶有伸縮功能的側(cè)邊垂直導(dǎo)航欄
接下來和大家詳細(xì)講解兩種實現(xiàn)方法齿诞，個人常用?方法1?咖杂，實用宫静、好拓展復(fù)用；?方法2 比較麻煩
方法1： 動態(tài)面板+推拉元件
步驟一：拖一個 動態(tài)面板 柿究；命名為“一級菜單A”邮旷；勾選面板屬性“自動調(diào)整為內(nèi)容尺寸”；設(shè)置收起蝇摸、展開兩個面板狀態(tài)
注意勾選自動調(diào)整為內(nèi)容尺寸
切換面板狀態(tài)
步驟二：進(jìn)入 收起 state婶肩，拖一個矩形框；設(shè)置樣式貌夕；輸入顯示文字“我是一級菜單A”律歼；添加交互：鼠標(biāo)單擊時 > 選擇設(shè)置動態(tài)面板狀態(tài) > “一級菜單A”，選擇狀態(tài) Next 向后循環(huán) > 勾選“推動/拉動元件”啡专，方向“下方” > 確定
收起狀態(tài)交互用例
步驟三：復(fù)制“我是一級菜單A”矩形险毁，切換到 展開 state，粘貼们童；增加幾個二級菜單矩形框
展開狀態(tài)交互用例
完成畔况！多復(fù)制幾個，排一列慧库，預(yù)覽看看效果吧跷跪！
方法2：顯示隱藏+相對位移
步驟一：拖1個一級菜單矩形（A）、3個二級菜單矩形（A1齐板、A2吵瞻、A3設(shè)為隱藏）葛菇，組合為“一級菜單A”
組合菜單
步驟二：一級菜單矩形A添加交互，點擊時切換顯示/隱藏二級菜單
切換可見性
步驟三：為任一二級菜單設(shè)置 顯示 時讓其他一級菜單組合整體下移橡羞，隱藏 時其他一級菜單組合整體上移熟呛；移動 > 相對位移
相對位移
步驟四：（這是比方法1麻煩的點）其他一級菜單也需要按照上述步驟設(shè)置相對位移，最后排成一列尉姨，預(yù)覽看看效果吧
