使用微信同声传译，实现页面滑动播放

一、添加微信同声传译插件

由于目前使用官方推荐的添加方式无法查找到微信同声传译插件，因此，我们直接使用微信服务平台进行添加，操作步骤如下：
1.点击微信服务平台链接，下滑找到微信同声传译
在这里插入图片描述
2.点击添加插件按钮，使用微信扫码，现在对应的小程序即可添加成功

3.添加成功后，可以到微信公众平台，设置，第三方插件中查看
在这里插入图片描述

二、页面实现同声传译使用

在app.json文件中添加插件的版本信息

{"pages": ["pages/index/index"],"plugins": {"WechatSI": {"version": "0.3.5","provider": "wx069ba97219f66d99"}},"sitemapLocation": "sitemap.json"
}

version和provider可以在插件详情中查看到
在这里插入图片描述
在需要进行同声传译的页面中添加同声同声传译代码即可，切记，是在js文件中

const app = getApp();
//引入插件：微信同声传译
const plugin = requirePlugin('WechatSI');
Page({onReady: function () {this.innerAudioContext = wx.createInnerAudioContext();let that = thisvar cont = that.data.result[0].name||that.data.result.color_result||that.data.result.currencyName;plugin.textToSpeech({lang: 'zh_CN',content: cont,success: function (res) {that.playAudio(res.filename);},})},playAudio(e) {this.innerAudioContext.src = ethis.innerAudioContext.play();}
})

三、滑块滑动

使用swiper滑块来进行不同页面间切换
index.wxml代码如下

<!--滑块试图容器-->
<swiper class="swiper" indicator-dots="true" indicator-active-color="#fff" bindchange="scroll" current="swindex" bindtouchstart="touchStart" bindtouchmove="touchMove" bindtouchend="touchEnd"><swiper-item><van-grid column-num="1"><van-grid-item icon="photo-o"  text="北京" icon-color="#008B8B"/></van-grid></swiper-item><swiper-item><van-grid column-num="1"><van-grid-item icon="photo-o"  text="上海" icon-color="#008B8B"/></van-grid></swiper-item><swiper-item><van-grid column-num="1"><van-grid-item icon="flower-o" text="广州" icon-color="#008B8B"/></van-grid></swiper-item><swiper-item><van-grid column-num="1"><van-grid-item icon="birthday-cake-o" text="深圳" icon-color="#FA8072" /></van-grid></swiper-item>
</swiper>

index.wxss代码如下

.swiper{background-color: rgb(47, 161, 228);height: 1000rpx;width: 100%
}
.van-grid-item{height: 1000rpx; width: 100%
}

index.js代码如下

var touchDot = 0; //触摸时的原点
var time = 0; // 时间记录，用于滑动时且时间小于1s则执行左右滑动
var interval = ""; // 记录/清理时间记录
//引入插件：微信同声传译
const plugin = requirePlugin('WechatSI');
Page({
data: {content: ['北京','上海','广州','深圳']
},
// 语音
onReady: function () {this.innerAudioContext = wx.createInnerAudioContext();let that = thisplugin.textToSpeech({lang: 'zh_CN',//content: "页面加载时播放的，可以加第一个滑块的内容",content:this.data.content[0],success: function (res) {that.playAudio(res.filename);},})
},
scroll: function (e) {this.swindex = e.detail.currentthis.innerAudioContext = wx.createInnerAudioContext();let that = thisplugin.textToSpeech({lang: 'zh_CN',content: this.data.content[this.swindex],success: function (res) {that.playAudio(res.filename);},})
},
playAudio(e) {this.innerAudioContext.src = ethis.innerAudioContext.play();
},// 触摸开始事件  
touchStart: function (e) {touchDot = e.touches[0].pageX; // 获取触摸时的原点  // 使用js计时器记录时间    interval = setInterval(function () {time++;}, 100);},
// 触摸移动事件  
touchMove: function (e) {var touchMove = e.touches[0].pageX;console.log("touchMove:" + touchMove + " touchDot:" + touchDot + " diff:" + (touchMove - touchDot));// 向右滑动  if (touchMove - touchDot >= 40 && time < 10) {console.log('向右滑动');wx.switchTab({url: '../index/index'});}},
// 触摸结束事件  touchEnd: function (e) {clearInterval(interval); // 清除setInterval  time = 0;}})