axure键盘弹出_AxureRP实现键盘交互效果

与键盘的交互一般都简化成输入内容,或者改为由鼠标来控制会比较多,因为B/S架构的系统或者网站其实不大需要跟键盘有交互,用鼠标就可以全部都实现了,这也是为了提升用户体验的满意度。不过现在网页游戏这么流行,虽然大部分操作也还是只需要鼠标就可以了,但还是支持键盘快捷键的。因此键盘交互也并非完全没有用武之地了,至少能支持快捷键操作就是一种不错的体验。

AxureRP支持键盘交互,也不能说是支持,只是用AxureRP能够实现键盘交互操作的效果,可以用来做需要操作键盘控制的产品原型,比如计算器、热键切换等,其实热键切换就是快捷键操作。这里介绍的例子就是演示键盘交互效果的,利用键盘来控制动态面板的移动。

实现原理是通过一个单行文本框来判断键盘输入内容,再通过OnKeyUp事件来控制动态面板移动,并需要每次都清空单行文本框,以此来达成效果。

07975715376233269d19ddc96c72bdd5.png

这里的效果是通过键盘上常用的四个方向控制键W,S,A,D来控制图中小人的移动,移动本身的设置是比较简单的,有两个地方需要注意,一是页面加载之后要让焦点默认在单行输入框内,否则无法做输入控制;二是每次输入完毕之后要对输入框做清空设置,以便下次输入后还能再次做判断。AxureRP在执行交互动作的时候不是实时响应的,所以在输入的时候要主要输入速度,否则连续输入两个字符之后就判断不出来了。

db5e462292de1c7b0dee14432f39a1a3.png

还有一点就是单行输入框的显示问题,这个为了达到比较好的键盘交互效果,是要把它隐藏的,这里的控制是将它放置在一个动态面板下,然后缩小动态面板,以此达到隐藏的控制,大家在查看源文件的时候全选一下就看到了。

键盘交互效果就是这样了,原理是很简单的,能在实际应用当中想到是最重要的。

示例在AxureRP 5.5版本下调试通过

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值