ios 仿优酷app主页分类滑动页面及流媒体视频播放

简述

仿照优酷app主页写的一个分类滑动页面控件，实现了包括字体缩放，下标缩进，主题颜色切换，渐变色，菜单编辑，流媒体播放等功能。git项目地址

演示图：

演示图总览.gif

使用方式

1.具有编辑菜单的分类滑动页

演示图1：

演示图1.gif

初始化和需要实现的协议

override func viewDidLoad() {
        super.viewDidLoad()

        // Do any additional setup after loading the view.

        //CFPageScrollView()是个viewcontroller，每个页面是childController，便于解耦
        pageView = CFPageScrollView()
        pageView.dataSource = self
        pageView.delegate = self
        addChild(pageView)
        pageView.didMove(toParent: self)
        pageView.view.frame = CGRect(x: 0, y: 0, width: SCREEN_WIDTH, height: SCREEN_HEIGHT)
        view.addSubview(pageView.view)
        
    }

// MARK: - PageScrollViewDelegate
extension CFHomePageController: PageScrollViewDelegate {

  //编辑完成时，这个代理会把数据传递出来
    func editFinishWith(_ completionData: Array) {
        
        if pageData == completionData as? Array {
            
            print("相等时不作操作")
        }
        else
        {
            //数据改变时，需要重载显示页面，这里我用coredata模拟了一个存取数据的逻辑，如果是网络请求，这部分逻辑提交给后台处理，你只用上传数据，然后reload。
         }
    }

}

// MARK: - PageScrollviewViewDataSource
extension CFHomePageController: PageScrollViewDataSource {
    
//是否需要显示编辑菜单
    func isDisplayMenu() -> Bool {
        return true
    }
    
//编辑菜单数组
    func getMenuData() -> Array {
        return menuDataSource
    }
    
//编辑菜单分组title
    func getMenuSectionTitle() -> Array {
        return ["显示频道","未显示频道"]
    }
 
//分类滑动页面数据
    func getScrollViewData() -> Array {
        return pageData
    }
    
//分类滑动页面颜色主题
    func getNavHeaderThemeColorWith(_ index: Int) -> Dictionary         {
         return [backgroundColorKey: ThemeBlackColor,
                norTextColorKey: ThemeGrayWhiteColor,
                selTextColorKey: ThemeBlueColor]
  
    }
   
//分类滑动页面搜索栏，SearchView为动态创建，identifier为重用标识
    func getSearchViewWith(_ index: Int) -> BaseSearchView {
        
       let view: BaseSearchView = pageView.reuseSearchViewWith(classString: "SearchView", identifier: "view1") as! BaseSearchView
       view.searchButtonTransitionAnimation(preWidth: preWidth)
       view.searchButton.addTarget(self, action: #selector(displaySearchController), for: .touchUpInside)
       preWidth = view.searchButton.mj_w

       return view
    }
}

2.普通分类滑动页

效果图：

演示图2.gif

普通分类滑动页面实现的协议：

// MARK: - PageScrollviewViewDataSource
extension CFHotspotController: PageScrollViewDataSource {
    
    func getScrollViewData() -> Array {
        return pageData
    }
    
    func getNavHeaderThemeColorWith(_ index: Int) -> Dictionary {

        return [backgroundColorKey: ThemeBlackColor,
                norTextColorKey: ThemeGrayWhiteColor,
                selTextColorKey: ThemeBlueColor]
  
    }
    
    func getSearchViewWith(_ index: Int) -> BaseSearchView {
        
        let view: BaseSearchView = pageView.reuseSearchViewWith(classString: "HotspotSearchView", identifier: "view") as! BaseSearchView
        view.searchButton.setTitle(pageData[index].title, for: .normal)
        view.searchButton.addTarget(self, action: #selector(displaySearchController), for: .touchUpInside)
        return view
    }
    
}

3.使用AVFoundation实现了一个简单流媒体播放器

效果图：

演示图3.gif

实现了播放，暂停，滑动快进，横竖屏切换等功能。 对该播放器的操作页面进行了简单封装，详情见工程。

初始化:

func initPlayer()
{
    playerView = PlayerView.init(frame: CGRect(x: 0, y: STATUSBAR_HEIGHT, width: view.frame.width, height: view.frame.width/16*9))
    playerView.delegate = self
    playerView.backgroundColor = ThemeBlackColor
    view.addSubview(playerView)
        
    let url = URL(string: "https://vd4.bdstatic.com/mda-igqy5ny4sn8uyby6/sc/mda-igqy5ny4sn8uyby6.mp4?auth_key=1564739152-0-0-7c8a2761260c09a1fab436cb2b53e9cc&bcevod_channel=searchbox_feed&pd=bjh&abtest=all")

    playerItem = AVPlayerItem(url: url!)
    //缓冲进度，其他属性可去AVPlayerItem类里面查看
    playerItem.addObserver(self, forKeyPath: "loadedTimeRanges", options: .new, context: nil)
    //播放状态
    playerItem.addObserver(self, forKeyPath: "status", options: .new, context: nil)
        
    avplayer = AVPlayer(playerItem: playerItem)
        
    (playerView.layer as! AVPlayerLayer).player = avplayer
    (playerView.layer as! AVPlayerLayer).videoGravity = .resizeAspect
    (playerView.layer as! AVPlayerLayer).contentsScale = UIScreen.main.scale
}

总结

断断续续写个多月，预想中的第一个版本完成了，中途遇到了些奇怪的问题，不过都解决了，感兴趣可以去我项目地址看看。git项目地址