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

編輯導讀：產品中的菜單伸縮是非常常見的功能，如何通過內聯框架， 實現菜單動態伸縮呢？本文作者用AXURE進行了演示，一起來看看吧。

一、制作原型

拉入四個矩形框型，作為一組主菜單與子菜單，畫出兩組菜單。

主菜單命名為菜單一，下面三個子菜單分別命名為子菜單一，子菜單二，子菜單三。子菜單左側對齊并垂直分布，子菜單組與主菜單居中分布，子菜單合并成組命名為菜單一子菜單；同樣的方式畫出菜單二，將其子菜單合并成組命名為菜單二子菜單。

將子菜單和主菜單合并成組；各個菜單組對齊處理。對菜單進行樣式設計，我這里把主菜單設為藍色填充，白色字體。

對子菜單進行樣式設計，選中子菜單，右擊，選擇交互樣式，鼠標懸停，鼠標按下，選中的時候子菜單填充淺藍色。

將子菜單組設置為隱藏。主菜單按照展示的樣式進行排列。

接下來從元件中拖拽內聯框架，拖到合適大小，并將邊框進行隱藏。

二、添加交互

點擊主菜單一，添加交互，新建交互，選擇（Click or Tap），顯示與隱藏，目標選中子菜單組合，顯示動畫，向下滑動500ms，隱藏動畫，向上滑動500ms，更多選項，選擇推動和拉動原件，下方，線性500ms。

子菜單1設置交互，新建交互，選擇（Click or Tap），框架中打開鏈接，目標選擇內聯框架，鏈接到子菜單1對應的詳細原型頁面。

按照同樣的方式設置其他的子菜單。（子菜單鏈接的具體頁面根據業務需要來，可以提前畫幾個菜單頁面）。

按照同樣的方式設計其他菜單和相應的界面。最后形成的結果如圖。

本文由 @汪仔2268 原創發布于人人都是產品經理，未經作者許可，禁止轉載。

題圖來自Unsplash，基于CC0協議。