videoplayer

HTML5

痞子三分冷 提交于 2020-02-28 19:36:46
下面不使用<video>的controls属性,通过创建一个自定义播放器演示如何使用js操作<video>元素。 效果图如下: 实现功能如下: (1)可以播放,暂停,停止视频。 (2)可以改变播放速度(2倍速度加速播放,一半的速度慢速播放,正常速度播放) (3)播放时有进度条,同时还能显示已播放时间。 代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 <!DOCTYPE html> <html> <head> <meta charset= "utf-8" > <title>hangge.com</title> </head> <style> #durationBar{ border:solid 1px #164900; width:100%; margin-bottom:5px; }

[Unity3D基础]VR全景视频

限于喜欢 提交于 2020-01-14 02:11:17
全景视频 相关介绍 Unity操作步骤 需求和思路 代码 相关组件Video Player Resources用法 相关介绍 陀螺仪脚本GyroContoller,发布到移动端,根据手机水平旋转来自动检测器方向并进行相关角度的变化。 根据项目需求创建模型 游戏对象父子集关系 根据需求设置Camera 材质球 VideoPlayer组件,Audio Source组件 Unity操作步骤 添加资源VRVideo 创建一个球Sphere,重置position 将Main Camera放在Sphere的子对象上,重置position 创建一个材质,shader设置为Sprites的Default 创建一个文件夹,命名为Resources(不要拼错),将VRVideo视频加入本文件夹 创建VideoTest脚本,绑定在Sphere上 需求和思路 需求:通过脚本读取视频和音频 思路一:通过URL方式 /// 1、通过脚本添加2个组件—声音和视频 /// 2、修改VideoPlayer属性Source属性为URL /// 3、读取视频所在路径 /// 4、播放视频 代码 using System . Collections ; using System . Collections . Generic ; using UnityEngine ; //引入命名空间 using UnityEngine

vue视频播放器vue-video-player

╄→гoц情女王★ 提交于 2020-01-04 18:34:12
npm i vue-video-player -D main.js引入 import VideoPlayer from ‘vue-video-player’ require(‘video.js/dist/video-js.css’) require(‘vue-video-player/src/custom-theme.css’) Vue.use(VideoPlayer) < template > < div class = " my-video " > < van-swipe ref = " goods_swipe " class = " goods-swipe " @change = " onChange " > < van-swipe-item > < video-player class = " goods-video " ref = " videoPlayer " :options = " playerOptions " > </ video-player > </ van-swipe-item > < van-swipe-item v-for = " (item,index) in imgList " :key = " index " > < van-image :src = " item.image " /> </ van-swipe-item > < div

Egret之视频流播放(初级)

依然范特西╮ 提交于 2019-12-06 18:43:54
一 : 前景 最近又时间学习了一下视频流这玩意。可能是想到5G来临,再加上WebRTC这玩意的出现,以后H5Game的IM系统将不限于单纯的文本了。故此,研究了一番,仅作抛砖引玉。 二 : 方案 ① , 使用HTML5标签<video>来播放视频 如下: <video autoplay playsinline id="videoPlayer"></video> a,autoplay : 自动播放 b,playsinline : 使用本标签播放(不使用第三方) ② ,获取video标签 private _videoPlayer : any = null; this._videoPlayer = document.querySelector("video#videoPlayer"); ③,使用navigator.mediaDevices.getUserMedia获得媒体流 private init2RTC : Function = () : void => { if( !navigator.mediaDevices || !navigator.mediaDevices.getUserMedia ){ console.log(`getUserMedia is not supported!`); }else{ this._videoPlayer = document

【转自红鱼儿】使用ALVideoPlayerSurface制作视频播放器

我的梦境 提交于 2019-12-06 10:54:13
头两天介绍了开源控件包alcinoe,现在利用其中的ALVideoPlayerSurface视频播放控件,实作一个视频播放器。 首先,建一个fmx项目,然后从组件面版,拖放一个TAlVideoPlayerSurface组件。 设置对齐方式为Client,占整个窗大小,然后再放一个Button,实现Click事件: procedure TForm3.Button1Click(Sender: TObject); begin if ALVideoPlayerSurface1.VideoPlayer.state in [vpsIdle] then begin ALVideoPlayerSurface1.VideoPlayer.setLooping(true); ALVideoPlayerSurface1.VideoPlayer.prepare('http://distribution.bbb3d.renderfarming.net/video/mp4/bbb_sunflower_1080p_30fps_normal.mp4', True{AutoStartWhenPrepared}); // << no sound on ios, don't know why :( end; end; 在Libraries中,增加三个jar库: 这三个库在alcinoe组件的lib目录中,如D:

swift 关于视频控件BMPlayer

流过昼夜 提交于 2019-12-05 12:05:34
因为要写一个不占全面屏的视频,之前写的方法就不能用了,找到了一个神奇的控件,是一个大佬根据AVPlayer封装的。 代码如下: //声明 var videoPlayer : BMPlayer! //创建 videoPlayer = BMPlayer() //设置视频网址,videoURL是视频链接,是字符串,name后填写视频的名称 let asset = BMPlayerResource(url: URL(string: videoURL)!, name: videoNAME, cover: nil, subtitle: nil) videoPlayer.setVideo(resource: asset) //添加到视图 self.view.addSubview(videoPlayer) videoPlayer.snp.makeConstraints{ (make) -> Void in make.top.left.right.equalTo(0) make.height.equalTo(videoPlayer.snp.width).multipliedBy(9.0/16.0).priority(750) } videoPlayer.backBlock = { [unowned self] (isFullScreen) in if isFullScreen == true{

Rexsee API介绍:Android视频播放,Rexsee的VideoPlayer函数说明与源码

心不动则不痛 提交于 2019-12-03 15:51:13
在Android上实现视频播放并不是非常困难,可以直接通过MediaPlayer类,也可以用VideoView进行封装。这里介绍的是Rexsee的VideoPlayer扩展,支持直接使用js。 【函数】 boolean start(String url,String style,boolean looping) 【说明】 播放本地或网络视频,如果是网络视频,在缓冲过程中会触发onVideoBufferingUpdated()事件,读取到视频信息时会触发onVideoPlayerInfo()事件,播放完毕会触发onVideoPlayCompleted事件,视频尺寸改变时会触发onVideoSizeChanged事件。 【返回】 true或false。 【参数】 url:要播放的本地视频("file://xxxxx")或网络视频("http://xxxxxx")的路径。 style:播放器对话框的样式。 looping:是否循环播放。 【示例】 rexseeDownload.download('http://www.rexsee.com/images/test.wmv'); function onDownloadFinished(url,path){ rexseeVideoPlayer.start(path,'window-dim-amount:0;window-moveable

use webkit-playsinline in javascript

匿名 (未验证) 提交于 2019-12-03 08:59:04
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试): 问题: How do I use webkit-playsinline in javascript instead of in html5 video tag? I want to use it just like using video tag control/autoplay attribute in javascript or if you guys have any other method that is working? I'm working on a PhoneGap iOS app that stream video. Below is some approach that I have tried but none are working: videoPlayer.WebKitPlaysInline = "webkit-playsinline"; videoPlayer.WebKitPlaysInline = "WebKitPlaysInline"; videoPlayer.webkit-playsinline = "webkit-playsinline"; videoPlayer.WebKitPlaysInline = "true"; videoPlayer

AVPlayerItem addobserver issue in iOS8

匿名 (未验证) 提交于 2019-12-03 08:59:04
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效,请关闭广告屏蔽插件后再试): 问题: Hi I am playing video on my UITableViewCells using AVPlayer, It was working fine on iOS 7, but in iOS8 it crashing with following error. 'An instance 0x7c01b000 of class AVPlayerItem was deallocated while key value observers were still registered with it. Here is my code - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { ......... ......... if(cell.videoPlayer!= nil && cell.videoPlayer.currentItem != nil) { [cell.videoItem removeObserver:self forKeyPath:@"playbackBufferEmpty" context:nil]

VUE- 引用视频组件

别等时光非礼了梦想. 提交于 2019-11-27 21:19:19
VUE- 引用视频组件 安装依赖 cnpm install vue-video-player -Scnpm install --save video.js 全局引用: 在main.js中 import VuevideoPlayer from 'vue-video-player'; import 'video.js/dist/video-js.css'; Vue.use(VuevideoPlayer); 或组件内引用: import { videoPlayer } from 'vue-video-player' import 'video.js/dist/video-js.css' export default { components: { videoPlayer } } 界面部分 <video-player class="video-player vjs-custom-skin" ref="videoPlayer" :playsinline="true" :options="playerOptions" ></video-player> 样式表,设置播放按钮的形状与位置: .video-js .vjs-big-play-button{} data 部分 data() { return { playerOptions: { playbackRates: [0.7, 1.0, 1.5