首页 > 其他分享 >【快应用】视频如何根据网络状态播放和暂停

【快应用】视频如何根据网络状态播放和暂停

时间:2023-04-04 09:24:20浏览次数:46  
标签:info 视频 currentType network 暂停 console 播放 data

【关键词】

视频,网络,播放与暂停

 

【现象描述】

如今丰富的流媒体时代需要消耗大量的流量,因此需要实现的功能是:

在wifi环境下,可以实现视频的自动播放;切换到移动网络时,需要暂停视频播放,必须用户手动操作才能继续播放。

 

【实现方法】

1、可以通过network.subscribe接口全局监听网络状态的变化,获取网络状态的回调。

2、获取回调信息后,判断当前环境是wifi还是移动网络,从而对video组件进行播放/暂停控制。

详细示例代码如下。

app.ux代码:

<script>

import network from '@system.network';

module.exports = {

onCreate() {

console.info('Application onCreate');

this.listenNetwork();

},

onDestroy() {

console.info('Application onDestroy');

network.unsubscribe();

},

listenNetwork: function () {

console.info("listenNetwork START ");

var that = this

network.subscribe({

callback: function (ret) {

that.data.localeData.currentType = ret.type;

console.info("listenNetwork CALLBACK :" + that.data.localeData.currentType);

},

fail: function (erromsg, errocode) {

console.log('network.subscribe----------' + errocode + ': ' + erromsg)

}

})

},

data: {

localeData: {

currentType: '',

}

}

}

</script>

hello.ux代码:

<template>

<div class="container">

<text class="title">Network Type:{{currentType.currentType}}</text>

<video id="video" style="height: 50%;width: 100%;" src="../Common/demo.mp4"></video>

</div>

</template>

<style>

.container {

flex-direction: column;

justify-content: center;

align-items: center;

}

.title {

font-size: 40px;

}

</style>

<script>
import prompt from '@system.prompt';
module.exports = {
data: {
componentData: {},
currentType: {},
},
onInit() {
this.$page.setTitleBar({
text: 'menu',
textColor: '#ffffff',
backgroundColor: '#007DFF',
backgroundOpacity: 0.5,
menu: true
});
this.currentType = this.$app.$def.data.localeData;
this.$watch('currentType.currentType', 'listenNetType');
},
listenNetType: function (newValue, oldValue) {
console.info("listenNetType newValue= " + newValue + ", oldValue=" + oldValue);
if (newValue === 'wifi') {
this.$element("video").start();
prompt.showToast({
message: 'Wi-Fi, start.',
duration: 3000,
gravity: 'center'
})
} else {
this.$element("video").pause();
prompt.showToast({
message: 'non Wi-Fi, pause.',
duration: 3000,
gravity: 'center'
})
}
},
}
</script>

​ 欲了解更多更全技术文章,欢迎访问https://developer.huawei.com/consumer/cn/forum/?ha_source=zzh

标签:info,视频,currentType,network,暂停,console,播放,data
From: https://www.cnblogs.com/developer-huawei/p/17285267.html

相关文章

  • <Android> ListView 列表控件的使用-李国庆-专题视频课程
    ListView列表控件的使用—15573人已学习课程介绍        1,ListView介绍;2,原理讲解;3,简单实现;4,ListView扩展;课程收益    通过学习本课程,具有一定的Android开发技能和知识,熟练掌握这一专题中集成组件与布局属性、实现listview基本用法,及简单扩展。讲师介绍    ......
  • 我们都错了,Color不是视频或图片分享应用,而是你的现场直播
    关注应用的人应该对之前的社交照片分享应用Color.com的故事不会陌生,未上线即被投4100万种子美金,不过最引人注目的也许不是这个应用本身,而是它所犯的错误及其如昙花一现的生命,当时人们都嘲笑,谴责,甚至称Color拉响投资警钟,投资人豪掷4100万美元只是举办了一场无人问津的派对。但是......
  • 团队博客原型展示以及视频链接
    电梯演讲_哔哩哔哩_bilibili部分代码:<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><styletype="text/css">.filebutton{posi......
  • FFmpeg再学习 -- FFmpeg+SDL+MFC实现图形界面视频播放器
    继续看雷霄骅的课程资料-基于FFmpeg+SDL的视频播放器的制作最后一篇,主要是想学一下MFC创建和配置。一、创建MFC工程文件->新建->项目->VisualC++->MFC应用程序应用程序类型,选择基于对话框生成效果如下:二、设置控件找到“工具箱”,就可以将相应的控件拖拽至应用程序对话框......
  • mp4v2再学习 -- H264视频编码成MP4文件
    一、H264视频编码成MP4文件参看:H264视频编码成MP4文件参看:mp4v2在VS2010下的编译与在项目中的使用最近做项目需要将H264文件封装为mp4文件,从网上找到了MP4V2库,下载下来后不知道从何下手,官方网站https://code.google.com/p/mp4v2/在windows下的编译过程介绍的很简短,对刚刚开始使用VS......
  • 4.3电梯演说视频和原型展示
               团队项目电梯演说_哔哩哔哩_bilibili......
  • 电梯演讲视频以及原型展示
    电梯演讲视频地址:【电梯演讲-哔哩哔哩】 https://b23.tv/PpzCo2O源码:<%@pagecontentType="text/html;charset=UTF-8"language="java"%><!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8">......
  • 视频画中画怎么编辑?视频画中画软件分享!​
    视频画中画是一种视频播放技术,它可以在一个视频播放的同时,将另一个视频或图片以小窗口的形式展示在视频上方或下方的某个位置,通常用于同时展示多个视频或图片,这种技术可以在学习、工作和娱乐等场景中使用,比如在学习时,可以在观看教学视频的同时,打开一个小窗口播放相关的实例操作视频......
  • 视频特效如何制作?视频特效软件分享!​
    视频特效如何制作?视频特效是指在视频制作过程中添加的各种特殊效果。这些特效可以是视觉上的,如图像滤镜、颜色调整、特殊光效和动画;也可以是声音上的,如回声、混响和音量控制。在现代电影和电视制作中,视频特效已经成为必不可少的一部分。它们可以使场景更加真实、更有趣,并提高观众的......
  • 首份视频报告:日本网民每月平均点击242.5个视频
    全球互联网信息服务提供商comScore最近对外公布了一份关于亚洲在线视频的消费报告,给那些研究消费者数字行为的公司带来了很好的参考价值。该公司的亚太地区高级副总裁JoeNguyen指出:“观看在线视频已经成为大部分消费者打发时间的活动,这为内容提供商和广告商带来了商机。我们预计......