axure怎么設(shè)計菜單橫向隱藏與顯示的效果?

發(fā)布時間：2017-04-23 16:17:22 作者：佚名

axure怎么隱藏菜單橫向隱藏與顯示的效果？今天想要和大家分享一些關(guān)于axure顯示隱藏效果的實現(xiàn)方法，我們就以隱藏菜單為例，需要的朋友可以參考下

最近有若干個伙伴找我咨詢axure的用法，讓我這顆涼了許久的心又再次感受到一點溫度，也忽然意識到，凡事堅持不懈的做下去，總會有收獲的，所以，本人近期將持續(xù)更新一些常用的小技巧，以便廣大還在摸索axure的朋友使用。本次將以講解如何做出滿意的隱藏菜單橫向隱藏與顯示的效果。

Axure RP Pro(快速原型設(shè)計工具) V8.0.0.3333 綠色英文免費版

類型：應(yīng)用其它
大小：48.2MB
語言：英文軟件
時間：2017-04-10

查看詳情

1、在做菜單動態(tài)效果之前，諸位應(yīng)該首先需要知道，我們需要什么組件，以最簡單的樣式來說，首先我們需要一個菜單的動態(tài)面板，一個菜單的顯示按鈕，一個菜單的隱藏按鈕，若需要，還可增加一個菜單的具體頁面。

2、菜單與圖片的顯示，要按照自己的要求來設(shè)定，比如若想要進入頁面后，頁面的菜單是顯示狀態(tài)的，則菜單與菜單隱藏按鈕直接顯示出來，菜單的顯示按鈕隱藏掉即可，反之，則要隱藏掉菜單與菜單隱藏按鈕，直接顯示出菜單顯示按鈕，此外將菜單的顯示/隱藏按鈕做成動態(tài)面板，通過點擊來回切換，也是可行的。

3、設(shè)置好需要隱藏的菜單后，將隱藏與顯示按鈕位置重合覆蓋掉后平移至需要的位置，比如x軸為0的位置后即可，此時需要開始添加動態(tài)事件。

4、動態(tài)效果需要對兩個按鈕分別添加，對隱藏按鈕來說，需要添加點擊后，可將菜單隱藏掉，可將自己隱藏掉，同事還可顯示出菜單顯示按鈕的動態(tài)事件；對顯示按鈕來說，效果基本都是反向的，具體如圖所示

5、最終效果如下，可通過點擊實現(xiàn)菜單向左隱藏，向右顯示的效果。

6、菜單顯示隱藏的效果需要視情況而定，比如網(wǎng)頁版，像360導航首頁，右側(cè)本身有留白區(qū)域，菜單的隱藏顯示基本與主頁面無關(guān)，但本人經(jīng)歷過的OA、CRM等辦公系統(tǒng)，在設(shè)計菜單隱藏顯示效果時一般都會要求頁面內(nèi)容與菜單隱藏顯示效果一起移動，這點應(yīng)該在對應(yīng)的系統(tǒng)設(shè)計中，按要求實現(xiàn)。