【側(cè)邊導(dǎo)航欄一二級(jí)菜單伸縮】是工作中繪制后臺(tái)管理系統(tǒng)時(shí)常用的功能，現(xiàn)將實(shí)現(xiàn)過程分享。首先看看效果：
AxShare鏈接：原型演示
接下來和大家詳細(xì)講解兩種實(shí)現(xiàn)方法，個(gè)人常用?方法1?，實(shí)用、好拓展復(fù)用；?方法2 比較麻煩
方法1： 動(dòng)態(tài)面板+推拉元件
步驟一：拖一個(gè) 動(dòng)態(tài)面板 ；命名為“一級(jí)菜單A”；勾選面板屬性“自動(dòng)調(diào)整為內(nèi)容尺寸”；設(shè)置收起、展開兩個(gè)面板狀態(tài)
步驟二：進(jìn)入 收起 state，拖一個(gè)矩形框；設(shè)置樣式；輸入顯示文字“我是一級(jí)菜單A”；添加交互：鼠標(biāo)單擊時(shí) > 選擇設(shè)置動(dòng)態(tài)面板狀態(tài) > “一級(jí)菜單A”，選擇狀態(tài) Next 向后循環(huán) > 勾選“推動(dòng)/拉動(dòng)元件”，方向“下方” > 確定
步驟三：復(fù)制“我是一級(jí)菜單A”矩形，切換到 展開 state，粘貼；增加幾個(gè)二級(jí)菜單矩形框
完成！多復(fù)制幾個(gè)，排一列，預(yù)覽看看效果吧！
方法2：顯示隱藏+相對位移
步驟一：拖1個(gè)一級(jí)菜單矩形（A）、3個(gè)二級(jí)菜單矩形（A1、A2、A3設(shè)為隱藏），組合為“一級(jí)菜單A”
步驟二：一級(jí)菜單矩形A添加交互，點(diǎn)擊時(shí)切換顯示/隱藏二級(jí)菜單
步驟三：為任一二級(jí)菜單設(shè)置 顯示 時(shí)讓其他一級(jí)菜單組合整體下移，隱藏 時(shí)其他一級(jí)菜單組合整體上移；移動(dòng) > 相對位移
步驟四：（這是比方法1麻煩的點(diǎn)）其他一級(jí)菜單也需要按照上述步驟設(shè)置相對位移，最后排成一列，預(yù)覽看看效果吧
