基于 electron-vue 的音视频播放器 electron-player

LGPL
跨平台
2019-09-02
c10342

相关技术

  • electron:负责构建播放器的所需要的环境,提供访问系统资源的api(调用资源管理器,浏览器等等)以及打包成桌面应用程序
  • vue:负责构建播放器的界面
  • node:负责处理文件和路径问题,主要使用fs和path这2个模块
  • express:负责把视频读取出来,把视频以流的形式返回
  • html5相关技术:拖拽api,全屏api,Notification消息通知
  • DPlayer:音视频播放器核心组件

已实现功能

  • 视频播放:目前已经支持大多数视频格式,比如 MP4、WebM、mkv、avi、WMV、FLV、rmvb 等,后续会添加更多的视频格式
  • 音频播放:目前已经支持大多是音频格式,比如 MP3 等,后续会添加更多的音频格式
  • 换肤功能:该功能类似其他软件的换肤功能,用户可以根据自己的喜好选择不同的主题皮肤
  • 历史记录:音视频播放器会自动记录用户播放已经过的的视频或音频,比如音频或视频播放到那个时间
  • 记忆功能:音视频播放器会自动保存用户的操作和修改的配置,比如用户更换了主题皮肤,用户关闭了应用后再次打开,音视频播放器会应用用户已经修改的主题皮肤。用户对视频或音频进行加速等操作都会被记忆下来,用户再次点击该视频或音频就会恢复用户的操作
  • 播放模式:播放模式主要有5种,分别是 单个播放、单个循环、循环播放列表、顺序播放、随机播放
  • 排序模式:排序模式主要有5种,分别是 默认排序、大小排序、时间排序、随机排序、名称排序
  • 置顶功能:保持应用界面始终在最顶端
  • 加减速功能:音视频加速或者减速播放
  • 拖拽文件或文件夹:用户可以把文件或者文件夹拖拽进音视频播放器中,应用会过滤掉不能播放的文件
  • 全屏功能:实现了应用的全屏功能,这里是使用了electron提供的全屏api,没有使用html5的全屏api
  • 右键菜单功能:目前已经实现了大多数右键菜单的功能,没实现的后续实现

效果图

效果图1

效果图2

效果图3

效果图4

效果图5

效果图6

效果图7

的码云指数为
超过 的项目
加载中

评论(11)

松竹斋
松竹斋
我用pyqt 写个hello world也是100多M,还容易崩溃
gugu&gigi
gugu&gigi
真心不喜欢 electron 的应用,简简单单的一个"hello world"也要上百兆内存。vlc 不打开任何文件时也就几十兆内存,AIMP 音乐播放器貌似用delphi写,运行时也用不到一百兆内存。当然了,比起电脑上装的8G、16G内存,几百兆内存算不上什么。但是个人还是不喜欢内存这么个用法。
c
c10342 软件作者
这个看个人爱好把,electron的出现总有它的存在意义的,要说最好的还是用qt最好,微软自家的东西。electron主要适合开发一些简单的桌面应用,复杂的就不行了,耗内存,打包出来的体积大。
gugu&gigi
gugu&gigi
将原有web应用打包成桌面软件,或者利用web前端利用已知的web技术来构建桌面软件,这货还是有用的。不管如何,还是支持一下。
可以用扫地僧的miniblink
LifeRushing
LifeRushing
最新的射手播放器也是用这玩意搞的
威廉黄
威廉黄
用chrome内核,对于播放器来说还是耗一些内存的
TGVvbmFyZA
TGVvbmFyZA
這玩意性能不行吧,對於原生播放器完全沒優勢
liuyong051
liuyong051
一个桌面播放器还需要多么高的性能。
TGVvbmFyZA
TGVvbmFyZA
硬解8K視頻?
c
c10342 软件作者
是的,这个东西跟原生对比起来肯定是没多少优势的,主要的优势还是在于开发便捷吧,毕竟现在会写qt的并不是很多。性能方面虽然比不上原生的,但是可以满足日常的需求

暂无资讯

暂无问答

electron编译nodejs模块的方法

一、安装electron编译工具 npm install --save electron-rebuild npm install --save electron-prebuilt .\node_modules\.bin\electron-rebuild.cmd electron-prebuilt会下载electron源码速度...

05/17 14:44
33
0
在 Electron 真实浏览器环境运行和调试 Jest 单测

jest-electron 应该是最简单方便的模块,用于在 Electron 真实浏览器环境运行和调试 Jest 单测 项目地址:https://github.com/hustcc/jest-electron 使用 Install npm i --save-dev jest-el...

09/24 09:46
4
0
electron调试攻略

electron调试攻略 写在前面的话 通过对electron 快速入门的学习,可以得知electron是基于Node.js和Chromium浏览器两大技术实现的,因此我们的调试攻略可以分成两部分:主进程的调试和渲染进程...

2017/07/29 10:51
335
0
electron打包太慢解决方法

electron打包太慢解决方法 npm源太慢 可以用阿里云的npm也就是cnpm不过不推荐因为我用阿里云的npm的时候打包总是出问题 electron下载慢怎么办-手工完成 可以去阿里云的electron镜像下好对应版...

2018/08/11 00:49
850
0
electron 学习总结

###1.[Electron指南 - 快速入门](http://www.tuicool.com/articles/jYfuQfI) ###2.[使用 Electron 构建桌面应用](https://zhuanlan.zhihu.com/p/20225295?columnSlug=FrontendMagazine) ###3...

2016/10/25 19:36
173
0
Electron开发实战之记账软件1——开篇

代码仓库: https://github.com/hilanmiao/LanMiaoDesktop 核心功能是记账、收支明细,至于理财等额外功能,暂时不考虑了。 其他辅助功能: 1.TODO List:记录待办事项 2.电子卡管理:记录各...

04/11 16:02
1K
1
Electron 从零创建一个 Windows/OS X/Linux 的桌面可执行程序

序 每次 Electron 有最新新闻的时候,都会有很多朋友留言,问有没有相关教程,本人也是观察有一段时间了,一直鲜有人提供相关的学习内容,所以在此就给大家提供下一些入门和进阶教程,希望大...

2016/09/26 07:13
17K
17
初探Electron,从入门到实践

本文由葡萄城技术团队于博客园原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。 在开始之前,我想您一定会有这样的困惑:标题里的E...

08/29 16:38
77
0
Electron+vue做自己最简单的APP

用Electron和vue制作自己对简单的APP 惯例,贴自己码云地址 https://gitee.com/imbobo_bo/angel-bo 运行最简单的Electron 1.打造你的第一个 Electron 应用 Electron 可以让你使用纯 JavaScri...

2018/11/14 15:46
878
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部