Axure網(wǎng)頁怎么制作標簽頁? Axure標簽頁設計方法

在設計移動或后臺難免遇到需要設計類似于如下圖分隔內(nèi)容上有關聯(lián)但屬于不同類別的數(shù)據(jù)集合,及tag標簽頁,這里的設計一般是利用動態(tài)面板,今天我們就來看看axure制作標簽頁的教程。
1、以三個標簽為例,拖動三個矩形框作為標簽1、標簽2、標簽3。設置懸停效果字體為淺藍色,選中效果為字體為淺藍色,線段為淺藍色
2、接著拖動一個矩形作為標簽1要放置的內(nèi)容承載,這里舉例直接寫標簽1了。
3、接著將其轉換成動態(tài)面板
4、雙擊動態(tài)面板,將狀態(tài)1改為標簽1,新增標簽2、標簽3
5、分別進入標簽2、標簽3的狀態(tài),為其狀態(tài)設計要顯示的東西,這里舉例為標簽2、標簽3如圖
6、退出動態(tài)面板并將動態(tài)面板設置為隱藏
7、設置交互事件,以標簽1為例,單擊時顯示動態(tài)面板,狀態(tài)為標簽1,矩形為選中狀態(tài),標簽2、標簽3同理,單擊時顯示動態(tài)面板,狀態(tài)為對應狀態(tài),對應矩形為選中狀態(tài)
8、點擊預覽,標簽頁的選擇效果出來了,但是出現(xiàn)了選中時,其他標簽沒變?yōu)椴贿x中狀態(tài),所以還需利用選項組功能
9、將標簽1、標簽2、標簽3全部選擇,右鍵選擇選項組
10、然后新建選項組,命名后點擊確定
11、此時再點擊預覽,就不會出現(xiàn)選中多個的情況了
以上就是axure制作標簽頁的教程,希望大家喜歡,請繼續(xù)關注腳本之家。
相關推薦:
相關文章
Axure8.0母版怎么應用在頁面上? Axure母版的使用方法
Axure8.0母版怎么應用在頁面上?Axure中設計頁面的時候,想要直接手要你管母版,該怎么使用呢?下面我們就來看看Axure母版的使用方法,需要的朋友可以參考下2018-03-29- axure怎么使用Icons圖標組件設計UI?axure中自帶了很多圖標組件,該怎么直接調用這些組件圖標設計ui呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2018-03-27
- axure怎么設計手機屏幕的滾動條原型?手機中經(jīng)常能見到滾動條,該怎么制作滾動條效果呢?下面我們就來看看axure滾動條的制作方法,需要的朋友可以參考下2018-03-27
- axure怎么設計手機app的側邊欄原型?axure中想要設計原型很簡單,手機app的側邊欄我們經(jīng)常見,想要設計這個原型,該怎么設計呢?下面我們就來看看詳細的教程,需要的朋友可2018-03-27
- axure怎么設計由流程組件組成的UI?axure中有很多組件,想要調用流程組件設計ui,該怎么設計呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2018-03-26
- Axure RP 8怎么設計有漂亮圖標的樹狀菜單?Axure中設計的樹狀菜單為了更美觀,想要添加漂亮的圖標,該怎么添加呢?下面我們就來看看詳細的教程,需要的朋友可以參考下2018-03-19
- Axure動態(tài)面板怎么制作三級菜單?Axure想要設計一個網(wǎng)頁的三級菜單,該怎么設計呢?我們可以使用動態(tài)面板實現(xiàn),下面我們就來看看詳細的教程,需要的朋友可以參考下2018-03-08
AXURE RP 8怎么設置下拉菜單? AXURE下拉菜單的制作方法
AXURE RP 8怎么設置下拉菜單?AXURE RP 8中設計網(wǎng)頁原型的時候,想要制作一個下拉菜單,該怎么制作呢?下面我們就來看看AXURE下拉菜單的制作方法,需要的朋友可以參考下2018-03-05- Axure RP控制列表框怎么設置默認顯示選中值?Axure中制作了列表框,列表框中添加了數(shù)據(jù),想要默認顯示選中數(shù)據(jù),該怎么實現(xiàn)呢?下面我們就來看看詳細的教程,需要的朋友可2018-02-24
- Axure怎么設計基礎信息的頁面?Axure中想要設計一款用戶信息的頁面,該怎么設計呢?下面我們就來看看Axure頁面的詳細設計方法,需要的朋友可以參考下2018-02-08