Axure怎么設(shè)計開關(guān)按鈕效果?
我要評論Axure中想要繪制開關(guān)按鈕，該怎么設(shè)計開關(guān)呢？下面我們就來看看詳細(xì)的教程。
原型設(shè)計工具Axure RP Pro 8.1特別版 中文漢化特別版(附漢化包+注冊碼+安裝教程)
- 類型：輔助設(shè)計
- 大?。?/span>90.5MB
- 語言：簡體中文
- 時間：2018-05-24
”開關(guān)“按鍵比較簡單，如下圖，新建一個”圓形“及一個”矩形“
設(shè)置”圓形“尺寸為28*28，命名為round；設(shè)置”矩形“尺寸為70*32，命名為block，填充色#999999，圓角半徑35，字體顏色#FFFFFF，文字內(nèi)容”OFF“，右對齊
另單獨再設(shè)置”矩形：block“的選中時，填充色為#009900
按下圖方式布局方式組合”圓形：round“和”矩形：block“，并命名此組合為”on-off“
布局、組合結(jié)束后，下來就是”開關(guān)“按鍵的交互動作。”組合：on-off“的”鼠標(biāo)點擊時“的交互動作：設(shè)置”當(dāng)前控件“的選中狀態(tài)為”切換（toggle）“方式
”圓形：round“的”選中時“的交互動作：移動”圓形：round“到指定位置（X,Y）
設(shè)置“元件：block”為局部變量LVAR1，所以X的值為[[LVAR1.right-This.width-3]]
Y的值為[[This.y]]
”圓形：round“的”取消選中時“的交互動作：移動”圓形：round“到指定位置（X,Y）
設(shè)置“元件：block”為局部變量LVAR1，所以X的值為[[LVAR1.left+3]]
Y的值依舊為[[This.y]]
”矩形：block“的”選中時“的交互動作：設(shè)置”矩形：block“的值為”ON“：富文本格式設(shè)定為左對齊，文字粗體
”矩形：block“的”取消選中時“的交互動作：設(shè)置”矩形：block“的值為”OFF“：富文本格式設(shè)定為右對齊，文字粗體
至此，基本設(shè)置就結(jié)束了~很是簡單，明了。這個是一個默認(rèn)”關(guān)閉“的效果，默認(rèn)”開啟“效果原理類似，這里就不再累述了
以上就是axure設(shè)計開關(guān)按鈕的教程，希望大家喜歡，請繼續(xù)關(guān)注腳本之家。
相關(guān)推薦：
相關(guān)文章
Axure RP 8怎么控制不同顏色元件移動？Axure RP 8中想要控制兩個不同顏色的柱子，該怎么操作呢？下面我們就來看看詳細(xì)的教程，很簡單，需要的朋友可以參考下2017-05-08
Axure RP 8怎么控制矩形元件顛倒旋轉(zhuǎn)?
Axure RP 8怎么控制矩形元件顛倒旋轉(zhuǎn)？Axure RP 8中想想要使用按鈕控制一個矩形的旋轉(zhuǎn)，該怎么制作呢？下面我們就來看看詳細(xì)的教程，很簡單，需要的朋友可以參考下2017-05-08
axure怎么制作圖片自動播放的效果？axure中想要制作一個圖片自動播放的效果，該怎么設(shè)計呢？下面我們就來看看詳細(xì)的教程，很簡單，需要的朋友可以參考下2017-05-05
Axure RP 8怎么設(shè)置動態(tài)面板顯示隱藏對象?
Axure RP 8怎么設(shè)置動態(tài)面板顯示隱藏對象？Axure RP 8中設(shè)計的網(wǎng)頁想要隱藏元件，該怎么實現(xiàn)呢？下面我們就來看看詳細(xì)的教程，需要的朋友可以參考下2017-04-28
AXURE怎么使用中繼器實現(xiàn)樣式重復(fù)但內(nèi)容不同的效果?
AXURE怎么使用中繼器實現(xiàn)樣式重復(fù)但內(nèi)容不同的效果？一般網(wǎng)站中我們都會遇到用一個模塊顯示不同內(nèi)容的情況，該怎么使用AXURE實現(xiàn)呢？下面我們就來看看詳細(xì)的教程，需要的朋2017-04-25
axure怎么隱藏菜單橫向隱藏與顯示的效果？今天想要和大家分享一些關(guān)于axure顯示隱藏效果的實現(xiàn)方法，我們就以隱藏菜單為例，需要的朋友可以參考下2017-04-23
Axure怎么設(shè)計手機(jī)短信倒計時效果？Axure中想要制作倒計時效果，該怎么制作呢？下面我們就來看看詳細(xì)的教程，很簡單，需要的朋友可以參考下2017-04-23
axure怎么用中繼器制作微博聯(lián)系人效果？想要仿照微博的聯(lián)系人樣式制作一個這種效果，該怎么制作呢？下面我們就來看看詳細(xì)的教程，需要的朋友可以參考下2017-04-23
axure怎么給文字設(shè)置跑馬燈效果？axure中想讓文字實現(xiàn)跑馬燈效果，該怎么實現(xiàn)呢》下面我們就來看看詳細(xì)的教程，需要的朋友可以參考下2017-04-23
axure怎么使用動態(tài)面板制作淘寶圖片輪播效果？我們經(jīng)?？吹教詫氈杏袌D片輪播的效果，該怎么設(shè)計這種效果呢？下面我們就來看看通過axure實現(xiàn)的教程，需要的朋友可以參考下2017-04-23
