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

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

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

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

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

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

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

axure键盘弹出_AxureRP实现键盘交互效果相关推荐

  1. android 设置键盘弹出动画,Android实现键盘弹出界面上移的实现思路

    1.首先说一下思路: 基本就是结合layout中ScrollView视图和AndroidManifest.xml中activity中的android:windowSoftInputMode属性配置实现 ...

  2. android 软件盘弹回去的最好体验,Android 软键盘弹出 日常填坑

    开发输入框的开发者都会遇到一个问题,那就是在登录界面时,当你点击输入框时,下边的按钮有时会被输入框挡住,这个不利于用户的体验,所以很多人希望软键盘弹出时,也能把按钮挤上去.这样的交互更人性化,做得合理 ...

  3. android软键盘把布局顶上去,Android 软键盘弹出时把原来布局顶上去的解决方法

    键盘弹出时,会将布局底部的导航条顶上去. 解决办法: 在mainfest.xml中,在和导航栏相关的activity中加: android:name=".filing.MainActivit ...

  4. Android 软键盘 弹出,默认隐藏,强制隐藏,自动变大写等

    经常时不时的需要控制软键盘的不同状态,每次用每次查,自己总结一下所有关于Android软键盘的东西写一块. 1.代码中弹出/隐藏软键盘: //view为接受软键盘输入的视图,SHOW_FORCED表示 ...

  5. android软键盘顶部定义布局,Android 软键盘弹出时把原来布局顶上去的解决方法

    键盘弹出时,会将布局底部的导航条顶上去. 解决办法: 在mainfest.xml中,在和导航栏相关的activity中加: android:name=".filing.MainActivit ...

  6. (转)Android软键盘弹出,界面整体上移

    原地址:http://blog.csdn.net/u011622479/article/details/51161717 在做搜索功能的时候,点击搜索框,搜索框获取焦点,键盘弹出:现在问题出来了,an ...

  7. 小程序中点击input控件键盘弹出时placeholder文字上移

    最近做的一个小程序项目中,出现了点击input控件键盘弹出时placeholder文字上移,刚开始以为是软键盘弹出布局上移问题是传说中典型的fixed 软键盘顶起问题,因此采纳了网上搜到的" ...

  8. swift实现ios类似微信输入框跟随键盘弹出的效果

    为什么要做这个效果 在聊天app,例如微信中,你会注意到一个效果,就是在你点击输入框时输入框会跟随键盘一起向上弹出,当你点击其他地方时,输入框又会跟随键盘一起向下收回,二者完全无缝连接,那么这是怎么实 ...

  9. Android判断软键盘弹出并隐藏的简单完美解决方案

    Android判断软键盘弹出并隐藏的简单完美解决方案 参考文章: (1)Android判断软键盘弹出并隐藏的简单完美解决方案 (2)https://www.cnblogs.com/thare1307/ ...

最新文章

  1. 微信小程序,是不是一盘可口的菜!
  2. java数据库视频教程下载,【No147】最新oracle11g DBA 开发和应用数据库视频教程下载...
  3. spring mvc学习(36):jstl的jar包的下载
  4. 草稿 断开式的连接 1127
  5. dict后缀_学习词根dict 成片记单词
  6. 鸿蒙轻内核的得力助手:带你掌握4种内存调试方法
  7. 2021永州高中高考成绩查询入口,邵阳高考成绩查询入口2021
  8. AO如何获取SDE数据库中的数据
  9. 上海计算机二级考c语言真题及答案,上海市二级考C语言真题.doc
  10. 【复试笔记】市政工程-给水排水管网系统
  11. Linux入门怎么学?262页linux学习笔记,零基础也能轻松入门
  12. java识别照片是彩色还是黑白照
  13. 15.用爬虫测试网站
  14. 【沃顿商学院学习笔记】领导力——Business Impact:09 逻辑模型四 Logic Model4
  15. Android应用禁止截屏
  16. addonsmaker怎么制作_我的世界addons制作器
  17. 如何使用Lumberyard制作特效[【1】——Overview
  18. 慢SQL!压垮团队的最后一根稻草!
  19. [RK3288][Android6.0] RTC模块RX8010SJ驱动添加及改动
  20. Flash Download failed - “Cortex-M3“解决方法

热门文章

  1. JetBrains全家桶激活
  2. HTML+CSS做的商城页面
  3. MySQL数据库入门实战教程
  4. 洲际酒店集团加速布局粤港澳大湾区,与华侨城酒店集团达成合作
  5. 电口模块和光模块有什么区别?
  6. GlobalMapper20转换KML为GeoJson,保留名称
  7. autograd-自动求导系统
  8. 【赛氪 Saikr】不正方形(数学、平面几何 ps:今天打了假赛)
  9. emmc和ssd的区别
  10. python中使用opencv的HSV颜色空间提取物体