手机版 欢迎访问人人都是自媒体网站

当前位置:主页 > 推广 >

AXURE8.0实现真实拨打电话

时间:2020-12-02 09:32|来源:网络整理|编辑:采集侠|点击:

 AXURE8.0实现真实拨打电话

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

难点:删除电话号码

重点:拨号功能:

tel:电话号码

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

原型:

 AXURE8.0实现真实拨打电话

原型拆解:

1.全局界面

 AXURE8.0实现真实拨打电话

2.输入号码

 AXURE8.0实现真实拨打电话

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

3.按键

 AXURE8.0实现真实拨打电话

两种制作方法:

组合:将矩形+数字+字母组合到一起,方便写交互

编辑矩形:将按键制作成一个独立元件,在矩形里输入数字2,回车换行,再输入字母ABC,然后调整字符大小即可

 AXURE8.0实现真实拨打电话

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

交互:

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

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

因此是“设置文本”动作,如下:

 AXURE8.0实现真实拨打电话

 AXURE8.0实现真实拨打电话

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

需要完成的功能:每单击一次从”hm”文本框中,将最后一位数字删除

注意:每删除一个数字后,还需要将新的字符串,放回hm文本框中,因此还是“设置文本”动作

表达式解释:[[LVAR1.substr(0,LVAR1.length-1)]]:将hm的值传递给局部变量LVAR1

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

 AXURE8.0实现真实拨打电话

3.呼出键交互—单击时

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

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

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

 AXURE8.0实现真实拨打电话

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

 AXURE8.0实现真实拨打电话

4.历史通话记录交互

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

 AXURE8.0实现真实拨打电话

 AXURE8.0实现真实拨打电话

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

先拨手机号+再单击呼出键

直接单击呼出键;

 AXURE8.0实现真实拨打电话

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

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

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

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

Copyright © 2018 DEDE97. 织梦97 版权所有 京ICP