文档库 最新最全的文档下载
当前位置:文档库 › iH5中级教程:微信必备,用H5上传录音

iH5中级教程:微信必备,用H5上传录音

iH5中级教程:微信必备,用H5上传录音

平常我们在跟朋友聊天的时候用微信录音就用得多了,那么大家又有没有听说过风靡朋友圈的H5页面也能录音而且能够上传让更多的人听到呢?今天我利用一款强大的H5免费制作工具来给大家分享一下我制作这个可以录音和上传录音的h5的经验吧!(需要公众号向微信申请调用接口,个人暂时不能制作。)

第一步:选中舞台,点击工具栏下的图片工具,在舞台中画出一个矩形,上

传图片背景和制作好的按钮图片,和点击工具栏下的音频工具,上传一个空白音频,空白音频在这里的作用是作为一个微信录音、回放以及上传录音的载体。

4.选中按钮图,点击工具栏里的透明按钮,在按钮图下添加4个透明按钮并分别重命名为“play”、“确认上传”、“回放”、“按住说话”。注意在选择透明按钮工具后在画框的时候要框住整个图片。

第二步:微信录音和回放

1.选中“按住说话”对象后,点击工具栏里的事件工具,添加两个事件。事件1设置它的触发条件为手指按下,目标对象为音频1,目标动作为微信开始录音。事件2设置它的触发条件为手指离开,目标对象为音频1,目标动作为微信停止录音。这样就做出了手指按下时微信开始录音,手指松开之后微信停止录音的效果。

2.选中“回放”对象,点击工具栏里的事件工具,添加一个事件,事件1设置它的触发条件为手指按下,目标对象为音频1,目标动作为微信播放录音。我们通常录完音之后都会想要听一下自己刚刚的录音,所以这里回放的作用是我们可以通过“回放”来听自己的录音,但是这个录音只能自己听到。

第三步:微信上传和分享

1.选中“确认上传”对象后,点击工具栏里的事件工具,添加一个事件,事件1设置它的触发条件为手指按下,目标对象为音频1,目标动作为微信上传录音。这样将录音上传之后我们就可以在分享出去的时候让人家能听到我们的录音。

2.当我们上传了录音之后,别人打开是录音是不会自动播放的,所以我们需要做一个按钮去让别人点击后可以播放我们上传的录音。选中“play”后添加一个事件,事件1设置它的触发条件为手指按下,目标对象为音频1,目标动作为从头播放。这样我们将H5分享出去之后,别人只要手指按下play就可以听到我们

上传的录音。

重点工具:透明按钮、音频、事件

重点事件:

触发对象:按住说话

触发条件:手指按下

按下时间:0

目标对象:舞台·音频1

目标动作:微信开始录音

触发对象:按住说话

触发条件:手指离开

目标对象:舞台·音频1

目标动作:微信停止录音

触发对象:确认上传

触发条件:手指按下

按下时间:0

目标对象:舞台·音频1

目标动作:微信上传录音

触发对象:play

触发条件:手指按下

目标对象:舞台·音频1

目标动作:从头播放。

Tips:

1、上传一个空音频用来放置所输入的录音,用来播放和上传。

2、使用微信录音功能需绑定微信公众号,详情查看付费功能自定义微信授

权。

相关文档