Axure基礎(chǔ):元件交互事件

鼠標單擊跳轉(zhuǎn)就是最基本的元件交互事件履植,可以用于鼠標點擊時,也可以用于移動設(shè)備上的手指點擊時悄晃。我們以簡書的主導(dǎo)航(發(fā)現(xiàn)/關(guān)注/消息)跳轉(zhuǎn)為例玫霎,說明元件的交互過程。

=======================================
Axure 9.0元件交互事件

單擊時:當元件被點擊時妈橄。
雙擊時:元件被鼠標雙擊時庶近。
右擊時:當元件被鼠標右鍵單擊時。
按下時:當鼠標按下左鍵沒有被釋放時眷蚓。
松開時:當元件被鼠標點擊鼻种,這個事件由鼠標按鍵釋放觸發(fā)。
鼠標移動時:當光標在一個元件上移動時溪椎。
鼠標移入時:當光標移入元件范圍時普舆。
鼠標移出時:當光標移出元件范圍時。
鼠標停放時:當光標在元件上方懸停時校读。
鼠標長按時:當鼠標按下超過2秒沒有被釋放時沼侣。
按鍵按下時:鍵盤上的按鍵被按下時。
按鍵松開時:當鍵盤上的按鍵彈起時歉秫。
移動時:當元件移動時蛾洛,在頁面中的坐標位發(fā)生了變化。
旋轉(zhuǎn)時:當元件旋轉(zhuǎn)時。
尺寸改變時:當元件寬度或高度發(fā)生改變時轧膘。
顯示時:當元件通過交互動作顯示時钞螟。
隱藏時:當元件通過交互動作隱藏時。
獲取焦點時:當一個輸入項獲取焦點時谎碍。
失去焦點時:當一個輸入項失去焦點時鳞滨。
選中改變時:適用于下拉框,當下拉框被選中的項發(fā)生了改變時蟆淀,通常作為事件的一個邏輯條件拯啦。
選中時:當復(fù)選框或單選按鈕被選中時。
取消選中時:當復(fù)選框或單選按鈕取消選中時熔任。
載入時:當元件從一個頁面的加載中載入時褒链。
文字改變時:當單行文本框或多行文本框中的文字發(fā)生改變時。
狀態(tài)改變時:當動態(tài)面板被設(shè)置了“設(shè)置面板狀態(tài)”動作時疑苔。
拖動開始時:當一個拖動動作開始時甫匹。
拖動時:當一個動態(tài)面板正在被拖動時。
拖動結(jié)束時:當一個拖動動作結(jié)束時惦费。
向左拖動結(jié)束時:當一個面板向左拖動結(jié)束時兵迅。
向右拖動結(jié)束時:當一個面板向右拖動結(jié)束時。
向上拖動結(jié)束時:當一個面板向上拖動結(jié)束時趁餐。
向下拖動結(jié)束時:當一個面板向下拖動結(jié)束時喷兼。
滾動時:當一個有滾動的面板上下滾動時。
向上滾動時:當一個有滾動的面板后雷,向上滾動時季惯。
向下滾動時:當一個有滾動的面板,向下滾動時臀突。

Axure 9.0元件交互樣式

鼠標懸停:當鼠標懸停在元件上時勉抓,元件的顯示樣式。
鼠標按下:當鼠標按下元件時候学,元件的顯示樣式藕筋。
選中:元件被選中時的顯示樣式。
禁用:元件被停止使用時的顯示樣式梳码。
獲取焦點:當光標聚焦在元件(如文本框)上的顯示樣式隐圾。

=======================================
操作方法

第一步:
添加用例:在設(shè)計區(qū)域選中元件,在右側(cè)交互面板中點擊新建交互掰茶,我們會看到該元件可用的事件列表暇藏,點擊其中的一個事件,點擊右側(cè)的用例圖標或者直接選擇想要添加的動作濒蒋。
第二步:
插入動作:鼠標點擊動作名稱盐碱,開始添加動作把兔,支持添加多個動作。當我們準備插入第二個動作時瓮顽,點擊用例下方的圓形十字架县好,開始插入更多動作。
第三步:
配置動作:動作選擇完畢后暖混,我們還需要為動作進行一些規(guī)則或?qū)傩缘呐渲寐乒薄1热纾覀兲砑拥膭幼魇谴蜷_鏈接拣播,在動作配置中善绎,需要添加鏈接頁面并選擇頁面打開的方式(當前窗口、新窗口/新標簽诫尽、彈出窗口和父級窗口),最后點擊完成炬守。
第四步:
設(shè)置交互樣式:
選中元件牧嫉,點擊新建交互,可以進行懸停减途、選擇酣藻、禁用等相關(guān)的交互樣式設(shè)置;
第五步:
在預(yù)覽或生成的HTML文件進行查看鳍置。

參考:http://www.reibang.com/p/ae12af2a1f43

=======================================
元件交互示例:

(1)鼠標按下效果:
點擊按下按鈕置灰這樣一個靜態(tài)效果:就不用設(shè)置【交互動作】 辽剧,直接設(shè)置【交互樣式】即可

(2)鼠標選中效果:
希望 “提交”按鈕 選中后, 變藍色+下劃線:
1:選擇文本輸入框税产,右邊操作區(qū)選擇【交互】-【新建交互】
2:插入動作:鼠標點擊動作名稱怕轿,開始添加動作 「鼠標點擊時」
3:編輯動作:動作選擇完畢后,選擇「設(shè)置選中」辟拷,設(shè)置選中動作細節(jié)
注:如果多個按鈕撞羽,不同效果
法1)給不同的按鈕123起名字,設(shè)置按鈕1交互動作時設(shè)置好對應(yīng)按鈕23的動作
法2)全選按鈕-右鍵-設(shè)置「選項的組」名稱 --->選項組的所有元素默認只能單選
4:選擇交互樣式:選擇文本輸入框衫冻,-【新建交互】诀紊,選擇【選中】設(shè)置樣式
5:發(fā)布,預(yù)覽看設(shè)置的樣式

=======================================
配置動作細節(jié)


(一)添加條件
有些時候隅俘,我們可能會在頁面中表達一些判斷邏輯邻奠,當xxx時,執(zhí)行xxx動作为居。
為了做到這一點碌宴,我們可以使用axure提供的條件設(shè)置功能,來為一個元件設(shè)置條件并添加執(zhí)行動作颜骤。
示例:
如果單擊先出現(xiàn)彈窗唧喉,再單擊隱藏彈窗

選擇添加情型
添加條件&情形名稱
確定條件配置
完成條件
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子八孝,更是在濱河造成了極大的恐慌董朝,老刑警劉巖,帶你破解...
    沈念sama閱讀 212,454評論 6 493
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件干跛,死亡現(xiàn)場離奇詭異子姜,居然都是意外死亡,警方通過查閱死者的電腦和手機楼入,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,553評論 3 385
  • 文/潘曉璐 我一進店門哥捕,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人嘉熊,你說我怎么就攤上這事遥赚。” “怎么了阐肤?”我有些...
    開封第一講書人閱讀 157,921評論 0 348
  • 文/不壞的土叔 我叫張陵凫佛,是天一觀的道長。 經(jīng)常有香客問我孕惜,道長愧薛,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,648評論 1 284
  • 正文 為了忘掉前任衫画,我火速辦了婚禮毫炉,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘削罩。我一直安慰自己瞄勾,他們只是感情好,可當我...
    茶點故事閱讀 65,770評論 6 386
  • 文/花漫 我一把揭開白布弥激。 她就那樣靜靜地躺著丰榴,像睡著了一般。 火紅的嫁衣襯著肌膚如雪秆撮。 梳的紋絲不亂的頭發(fā)上四濒,一...
    開封第一講書人閱讀 49,950評論 1 291
  • 那天,我揣著相機與錄音职辨,去河邊找鬼盗蟆。 笑死,一個胖子當著我的面吹牛舒裤,可吹牛的內(nèi)容都是我干的喳资。 我是一名探鬼主播,決...
    沈念sama閱讀 39,090評論 3 410
  • 文/蒼蘭香墨 我猛地睜開眼腾供,長吁一口氣:“原來是場噩夢啊……” “哼仆邓!你這毒婦竟也來了鲜滩?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 37,817評論 0 268
  • 序言:老撾萬榮一對情侶失蹤节值,失蹤者是張志新(化名)和其女友劉穎徙硅,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體搞疗,經(jīng)...
    沈念sama閱讀 44,275評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡嗓蘑,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,592評論 2 327
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了匿乃。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片桩皿。...
    茶點故事閱讀 38,724評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖幢炸,靈堂內(nèi)的尸體忽然破棺而出泄隔,到底是詐尸還是另有隱情,我是刑警寧澤宛徊,帶...
    沈念sama閱讀 34,409評論 4 333
  • 正文 年R本政府宣布梅尤,位于F島的核電站,受9級特大地震影響岩调,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜赡盘,卻給世界環(huán)境...
    茶點故事閱讀 40,052評論 3 316
  • 文/蒙蒙 一号枕、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧陨享,春花似錦葱淳、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,815評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至定硝,卻和暖如春皿桑,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背蔬啡。 一陣腳步聲響...
    開封第一講書人閱讀 32,043評論 1 266
  • 我被黑心中介騙來泰國打工诲侮, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人箱蟆。 一個月前我還...
    沈念sama閱讀 46,503評論 2 361
  • 正文 我出身青樓沟绪,卻偏偏與公主長得像,于是被迫代替她去往敵國和親空猜。 傳聞我的和親對象是個殘疾皇子绽慈,可洞房花燭夜當晚...
    茶點故事閱讀 43,627評論 2 350