如何實(shí)現(xiàn)TAB切換時(shí)按鈕變換樣式
如何實(shí)現(xiàn)TAB切換時(shí)按鈕變換樣式
AXURE原型設(shè)計(jì)工具能夠?qū)崿F(xiàn)很多復(fù)雜的交互效果,比如TAB標(biāo)簽的動態(tài)切換,下面是學(xué)習(xí)啦小編給大家整理的一些有關(guān)實(shí)現(xiàn)TAB切換時(shí)按鈕變換樣式的方法,希望對大家有幫助!
實(shí)現(xiàn)TAB切換時(shí)按鈕變換樣式的方法
當(dāng)鼠標(biāo)移動到TAB標(biāo)簽按鈕時(shí),按鈕樣式發(fā)生改變(紅底白色加粗字體),當(dāng)點(diǎn)擊按鈕切換顯示內(nèi)容后,按鈕樣式發(fā)生改變(黃底黑色加粗字體)最終顯示如下:
選中按鈕“作業(yè)批閱結(jié)果”,右鍵>>編輯按鈕形狀>>編輯懸停樣式,在彈出的“設(shè)置懸停樣式”對話框中選擇填充色,字體顏色,加粗等效果,勾選對話框底部的“預(yù)覽”功能,能夠預(yù)覽設(shè)置完時(shí)候的樣式(需要設(shè)置成什么樣式可根據(jù)自己的設(shè)計(jì))
設(shè)置完一個(gè)按鈕,還有另外兩個(gè)按鈕需要設(shè)置,這時(shí)候可以利用格式刷,類似于word中格式刷的功能,能夠?qū)⒉考臉邮脚窟M(jìn)行設(shè)置(注意:不能利用格式刷復(fù)制部件的操作和大小)。
選中按鈕“作業(yè)批閱結(jié)果”,右鍵>>編輯按鈕形狀>>編輯選中樣式,在彈出的對話框中設(shè)置第二種樣式(黃底黑色加粗字體),如下圖:
在預(yù)覽中我們發(fā)現(xiàn),當(dāng)鼠標(biāo)滑過這三個(gè)按鈕時(shí),按鈕變換樣式,但是點(diǎn)擊某一個(gè)按鈕進(jìn)行內(nèi)容切換時(shí),卻沒有顯示選中的樣式,如何讓按鈕點(diǎn)擊后改變樣式呢?
選中第一個(gè)按鈕“作業(yè)批閱結(jié)果”,然后再右側(cè)事件編輯欄中選中“onclick(點(diǎn)擊時(shí))用例1”進(jìn)行編輯(注意:前面已經(jīng)添加了一個(gè)事件,點(diǎn)擊時(shí)顯示對應(yīng)的內(nèi)容),在彈出的對話框中選擇“設(shè)置部件為選中狀態(tài)“,在右側(cè)選擇按鈕”作業(yè)批閱結(jié)果“后確定,如下圖
完成步驟6后預(yù)覽效果,此時(shí)部件點(diǎn)擊后變換了樣式(如下圖1),不過當(dāng)再點(diǎn)擊第二個(gè)按鈕時(shí)卻不能取消掉上一個(gè)被選中的樣式(如下圖2),怎么辦呢?
選中本次TAB切換中的三個(gè)按鈕,右鍵>>編輯按鈕形狀>>指定按鈕組,在彈出的對話框中輸入按鈕組名稱,例如“查看作業(yè)按鈕組“,如下圖:
完結(jié),預(yù)覽本小結(jié)最終效果
END
看了“如何實(shí)現(xiàn)TAB切換時(shí)按鈕變換樣式”的人還看了