Axure RP怎么制作選項(xiàng)卡控件?
我要評(píng)論Axure RP工具中的既有元件庫(kù)中沒(méi)有現(xiàn)成的選項(xiàng)卡控件，該怎么自己制作選項(xiàng)卡控件呢？下面我們就來(lái)看看詳細(xì)的教程。
原型設(shè)計(jì)工具Axure RP Pro 8.1特別版 中文漢化特別版(附漢化包+注冊(cè)碼+安裝教程)
- 類型：輔助設(shè)計(jì)
- 大小：90.5MB
- 語(yǔ)言：簡(jiǎn)體中文
- 時(shí)間：2018-05-24
1、先正常打開(kāi)Axure RP工具，然后新建一個(gè)空白頁(yè)面。
2、本經(jīng)驗(yàn)以“我的任務(wù)”為例進(jìn)行說(shuō)明，在“我的任務(wù)”功能模塊設(shè)計(jì)中一般包含“待辦任務(wù)”，“完成任務(wù)”和“我發(fā)起的任務(wù)”三個(gè)選項(xiàng)，所以先拖拽3個(gè)矩形框到空白頁(yè)面中，再加入一個(gè)動(dòng)態(tài)面板，如下所示。
3、當(dāng)選中某個(gè)選項(xiàng)的時(shí)候，設(shè)置不同的背景色。先選中第一個(gè)選擇框，在右側(cè)的屬性對(duì)話框中，找到“交互樣式設(shè)置”，如下圖1所示，單擊“選中”，在彈出的對(duì)話框中設(shè)置填充顏色，如下圖2所示。
4、針對(duì)第二個(gè)選項(xiàng)卡和第三個(gè)選項(xiàng)卡進(jìn)行第三步同樣的操作，配置后的效果如下圖所示。
5、雙擊動(dòng)態(tài)面板，在彈出的對(duì)話框中添加3種面板狀態(tài)，分別表示3個(gè)不同的選項(xiàng)切換時(shí)展示不同的內(nèi)容，如下圖所示。
6、將3個(gè)選項(xiàng)卡加入到同一個(gè)組，這樣在選中的時(shí)候可以實(shí)現(xiàn)互斥的效果。選中第一個(gè)矩形框，在右側(cè)的屬性中找到“設(shè)置選項(xiàng)組名稱”，然后在下方我文本框中輸入一個(gè)名稱。同樣的對(duì)第二個(gè)和第三個(gè)矩形框進(jìn)行操作。如下圖所示。
7、指定一個(gè)矩形框?yàn)槟J(rèn)選中狀態(tài)。選中要指定為默認(rèn)選中狀態(tài)的矩形框，然后在右側(cè)屬性中找到如下截圖中標(biāo)紅的“選中”后，將其前面的復(fù)選框選中。
8、添加鼠標(biāo)單擊事件，當(dāng)鼠標(biāo)單擊是切換選中項(xiàng)，更新動(dòng)態(tài)面板的內(nèi)容。
9、為第二個(gè)矩形框和第三個(gè)矩形框進(jìn)行第八步的設(shè)置動(dòng)作，這時(shí)候預(yù)覽效果，就可以預(yù)覽選項(xiàng)卡控件了。
以上就是Axure RP中制作選項(xiàng)卡控件的教程，希望大家喜歡，請(qǐng)繼續(xù)關(guān)注腳本之家。
相關(guān)推薦：
Axure RP 8怎么設(shè)計(jì)出自適應(yīng)頁(yè)面的元件?
相關(guān)文章
Axure rp怎么設(shè)計(jì)微信的交互界面？Axure中想要設(shè)計(jì)一個(gè)網(wǎng)頁(yè)交互的效果，該怎么制作呢？下面我們就來(lái)看看Axure設(shè)計(jì)微信交互界面的教程，需要的朋友可以參考下2017-12-17
axure頁(yè)面載入時(shí)自動(dòng)選中按鈕該怎么實(shí)現(xiàn)?
axure頁(yè)面載入時(shí)自動(dòng)選中按鈕該怎么實(shí)現(xiàn)？axure中使用母版的時(shí)候想要實(shí)現(xiàn)單個(gè)頁(yè)面按鈕的添加選中狀態(tài)，我們可以使用函數(shù)來(lái)實(shí)現(xiàn)，下面我們就來(lái)看看詳細(xì)的教程，需要的朋友可2017-12-05
Axure母版怎么使用? Axure母版功能詳細(xì)介紹
Axure母版怎么使用？Axure一般都會(huì)創(chuàng)建母版，但是母版有什么功能，該怎么使用呢？下面我們就來(lái)看看Axure母版功能詳細(xì)介紹，需要的朋友可以參考下2017-11-30
Axure文本輸入框怎么去掉邊框? Axure隱藏輸入框邊框的教程
Axure文本輸入框怎么去掉邊框？Axure設(shè)計(jì)網(wǎng)頁(yè)原型的時(shí)候，插入了文本輸入框，但是有邊框，想要去掉邊框，該怎么操作呢？下面我們就來(lái)看看Axure隱藏輸入框邊框的教程，需要2017-11-17
Axure怎么設(shè)計(jì)頁(yè)面標(biāo)簽可以切換的登錄框?
Axure怎么設(shè)計(jì)頁(yè)面標(biāo)簽可以切換的登錄框？Axure中在設(shè)計(jì)登陸框的時(shí)候，想要設(shè)計(jì)企業(yè)會(huì)員和個(gè)人會(huì)員兩個(gè)登陸頁(yè)面，可以使用標(biāo)簽切換，該怎么設(shè)計(jì)呢？下面我們就來(lái)看看詳細(xì)的2017-11-08
Axure RP 8怎么設(shè)計(jì)立體的圓角矩形按鈕?
Axure RP 8怎么設(shè)計(jì)立體的圓角矩形按鈕？Axure RP 8中想要設(shè)計(jì)一個(gè)查詢的圓角矩形按鈕，該怎么設(shè)計(jì)呢？下面我們就來(lái)看看詳細(xì)的教程，需要的朋友可以參考下2017-11-02
axure怎么設(shè)計(jì)鼠標(biāo)展開(kāi)折疊效果?
axure怎么設(shè)計(jì)鼠標(biāo)展開(kāi)折疊效果？axure中想要繪制一個(gè)可以折疊展開(kāi)功能的原型，該怎么設(shè)計(jì)呢？下面我們就來(lái)看看axure制作折疊效果的教程，需要的朋友可以參考下2017-11-01
Axure怎么給圖片增加點(diǎn)擊事件？Axure中想要給圖片添加鼠標(biāo)單擊事件，如果鼠標(biāo)單擊圖片返回主頁(yè)，該怎么實(shí)現(xiàn)這個(gè)效果呢？下面我們就來(lái)看看詳細(xì)的教程，需要的朋友可以參考下2017-11-01
axure怎么調(diào)整字間距? axure字間距的設(shè)置方法
axure怎么調(diào)整字間距？axure中想要調(diào)節(jié)文字的行間距，該怎么調(diào)節(jié)呢？下面我們就來(lái)看看axure字間距的設(shè)置方法，需要的朋友可以參考下2017-09-30
axure團(tuán)隊(duì)項(xiàng)目怎么獲取? axure獲取并打開(kāi)團(tuán)隊(duì)項(xiàng)目的方法
axure團(tuán)隊(duì)項(xiàng)目怎么獲??？axure做項(xiàng)目的時(shí)候，想要獲取團(tuán)隊(duì)項(xiàng)目，該怎么獲取呢？下面我們就來(lái)看看axure獲取并打開(kāi)團(tuán)隊(duì)項(xiàng)目的方法，需要的朋友可以參考下2017-09-28
