Axure RP 9 教程—模拟拨号键盘

1、我们增加所需元件，并命名。本案例中手机号码文本框命名为“Text 输入”，数字键盘命名为btn 1、btn 2、btn 3以此类推。这里注意手机号码文本框要选成文本框元件。

2、为元件 btn 1（即数字键盘1）设置交互

鼠标按键按下时，当前元件选中为真，Text 输入 文本为[[Number]]1（其中Number是局部变量，为“Text 输入”的元件文字）

鼠标按键释放时，当前元件选中为假。

（这里注意，之所以做选中是为了交互的效果，我设置了选中时让按钮变色，这样可以更逼真的模拟拨号键盘）

3、为元件 btn 2（即数字键盘2）设置交互

鼠标按键按下时，当前元件选中为真，Text 输入 文本为[[Number]]2（其中Number为局部变量，是“Text 输入”的元件文字）

鼠标按键释放时，当前元件选中为假。

4、为元件 btn 3 ...设置交互，以此类推。

这样，输入数字的交互就实现了。

下图列出一个按键的交互：

1、我们为退回按钮设置交互：

鼠标按键按下时，设置当前元件选中为真，设置文本Text输入到[[Number.substr(0,Number.length-1)]]（其中Number是局部变量，为Text 输入的元件文字）

鼠标按键释放时，设置当前元件选中为假。

这样，退回交互就设置完成了。