- Axure RP案例教程
- 焦計劃編著
- 601字
- 2019-05-21 10:37:22
2.水平菜單導航欄的制作過程
使用Axure RP的文本標簽、形狀、熱區、表格等工具均能實現上述導航效果,下面以使用其菜單元件制作導航為例演示制作方法,具體的步驟如下:
步驟1:啟動Axure RP pro 7.0,新建項目。元件庫面板保持默認,滾動鼠標找到“菜單和表格”分類。拖動一個水平菜單元件到index頁面中,如圖2-5所示。

圖2-5 頁面插入水平菜單元件
步驟2:拖入的水平菜單默認有三個菜單項,選中最后一個菜單項,在元件屬性與樣式區切換到屬性面板,使用“后方添加菜單項”命令,為水平菜單再添加三個菜單項,如圖2-6所示。

圖2-6 添加菜單項
步驟3:雙擊菜單項,將六個菜單項顯示的文本依次修改為“首頁”“學院文化”“開設專業”“招生就業”“校企合作”“校園生活”,如圖2-7所示。

圖2-7 編輯菜單項文本
步驟4:選中“學院文化”菜單項目,在屬性面板中,選擇“添加子菜單”命令,為“學院文化”默認添加包含三個菜單項的子菜單;選中“學院文化”子菜單,在屬性面板中,選擇“后方添加菜單項”命令,為子菜單再添加兩個菜單項,如圖2-8所示。

圖2-8 添加子菜單項
步驟5:選中“首頁”菜單項,在樣式面板中,將其寬度修改為60,如圖2-9所示。

圖2-9 修改菜單項的寬度
步驟6:選中“首頁”菜單項,在交互面板中,點擊“創建連接”命令,選擇“page1”頁面。將菜單項均指向page1,如圖2-10、2-11所示。

圖2-10 為菜單項創建超級鏈接

圖2-11 創建超級鏈接效果
步驟7:保存項目,按F5快捷鍵預覽菜單效果,如圖2-12、2-13所示。

圖2-12 預覽效果

圖2-13 預覽效果
推薦閱讀
- 中文版Photoshop入門與提高(CS6版)
- Word-Excel-PowerPoint 2010三合一從新手到高手(超值版)
- Solid Works 2021產品設計標準教程
- Photoshop CC中文版基礎與實例教程(第7版)
- SOLIDWORKS 2021中文版基礎入門一本通
- 數碼攝影后期處理秘笈:Photoshop CC專業調色(第2版)
- 下一代空間計算:AR與VR創新理論與實踐
- Photoshop數碼攝影后期處理技法從入門到精通
- Java EE 6 with GlassFish 3 Application Server
- Spark Cookbook 中文版
- 3D打印輕松實踐:從材料應用到三維建模
- 新編 中文版Photoshop平面設計入門與提高
- 中文版Maya 2016基礎培訓教程
- Revit技巧精選應用教程
- 零基礎學后期:Lightroom 6-CC數碼照片處理從新手到高手