ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

使用APICloud开发app录音功能

2022-07-11 18:04:59  阅读:158  来源: 互联网

标签:function APICloud demo app ret api 录音 var


mp3Recorder模块封装在iOS、Android下录音直接生成mp3,统一两个平台的录音生成文件,方便双平台之间的交互,减少录音完成后再转码的过程;同时提供分贝波形图显示UI;使用该模块前需要打开麦克风权限。

效果图如下:

固件要求:Android:4.0及以上 iOS:8.0及以上

该模块提供了8个接口:

addEventListener 视频结果和声音分贝监听;

startRecord 开始录音

stopRecord   停止录音

openVoiceLine 显示线性波形图

closeVoiceLine 关闭线性波形图

**setDecibels       **设置波形图的分贝值

pauseRecord 暂停录音

resumeRecord 恢复录音

方法详解见apicloud平台模块开发文档:

https://docs.apicloud.com/Client-API/Func-Ext/mp3Recorder

以下是代码的详细实现过程:

<!DOCTYPE html>
<html>

<head>
    <title>Module Develop</title>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <style type="text/css">
        html,
        body {
            height: 100%
        }

        body {
            background-color: #fff;
            margin: 0;
        }

        #wrap {
            height: 100%;
            position: relative;
        }

        #header {
            padding-top: 20px;
            background-color: #5082c2;
            height: 44px;
            position: relative;
        }

        #header h1 {
            font-size: 20px;
            height: 44px;
            line-height: 44px;
            margin: 0em;
            color: #fff;
            margin-left: 100px;
            margin-right: 100px;
            text-align: center;
        }

        #main {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-box-pack: center;
        }

        a.button {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-box-pack: center;
            -webkit-box-align: center;
            height: 32px;
            margin: 8px;
            background-color: rgba(240, 240, 240, 1.0);
            border-color: rgba(220, 220, 220, 1.0);
            border-width: 2px;
            border-style: solid;
        }

        a.active {
            background-color: rgba(240, 240, 240, 0.7);
        }
    </style>
</head>

<body>
    <div id="wrap">
        <div id="main">
            <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
            <a class="button" tapmode="active" onclick="_addEventListener()">监听录音</a>
            <a class="button" tapmode="active" onclick="startRecord()">开始录音</a>
            <a class="button" tapmode="active" onclick="pauseRecord()">暂停录音</a>
            <a class="button" tapmode="active" onclick="resumeRecord()">恢复录音</a>
            <a class="button" tapmode="active" onclick="stopRecord()">停止录音</a>
            <a class="button" tapmode="active" onclick="openVoiceLine()">打开曲线</a>
            <a class="button" tapmode="active" onclick="closeVoiceLine()">关闭曲线</a>
            <a class="button" tapmode="active" onclick="setDecibels()">设置分贝值</a>
            <a class="button" tapmode="active" onclick="playAudio()">播放录音</a>
            <br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
        </div>
    </div>
</body>
<script>

    apiready = function () {

    }

    var mp3Path;

    function _addEventListener() {
       
        var demo = api.require('mp3Recorder');
        demo.addEventListener(function (ret, err) {
            alert(JSON.stringify(ret));
            if (ret.evenType == 'endRecord') {
                mp3Path = ret.data.path;
            }
            api.toast({
                msg: JSON.stringify(ret)
            });
        });
    }

    function startRecord() {
        var demo = api.require('mp3Recorder');
        demo.startRecord({
            channel: 2, //声道支持:1 单声道 2 立体声道
            sampleRates: 44100, //采样率
        }, function (ret, err) {
            api.toast({
                msg: JSON.stringify(ret)
            });
        });
    }

    function pauseRecord() {
        var demo = api.require('mp3Recorder');
        demo.pauseRecord(function (ret, err) {
            api.toast({ msg: JSON.stringify(ret) });
        });
    }

    function resumeRecord() {
        var demo = api.require('mp3Recorder');
        demo.resumeRecord(function (ret, err) {
            api.toast({ msg: JSON.stringify(ret) });
        });
    }

    function stopRecord() {
        var demo = api.require('mp3Recorder');
        demo.stopRecord(function (ret, err) {
            api.toast({
                msg: JSON.stringify(ret)
            });
        });
    }

    function openVoiceLine() {
        var demo = api.require('mp3Recorder');
        demo.openVoiceLine({
            rect: {
                x: 0,
                y: 0,
                w: api.frameWidth,
                h: api.frameHeight / 3
            },
            fixedOn: api.frameName,
            fixed: true,
            isTransparent: false, //背景是否透明(透明时可以穿透点击视图)
        }, function (ret, err) {
            alert(JSON.stringify(ret));
        });
    }

    function closeVoiceLine() {
        var demo = api.require('mp3Recorder');
        demo.closeVoiceLine(function (ret, err) {
            api.toast({
                msg: JSON.stringify(ret)
            });
        });
    }

    function setDecibels() {
        var demo = api.require('mp3Recorder');
        var random = getRandom(0, 60);
        demo.setDecibels({
            decibel: random
        }, function (ret, err) {
            api.toast({
                msg: JSON.stringify(ret)
            });
        });
    }

    function getRandom(min, max) {
        var r = Math.random() * (max - min);
        var re = Math.round(r + min);
        re = Math.max(Math.min(re, max), min)
        return re;
    }

    function playAudio() {
        api.startPlay({
            path: mp3Path
        }, function (ret, err) {

        });
    }
</script>

</html>

模块使用相对比较简单,可以在APICloud开发平台上创建应用并添加直接添加模块,编译后安装到手机上,用示例代码进行测试。方便开发者在app开发的过程中使用。

标签:function,APICloud,demo,app,ret,api,录音,var
来源: https://www.cnblogs.com/tetetete/p/16467309.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有