返回首頁

AxureRP實現鍵盤交互效果

時間:2013-05-17 22:37來源:知行網www.ayratv.icu 編輯:麥田守望者

與鍵盤的交互一般都簡化成輸入內容,或者改為由鼠標來控制會比較多,因為B/S架構的系統或者網站其實不大需要跟鍵盤有交互,用鼠標就可以全部都實現了,這也是為了提升用戶體驗的滿意度。不過現在網頁游戲這么流行,雖然大部分操作也還是只需要鼠標就可以了,但還是支持鍵盤快捷鍵的。因此鍵盤交互也并非完全沒有用武之地了,至少能支持快捷鍵操作就是一種不錯的體驗。

AxureRP支持鍵盤交互,也不能說是支持,只是用AxureRP能夠實現鍵盤交互操作的效果,可以用來做需要操作鍵盤控制的產品原型,比如計算器、熱鍵切換等,其實熱鍵切換就是快捷鍵操作。這里介紹的例子就是演示鍵盤交互效果的,利用鍵盤來控制動態面板的移動。

實現原理是通過一個單行文本框來判斷鍵盤輸入內容,再通過OnKeyUp事件來控制動態面板移動,并需要每次都清空單行文本框,以此來達成效果。

AxureRP實現鍵盤交互效果1

這里的效果是通過鍵盤上常用的四個方向控制鍵W,S,A,D來控制圖中小人的移動,移動本身的設置是比較簡單的,有兩個地方需要注意,一是頁面加載之后要讓焦點默認在單行輸入框內,否則無法做輸入控制;二是每次輸入完畢之后要對輸入框做清空設置,以便下次輸入后還能再次做判斷。AxureRP在執行交互動作的時候不是實時響應的,所以在輸入的時候要主要輸入速度,否則連續輸入兩個字符之后就判斷不出來了。

AxureRP實現鍵盤交互效果2

還有一點就是單行輸入框的顯示問題,這個為了達到比較好的鍵盤交互效果,是要把它隱藏的,這里的控制是將它放置在一個動態面板下,然后縮小動態面板,以此達到隱藏的控制,大家在查看源文件的時候全選一下就看到了。

鍵盤交互效果就是這樣了,原理是很簡單的,能在實際應用當中想到是最重要的。

示例在AxureRP 5.5版本下調試通過

------分隔線----------------------------
標簽(Tag):AxureRP AxureRP教程 AxureRP軟件下載 AxureRP序列號
------分隔線----------------------------
推薦內容
猜你感興趣
pk10赛车直播视频