想了解更多关于开源的音预内容,请访问:
51CTO 开源基础软件社区
https://ost.51cto.com
本章节我们基于上节课的浅出气语内容(HTTP协议),在上节课的学习基础上进行延伸,方便我们去理解协议,音预以及引入在线语音播报的深入功能实现以下功能:
用于播放视频文件并控制其播放状态的浅出气语组件。
说明:
该组件从API Version 7开始支持。后续版本如有新增内容,音预则采用上角标单独标记该内容的深入起始版本。
使用网络视频时,浅出气语需要申请权限ohos.permission.INTERNET。学习具体申请方式请参考权限申请声明。
Video(value: { src?: string | Resource, currentProgressRate?: number | string | PlaybackSpeed, previewUri?: string | PixelMap | Resource, controller?: VideoController})
参数:
参数名 | 参数类型 | 必填 | 参数描述 |
src | string | Resource | 否 | 视频播放源的路径,支持本地视频路径和网络路径。 支持在resources下面的video或rawfile文件夹里放置媒体资源。 支持dataability://的路径前缀,用于访问通过Data Ability提供的视频路径,具体路径信息详见DataAbility说明。 说明: 视频支持的格式是:mp4、mkv、webm、TS。 |
currentProgressRate | number | string | PlaybackSpeed8+ | 否 | 视频播放倍速。 说明: number取值仅支持:0.75,1.0,1.25,1.75,2.0。 默认值:1.0 | PlaybackSpeed.Speed_Forward_1_00_X |
previewUri | string | PixelMap8+ | Resource | 否 | 视频未播放时的预览图片路径。 |
controller | VideoController | 否 | 设置视频控制器。 |
和上一期一样,本系统依然是使用HTTP来实现的,这里使用了天气API来实现,通过输入地区即可获得很多天气数据。
未处理的数据如上,经过json分析后得到下图。
在这个基础上使用上节课的内容对文本进行拆分,比如我们要获得当前温度。
其数据是这样的,我们观察前面和后面"tem":“6”,“tem1”:“13”,使用掐头去尾法可以得到当前温度6℃。
本次不打算全部显示,这里挑选几个进行展示。
这里选择使用搜狗的语音转文字API,url如下:
寻找资源如上,但本次内容只选择云、雨、晴三个经典天气来分析,将三个图标放入目录下:
使用image控件进行生成。
Image(this.IMAGE_URL)
.width(200)
.height(200)
.objectFit(ImageFit.Fill)
同上期内容。
TextInput({ placeholder: '请输入要查询的城市', controller: this.controller })
.placeholderColor(Color.Grey)
.placeholderFont({ size: 25, weight: 400 })
.caretColor(Color.Blue)
.width('90%')
.height(80)
.margin(20)
.fontSize(25)
.fontColor(Color.Black)
.onChange((value: string) => {
this.IN_Value = value
console.log(JSON.stringify(this.IN_Value));
})
Button('查 询')
.width('60%')
.height(60)
.fontSize(30)
.onClick(() => {
});
Blank()
.height(20)
Text(this.Out_Value)
.fontSize(25)
.width('80%')
.height(300)
.textAlign(TextAlign.Center)
.border({ width: 1 })
在这里我们选择取巧的方式,使用vedio播放网络视频,只需要隐藏控制按钮,同时将控件的宽度和高度设置为1即可。
音频试听:https://tts.youdao.com/fanyivoice?word=一键三连&le=zh&keyfrom=speaker-target。
大家复制上面的url放进浏览器里面可用听到。
Video({
src: this.videoSrc,
controller: this.v_controller,
})
.controls(false)
.onStart(() => {
console.info('onStart')
})
.width(1)
.height(1)
我这里将我注册的API放上来了,key部分隐藏了,不能直接使用,大家去天气API那里申请个帐号就行,免费使用2000次。
httpRequest.request(
// 填写http请求的url地址,可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
"https://v0.yiketianqi.com/api?appid=56959347&appsecret=(责任编辑:娱乐)
5月30日沪深两市最新交易提示 新股宁德时代、绿色动力今日申购