【连载100篇】AXURE-组件-008-keyboard

我是封面

hi，大家好，我是18岁fantasy，axure组件和实例100篇连载。本期小组件为一个模拟键盘输入的实例，主要用到axure的substring，concat等相关函数。

温馨提示：文章结尾提供本期组件的原件下载地址，随时可下载。同时欢迎投稿，也欢迎大家留言共同交流。

显示效果

显示效果

实现方式

1.图层分析。制作单个按键后，通过复制得到整个键盘，具体如下：

图层分析

按键主要通过阴影效果实现，具体如下：

按键制作

2.添加事件。

为每个按键设置事件。单击时，改变输入框的内容，用到concat函数，用于向输入框已有值后面追加当前按键值。设置好后只需将事件整体复制粘贴到其他按键即可，具体如下图：

事件设置

为回退键设置单击事件，每点击一下删除一个字符，用到substring函数，用于将输入框的值截取并重新赋值给输入框，具体如下：

回退键设置

以上便是本次小组件的全部内容，喜欢就关注我吧。

原件下载

链接：https://pan.baidu.com/s/1vyR7Ur8Zxm6a74_KykS65g

提取码：plih

~~~

18岁提示：以上文件完成于axure 8版本。

点击关注"18岁fantasy"，定期会将组件整理成完整文件统一发布。

原创文章，转载请标明出处。