微信小程序> 微信小程序之录音

微信小程序之录音

浏览量:606 时间: 来源:焕想-不怎么回复博客
!--pages/index/release/release.wxml--scroll-view  view wx:if="{{voices}}" class="common-list" style="margin-bottom:120rpx;"    block wx:for="{{voices}}"      view class="board"        view class="cell"          view class="cell-bd" data-key="{{item.filePath}}" bindtap="gotoPlay"            view class="date"存储路径:{{item.filePath}}/view            view class="date"存储时间:{{item.createTime}}/view            view class="date"音频大小:{{item.size}}KB/view          /view        /view      /view    /block  /view/scroll-viewview wx:if="{{isSpeaking}}" class="microphone"  image class="sound-style" src="/images/speak.png"/image  image wx:if="{{j==2}}" class="sound-style" src="/images/speak.png"/image  image wx:if="{{j==3}}" class="sound-style" src="/images/speak.png"/image  image wx:if="{{j==4}}" class="sound-style" src="/images/speak.png"/image  image wx:if="{{j==5}}" class="sound-style" src="/images/speak_end.png"/image/viewview class="record-style"  button class="btn-style" bindtouchstart="touchdown" bindtouchend="touchup"按住 录音/button/view
/* pages/index/release/release.wxss */.microphone{      position:fixed;    left: 250rpx;    bottom: 0;    height: 240rpx;      width: 240rpx;      border-radius: 20rpx;      margin: 50% auto;      background: #26A5FF;  }  .item-style{      margin-top: 30rpx;      margin-bottom: 30rpx;  }  .text-style{      text-align: center;    }  .record-style{      position: fixed;      bottom: 0;      left: 0;      height: 120rpx;      width: 100%;  }  .btn-style{   margin-left: 30rpx;    margin-right: 30rpx;  }    .sound-style{    position: absolute;    width: 74rpx;    height:150rpx;    margin-top: 45rpx;    margin-left: 83rpx;  }      .board {    overflow: hidden;    border-bottom: 2rpx solid #26A5FF;    }  /*列布局*/  .cell{      display: flex;      margin: 20rpx;  }  .cell-hd{      margin-left: 10rpx;      color: #885A38;  }  .cell .cell-bd{      flex:1;      position: relative;       }  /**只显示一行*/  .date{      font-size: 30rpx;      text-overflow: ellipsis;       white-space:nowrap;      overflow:hidden;   }  

// pages/index/release/release.jsvar app = getApp()Page({  data: {    j: 1,//帧动画初始图片      isSpeaking: false,//是否正在说话      voices: [],//音频数组    },  onLoad: function () {  },  //手指按下    touchdown: function () {    console.log("手指按下了...")    console.log("new date : " + new Date)    var _this = this;    speaking.call(this);    this.setData({      isSpeaking: true    })    //开始录音      wx.startRecord({      success: function (res) {        //临时路径,下次进入小程序时无法正常使用          var tempFilePath = res.tempFilePath        console.log("tempFilePath: " + tempFilePath)        //持久保存          wx.saveFile({          tempFilePath: tempFilePath,          success: function (res) {            //持久路径              //本地文件存储的大小限制为 100M              var savedFilePath = res.savedFilePath            console.log("savedFilePath: " + savedFilePath)          }        })        wx.showToast({          title: '恭喜!录音成功',          icon: 'success',          duration: 1000        })        //获取录音音频列表          wx.getSavedFileList({          success: function (res) {            var voices = [];            for (var i = 0; i  res.fileList.length; i++) {              //格式化时间                var createTime = new Date(res.fileList[i].createTime)              //将音频大小B转为KB                var size = (res.fileList[i].size / 1024).toFixed(2);              var voice = { filePath: res.fileList[i].filePath, createTime: createTime, size: size };              console.log("文件路径: " + res.fileList[i].filePath)              console.log("文件时间: " + createTime)              console.log("文件大小: " + size)              voices = voices.concat(voice);            }            _this.setData({              voices: voices            })          }        })      },      fail: function (res) {        //录音失败          wx.showModal({          title: '提示',          content: '录音的姿势不对!',          showCancel: false,          success: function (res) {            if (res.confirm) {              console.log('用户点击确定')              return            }          }        })      }    })  },  //手指抬起    touchup: function () {    console.log("手指抬起了...")    this.setData({      isSpeaking: false,    })    clearInterval(this.timer)    wx.stopRecord()  },  //点击播放录音    gotoPlay: function (e) {    var filePath = e.currentTarget.dataset.key;    //点击开始播放      wx.showToast({      title: '开始播放',      icon: 'success',      duration: 1000    })    wx.playVoice({      filePath: filePath,      success: function () {        wx.showToast({          title: '播放结束',          icon: 'success',          duration: 1000        })      }    })  }})//麦克风帧动画  function speaking() {  var _this = this;  //话筒帧动画    var i = 1;  this.timer = setInterval(function () {    i++;    i = i % 5;    _this.setData({      j: i    })  }, 200);}  


版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎