Code Monkey home page Code Monkey logo

clplayer's Introduction

前言

    很早之前开源了一个简单的视频播放器,由于年久失修,效果惨目忍睹,最近特意花时间对其进行了深度重构。旧版本后期不再维护,新版本使用Swift实现,后续会增加更多功能。不想看文字的请自行下载代码------>>>CLPlayer

旧版本 VS 重构版本

1.新版本使用Swift,旧版本使用Objective-C

2.新版本采用自定义转场实现全屏,旧版本使用旋转屏幕

3.新版本不需要手动销毁播放器

4.新版本修复了老版本遗留bug

5.新版本降低了代码耦合性

6.新版本增加了倍数播放,切换填充模式

7.新版本提供更丰富的API

8.新版本适配了iPhone X

9.新版本移除了状态栏相关配置

效果

效果图

全屏

控制面板

UITableView

UICollectionView

功能

  • 支持Autolayout、UIStackView、Frame
  • 支持全屏模式、小屏模式
  • 支持跟随手机自动旋转
  • 支持本地视频、网络URL
  • 支持UITableView
  • 支持UICollectionView
  • 支持手势改变屏幕的亮度(屏幕左半边)
  • 支持手势改变音量大小(屏幕右半边)
  • 支持拖动UISlider快进快退
  • 支持iPhone X留海屏
  • 支持倍速播放(0.5X、1.0X、1.25X、1.5X、1.75X、2X
  • 支持动态改变播放器的填充模式(适应、拉伸、填充
  • 支持cocoapods

接入指南

项目必须支持全屏,建议将屏幕支持方向交由当前显示的控制器自行管理。

项目支持全屏方案

1.先勾选支持方向,只保留portrait,保证APP启动不会横屏

image.png

2.AppDelegate中重写func application(_ application: UIApplication, supportedInterfaceOrientationsFor window: UIWindow?) -> UIInterfaceOrientationMask {}方法

func application(_: UIApplication, supportedInterfaceOrientationsFor _: UIWindow?) -> UIInterfaceOrientationMask {
        return .allButUpsideDown
}

3.在父类中重写屏幕控制相关方法

// 是否支持自动转屏
override var shouldAutorotate: Bool {
    guard let navigationController = selectedViewController as? UINavigationController else { return selectedViewController?.shouldAutorotate ?? false }
    return navigationController.topViewController?.shouldAutorotate ?? false
}

// 支持哪些屏幕方向
override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
    guard let navigationController = selectedViewController as? UINavigationController else { return selectedViewController?.supportedInterfaceOrientations ?? .portrait }
    return navigationController.topViewController?.supportedInterfaceOrientations ?? .portrait
}

// 默认的屏幕方向(当前ViewController必须是通过模态出来的UIViewController(模态带导航的无效)方式展现出来的,才会调用这个方法)
override var preferredInterfaceOrientationForPresentation: UIInterfaceOrientation {
    guard let navigationController = selectedViewController as? UINavigationController else { return selectedViewController?.preferredInterfaceOrientationForPresentation ?? .portrait }
    return navigationController.topViewController?.preferredInterfaceOrientationForPresentation ?? .portrait
}

UINavigationController

// 是否支持自动转屏
override var shouldAutorotate: Bool {
    return topViewController?.shouldAutorotate ?? false
}

// 支持哪些屏幕方向
override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
    return topViewController?.supportedInterfaceOrientations ?? .portrait
}

// 默认的屏幕方向(当前ViewController必须是通过模态出来的UIViewController(模态带导航的无效)方式展现出来的,才会调用这个方法)
override var preferredInterfaceOrientationForPresentation: UIInterfaceOrientation {
    return topViewController?.preferredInterfaceOrientationForPresentation ?? .portrait
}

UIViewController

// 是否支持自动转屏
override var shouldAutorotate: Bool {
    return false
}

// 支持哪些屏幕方向
override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
    return .portrait
}

// 默认的屏幕方向(当前ViewController必须是通过模态出来的UIViewController(模态带导航的无效)方式展现出来的,才会调用这个方法)
override var preferredInterfaceOrientationForPresentation: UIInterfaceOrientation {
    return .portrait
}

4.部分页面需要支持多方向

在对应控制器中重写以下方法

override var shouldAutorotate: Bool {
    return true
}

// 支持哪些屏幕方向
override var supportedInterfaceOrientations: UIInterfaceOrientationMask {
    return .allButUpsideDown
}

基础配置

public struct CLPlayerConfigure {
    /// 顶部工具条隐藏风格
    public enum CLPlayerTopBarHiddenStyle {
        /// 小屏和全屏都不隐藏
        case never
        /// 小屏和全屏都隐藏
        case always
        /// 小屏隐藏,全屏不隐藏
        case onlySmall
    }

    /// 自动旋转
    public var isAutoRotate = true
    /// 手势控制
    public var isGestureInteractionEnabled = true
    /// 是否显示更多面板
    public var isShowMorePanel = true
    /// 顶部工具条隐藏风格
    public var topBarHiddenStyle: CLPlayerTopBarHiddenStyle = .onlySmall
    /// 工具条自动消失时间
    public var autoFadeOut: TimeInterval = 5
    /// 默认拉伸方式
    public var videoGravity: AVLayerVideoGravity = .resizeAspectFill
    /// 顶部工具条背景颜色
    public var topToobarBackgroundColor: UIColor = .black.withAlphaComponent(0.6)
    /// 底部工具条背景颜色
    public var bottomToolbarBackgroundColor: UIColor = .black.withAlphaComponent(0.6)
    /// 进度条背景颜色
    public var progressBackgroundColor: UIColor = .white.withAlphaComponent(0.35)
    /// 缓冲条缓冲进度颜色
    public var progressBufferColor: UIColor = .white.withAlphaComponent(0.5)
    /// 进度条播放完成颜色
    public var progressFinishedColor: UIColor = .white
    /// 转子背景颜色
    public var loadingBackgroundColor: UIColor = .white
    /// 返回按钮图片
    public var backImage: UIImage?
    /// 更多按钮图片
    public var moreImage: UIImage?
    /// 播放按钮图片
    public var playImage: UIImage?
    /// 暂停按钮图片
    public var pauseImage: UIImage?
    /// 进度滑块图片
    public var sliderImage: UIImage?
    /// 最大化按钮图片
    public var maxImage: UIImage?
    /// 最小化按钮图片
    public var minImage: UIImage?
    /// 封面图片
    public var maskImage: UIImage?
}

总结

    本次重构为Swift第一版,后续会持续更新,定制化开发请自行参考CLPlayer修改 , 如果喜欢,欢迎star。

参考资料

  1. iOS播放器全屏方案

  2. iOS状态栏

  3. iOS播放器全屏旋转实现

  4. iOS横竖屏旋转解决方案 - Swift

  5. iOS视频旋转探究

  6. iOS屏幕旋转的解决方案

clplayer's People

Contributors

aizexin avatar jmovxia avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

clplayer's Issues

Demo不能运行

您好,打开CLPlayerDemo.xcworkspace文件,提示error: /Users/mac/Downloads/CLPlayer-master/Pods/Target Support Files/Pods-CLPlayerDemo/Pods-CLPlayerDemo.release.xcconfig: unable to open file (in target "CLPlayerDemo" in project "CLPlayerDemo") (in target 'CLPlayerDemo'),不能运行,望解决。

Logo Design Offering as Open Source Contribution

Hello @JmoVxia . I'm a Graphics Designer. I'm happy to see an open source project, So, I want provide a logo for you. Would you mind if I propose a new logo design for your project as my Open Source Contribution?

Thanks for the attention.

提几个使用过程出现的问题

  1. 视频播放到最后(进度条到底了),拖拽进度条,你会发现,视频总时长变成0了,且恢复不过来。(必现bug)
  2. 视频加载过程中,播放暂停按钮不能点击,这与实际操作原则上不符合逻辑(也可能是bug吧)
  3. Slider 重写后,都跑进度条外面去了(可以调整适配一下)
    另外:期待作者能够把本地缓存功能弄上去,很多时候需求希望加载过后不必重新加载,当然也要提供清除缓存的功能。
    加油!作者很帅!

修改一下横竖屏的问题

1.demo里面同一个视频,不同的单击次数,有的时候显示横屏播放,有的时候竖屏播放.
2.我是用的时候设置了isLandscape横屏播放,但是没有效果呢

pod导入在图片无法加载出来,建议修改

这样就可以正常加载bundle图片
#pragma mark - 获取资源图片

  • (UIImage *)getPictureWithName:(NSString *)name{
    id bu = [NSBundle bundleWithPath:[[NSBundle bundleForClass:[CLPlayerMaskView class]] pathForResource:@"CLPlayer" ofType:@"bundle"]];
    NSString *path = [bu pathForResource:name ofType:@"png"];
    return [[UIImage imageWithContentsOfFile:path] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    }

全屏切换黑屏

我出现的问题是视频内容加载出来后进度有显示多少时间 这个全屏切换就没问题;如果是加载后没显示多少时间,转圈动画一直在转,这个情况全屏切回小屏发现多加载了一个新的播放view 有声音 黑屏

问题

你好。请问使用代码 去设置 不让它横屏的效果 isLandscape 我看了这个参数 也设置了测试没效果

内存泄漏

计时器中的block调用了self应该需要弱引用,不然无法释放

CPU 超过100%

进入播放时, 在转子为加载出视频并点击返回后, 出现CPU超过100%, 真机会发热并在10-20分钟不等闪退..希望能对这个问题进行修复..
image
你的demo也有这个问题
image

播放崩溃问题

[MediaRemote] [AVOutputContext] WARNING: AVF context unavailable for MRAVOutputContextCreateIndependentRoutingContext
2017-12-20 18:28:09.901805+0800 baizheli[5984:1980326] Task <935DD5D6-31D4-4FDA-9B32-795E1A73FFA6>.<2> finished with error - code: -999
2017-12-20 18:28:10.246783+0800 baizheli[5984:1980463] Task .<3> finished with error - code: -999
点击播放崩溃,这里是打印的崩溃信息,这里是什么原因造成的崩溃呢,没找到

多次 全屏播放 有问题

1,我的使用场景是这样的 一个横向滑动的collectionview 里面每个item都是点击之后横屏播放视频的 多点几次 你这个转子就时不时不消失了 底下的slider也不动了 再点点又好了... 能问下啥原因么 我用的是github上最新的代码;
2,一直重复点开一个item 横屏播放 只有第一次是正常的 其他的要么是转子不转并且slider不动 要么是状态栏还是竖屏的;

关于横竖屏切换导致黑屏

如题 我在第一次点击播放的时候切换横竖屏正常 然后第二次点击播放就会导致黑屏并且还取消不了 只能重新运行 求解决

好像avi格式的播放不了,关于tableview滑动的问题

我想问下我把播放器放在tableview的header上,没有放在cell上,当我滑动的时候一但播放器超出屏幕,再拉回来它就会从头开始播放了,能不能不从头开始播放,而且暂停呢,需要做哪些处理,谢谢了

兄弟 我想讨论个问题

如果视图使用masonry ,发现使用动画转屏,不能正常显示转屏的效果? 我暂时没搞懂怎么解决

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.