Axure教程 | 移動端APP原型動效庫【底部導航】

7 評論 27368 瀏覽 68 收藏 3 分鐘

本文給大家分享:在Axure軟件中,如何制作APP原型底部導航。

做好后,可以直接在中繼器列表中修改導航名稱、圖標及跳轉鏈接,還可以在中繼器列表中任意增減導航的個數,兼容2-5個導航。

名詞解釋

動效庫:動態效果元件庫,將常用的動態效果做成元件動效庫,需要時隨時調用。

亮亮原型:專注于APP原型動效庫、Axure原型動效庫、高保真原型設計。

APP底部導航,原型在線地址:http://u.pmdaniu.com/59NY

 

一、功能點

1、可自行設置:1個導航或2個導航……5個導航(最多兼容5個);

2、載入時,根據導航的數量,自動獲取各導航之間的間距;

3、載入時,通過界面名稱,自動選中相應的導航標題。

二、準備工作

1、素材:導航圖標、各個界面所需圖片,下載文件中已包含所有素材;

2、新建【index】、【聊天】等原型中的界面,將手機殼導入【index】界面;

3、新建母版【導航_App】,在母版中拖入一個【中繼器】(Nav,375*50px);

4、在中繼器中拖入一個【動態面板】(List_Nav,75*50px),在動態面板中拖入一張【圖片元件】(Icon_List_Nav,25*25px),拖入一個【文字編輯元件】(Title_List_Nav,75*10px)。

三、實現步驟

1、新建可以在各個界面通用的【導航_APP】:

2、將【導航_APP】拖入各個一級界面:

對于時間比較緊的朋友,可以直接復制去用,無需學習怎么去做。

 

相關閱讀

第1篇:Axure教程 |?移動端APP原型【框架搭建】

第3篇:Axure教程_移動端APP原型【彈框提示語1】

 

作者:亮亮,公眾號:亮亮原型

本文由 @亮亮?原創發布于人人都是產品經理。未經許可,禁止轉載

 

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 步驟沒錯,為啥預覽沒顯示 ??

    來自廣東 回復
  2. 第7步這里,只能加載到一個文字和圖片

    來自福建 回復
  3. 你倒底是有多無聊啊,才好意思寫這種標題。很簡單的一個邏輯,被你搞的像造原子彈一樣。

    來自云南 回復
  4. 想過這個思路但是沒做,太過于復雜了。
    所以做2個,4個下導航的母版和5個下導航的模板來分別使用。
    佩服樓主鉆研Axure功能的精神。??

    來自上海 回復
    1. 開始我做的導航是不夠靈活的,一旦修改就要一個一個去改,很煩。
      后來就用加班時間去升級,一次升級一點,一次升級一點。
      終于有一次大徹大悟,做成這樣了,隨便改,要怎么改,馬上改好。
      我覺得做成這樣之后,修改起來比低保真的效率更高,以后就輕松很多了。

      來自廣東 回復
  5. 哈哈 自如

    來自北京 回復
    1. 自如?

      來自廣東 回復