搜索
小程序源码 小程序教程 discuz插件 dedecms模板 discuz模板
微信小程序-浩阳天社区 › 小程序服务 › 小程序工具 › 微信小程序-录音机，RECORD组件真机可用
返回列表 发新帖

微信小程序-录音机，RECORD组件真机可用

[复制链接]
hyt_xcx手机认证 实名认证 视频认证 发表于 2017-1-19 19:46:47 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
经过测试，本demo真机可正常使用录音，并播放录音的功能，推荐新手学习

作者：Cedric-song
  1. // page/recorder/index.js
  2. var util = require('../../util/util.js')
  3. const PLAY = "播放音频"
  4. const REPEAT = "重播音频"
  5. const PAUSE = "暂停播放"

  7. const PLAY_RECORD = "开始录音"
  8. const STOP_RECORD = "停止录音"
  9. const PLAY_VOICE = "回放录音"
  10. const STOP_VOICE = "停止回放"
  11. const SAVE_VOICE = "保存录音"

  13. var playTimeInterval
  14. var recordTimeInterval

  16. Page({
  17.   onReady: function(e) {
  18.     // 使用 wx.createAudioContext 获取 audio 上下文 context
  19.     this.audioCtx = wx.createAudioContext('myAudio')
  20.   },
  21.   data: {
  22.     recording: false,
  23.     playing: false,
  24.     hasRecord: false,
  25.     recordTime: 0,
  26.     playTime: 0,
  27.     formatedRecordTime: '00:00:00',
  28.     formatedPlayTime: '00:00:00',
  29.     play: PLAY,
  30.     repeat: REPEAT,
  31.     record: PLAY_RECORD,
  32.     playRecord: PLAY_VOICE,
  33.     stopRecord: STOP_RECORD,
  34.     playVoice: PLAY_VOICE,
  35.     stopVoice: STOP_VOICE,
  36.     saveVoice: SAVE_VOICE,
  37.     audioInfo: {
  38.       poster: 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000',
  39.       name: '此时此刻',
  40.       author: '许巍',
  41.       controls: false,
  42.       src: 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46'
  43.     },

  45.   },
  46.   audioPause: function() {
  47.     this.audioCtx.pause()
  48.   },
  49.   audioToggle: function(btnName, defaultName) {
  50.     let otherBtnName = btnName === "play" ? "repeat" : "play"
  51.     if (this.data[btnName] === defaultName) {
  52.       this.audioCtx.play()
  53.       this.setData({
  54.         [btnName]: PAUSE,
  55.         [otherBtnName]: otherBtnName.toUpperCase() === "PLAY" ? PLAY : REPEAT
  56.       });
  57.       return false
  58.     }
  59.     this.setData({
  60.       [btnName]: defaultName
  61.     });
  62.     this.audioPause()
  63.   },
  64.   audioPlay: function() {
  65.     this.audioToggle('play', PLAY)
  66.   },
  67.   audioRepeat: function() {
  68.     this.audioCtx.seek(0)
  69.     this.audioToggle('repeat', REPEAT)
  70.   },
  71.   defaultPause: function() {
  72.     this.setData({
  73.       play: PLAY,
  74.       repeat: REPEAT
  75.     })
  76.   },
  77.   onHide: function() {
  78.     if (this.data.playing) {
  79.       this.stopVoice()
  80.     } else if (this.data.recording) {
  81.       this.stopRecordUnexpectedly()
  82.     }
  83.   },
  84.   startRecord: function() {
  85.     this.setData({
  86.       recording: true
  87.     })

  89.     var that = this
  90.     recordTimeInterval = setInterval(function() {
  91.       var recordTime = that.data.recordTime += 1
  92.       that.setData({
  93.         formatedRecordTime: util.formatTime(that.data.recordTime),
  94.         recordTime: recordTime
  95.       })
  96.     }, 1000)
  97.     wx.startRecord({
  98.       success: function(res) {
  99.         that.setData({
  100.           hasRecord: true,
  101.           tempFilePath: res.tempFilePath,
  102.           formatedPlayTime: util.formatTime(that.data.playTime)
  103.         })
  104.       },
  105.       complete: function() {
  106.         that.setData({
  107.           recording: false
  108.         })
  109.         clearInterval(recordTimeInterval)
  110.       }
  111.     })
  112.   },
  113.   stopRecord: function() {
  114.     wx.stopRecord()
  115.   },
  116.   stopRecordUnexpectedly: function() {
  117.     var that = this
  118.     wx.stopRecord({
  119.       success: function() {
  120.         console.log('stop record success')
  121.         clearInterval(recordTimeInterval)
  122.         that.setData({
  123.           recording: false,
  124.           hasRecord: false,
  125.           recordTime: 0,
  126.           formatedRecordTime: util.formatTime(0)
  127.         })
  128.       }
  129.     })
  130.   },
  131.   playVoice: function() {
  132.     var that = this
  133.     playTimeInterval = setInterval(function() {
  134.       var playTime = that.data.playTime + 1
  135.       console.log('update playTime', playTime)
  136.       that.setData({
  137.         playing: true,
  138.         formatedPlayTime: util.formatTime(playTime),
  139.         playTime: playTime
  140.       })
  141.     }, 1000)
  142.     wx.playVoice({
  143.       filePath: this.data.tempFilePath,
  144.       success: function() {
  145.         clearInterval(playTimeInterval)
  146.         var playTime = 0
  147.         console.log('play voice finished')
  148.         that.setData({
  149.           playing: false,
  150.           formatedPlayTime: util.formatTime(playTime),
  151.           playTime: playTime
  152.         })
  153.       }
  154.     })
  155.   },
  156.   pauseVoice: function() {
  157.     clearInterval(playTimeInterval)
  158.     wx.pauseVoice()
  159.     this.setData({
  160.       playing: false
  161.     })
  162.   },
  163.   stopVoice: function() {
  164.     clearInterval(playTimeInterval)
  165.     this.setData({
  166.       playing: false,
  167.       formatedPlayTime: util.formatTime(0),
  168.       playTime: 0
  169.     })
  170.     wx.stopVoice()
  171.   },
  172.   saveVoice: function() {
  173.     wx.saveFile({
  174.       success: function(res) {
  175.         var tempFilePath = res.tempFilePath
  176.         wx.saveFile({
  177.           tempFilePath: tempFilePath,
  178.           success: function(res) {
  179.             var savedFilePath = res.savedFilePath
  180.           }
  181.         })
  182.       }
  183.     })
  184.   },
  185.   clear: function() {
  186.     clearInterval(playTimeInterval)
  187.     wx.stopVoice()
  188.     this.setData({
  189.       playing: false,
  190.       hasRecord: false,
  191.       tempFilePath: '',
  192.       formatedRecordTime: util.formatTime(0),
  193.       recordTime: 0,
  194.       playTime: 0
  195.     })
  196.   }
  197. })
复制代码
1.gif
1.png

2.png

3.png



项目地址：
游客，如果您要查看本帖隐藏内容请回复


录音机 程序

相关帖子
回复

使用道具 举报

返回列表 发表新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

hyt_xcx手机认证 实名认证 视频认证 |浩阳-宰相|

关注0

粉丝0

帖子2148

发布主题
一周下载排行最近7x24小时热帖
最新发布
友情提示

系统已迁移最新源码分享网站:浩阳源码网

免费源码下载，精品源码分享，优质教程分享等尽在浩阳源码网

点击前往浩阳源码网：https://www.hyymw.cn

我知道了
专注源码分享，教程分享
全国服务电话

187-8198-7163

周一至周8:00-22:00

反馈建议

cdhaoyt@163.com 在线QQ咨询

扫描二维码关注我们

Powered by Discuz! X3.2© 2001-2013 Comsenz Inc.( 蜀ICP备16032957号-1 )