AXURE8.0实现真实拨打电话

主要功能:实现拨号、删除号码、真实呼叫、判断、全局变量……

难点:删除电话号码

重点:拨号功能:

tel:电话号码

函数:字符截取函数,LVAR.substr(开始位置,截取长度),this.name:获取元件名称

原型:

产品经理,产品经理网站

原型拆解:

1.全局界面

产品经理,产品经理网站

2.输入号码

产品经理,产品经理网站

命名:文本框命名为hm,主要接收按键按下的内容;

3.按键

产品经理,产品经理网站

两种制作方法:

  1. 组合:将矩形+数字+字母组合到一起,方便写交互
  2. 编辑矩形:将按键制作成一个独立元件,在矩形里输入数字2,回车换行,再输入字母ABC,然后调整字符大小即可

产品经理,产品经理网站

命名:以其具体数字或符号命名:如“1”号键命名1;“2”号键命名2;依此类推,“#”号键命名#。这样我就可以通过[[this.name]],获取到按钮内容;

交互:

1.数字按键交互—单击时事件

  • 需要完成的动作:将按键内容,输入“输入号码”处(注意:电话号码是以连接的格式进行输入,所以我们在输入新的号码时,先把“hm”框中的内容获取放在最前面)。
  • 因此是“设置文本”动作,如下:

产品经理,产品经理网站

产品经理,产品经理网站

2.删除键交互—单击时事件

  • 需要完成的功能:每单击一次从”hm”文本框中,将最后一位数字删除
  • 注意:每删除一个数字后,还需要将新的字符串,放回hm文本框中,因此还是“设置文本”动作
  • 表达式解释:[[LVAR1.substr(0,LVAR1.length-1)]]:将hm的值传递给局部变量LVAR1

每单击一次,从hm文本框中进行截取,0:表示从第一位开始截取,LVAR1.length-1:表示从hm文本框字符位数减1,为截取长度;

产品经理,产品经理网站

3.呼出键交互—单击时

需要完成的动作:呼出拨出的号码。

打开链接—当前窗口—链接到URL:tel:[[LVAR1]]。

[LVAR1]]:为hm传递的值。

产品经理,产品经理网站

这里加了一个判断:如果hm文本框有内容,说明有输入电话号码,单击拨号呼出的是hm的内容;如果hm文本框为空,则呼出的应该是历史呼出的第一个电话号码,这里可以自字义一个;

产品经理,产品经理网站

4.历史通话记录交互

单击历史通话记录,只需要执行拨打当前历史记录电话号码即可:tel:xxxx……

产品经理,产品经理网站

产品经理,产品经理网站

5.当直接按下拨号键时,如果没有拨号码,这时呼出的电话就应该是,历史记录中的第一条记录,所以我需要判断拨号键的交互;

  • 先拨手机号+再单击呼出键
  • 直接单击呼出键;

产品经理,产品经理网站

所有交互制作完成,即可预览;

预览地址:https://ijdnup.axshare.com

温馨备注:mac电脑可以直接测试效果,或使用手机进行预览测试。

原型下载:链接:https://pan.baidu.com/s/13rKejhqkU7n6TBOdty1W-Q 密码:0966

 

本文作者 @松林放牛娃

版权声明

本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符,请点击 举报 进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部