//

//  HomeLiveRankCell.swift

//  YYSwiftProject

//

//  Created by Domo on 2018/7/28.

//  Copyright © 2018年 知言网络. All rights reserved.

//

import UIKit

class HomeLiveRankCell: UICollectionViewCell {

private var multidimensionalRankVosList: [MultidimensionalRankVosModel]?

private let LiveRankCellID = "LiveRankCell"

// MARK: - 滚动排行榜

private lazy var collectionView: UICollectionView = {

let layout = UICollectionViewFlowLayout.init()

layout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0)

layout.minimumInteritemSpacing = 0

layout.minimumLineSpacing = 0

layout.itemSize = CGSize(width: (YYScreenWidth-30), height:self.frame.size.height)

//        layout.sectionInset = UIEdgeInsetsMake(0, 0, 0, 0)

layout.scrollDirection = UICollectionViewScrollDirection.horizontal

let collectionView = UICollectionView.init(frame:.zero, collectionViewLayout: layout)

collectionView.contentSize = CGSize(width: (YYScreenWidth-30), height: self.frame.size.height)

collectionView.delegate = self

collectionView.dataSource = self

collectionView.backgroundColor = UIColor.white

collectionView.showsVerticalScrollIndicator = false

collectionView.showsHorizontalScrollIndicator = false

collectionView.isPagingEnabled = true

collectionView.register(LiveRankCell.self, forCellWithReuseIdentifier:LiveRankCellID)

return collectionView

}()

var timer: Timer?

override init(frame: CGRect) {

super.init(frame: frame)

self.backgroundColor = UIColor.white

self.addSubview(self.collectionView)

self.collectionView.snp.makeConstraints { (make) in

make.width.height.equalToSuperview()

make.center.equalToSuperview()

}

// 开启定时器

starTimer()

}

required init?(coder aDecoder: NSCoder) {

super.init(coder: aDecoder)

}

// 界面赋值并刷新

var multidimensionalRankVos:[MultidimensionalRankVosModel]? {

didSet {

guard let model = multidimensionalRankVos else { return }

self.multidimensionalRankVosList = model

self.collectionView.reloadData()

}

}

}

extension HomeLiveRankCell: UICollectionViewDataSource, UICollectionViewDelegate {

func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {

return (self.multidimensionalRankVosList?.count ?? 0)*100

}

func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

let cell:LiveRankCell = collectionView.dequeueReusableCell(withReuseIdentifier: LiveRankCellID, for: indexPath) as! LiveRankCell

cell.backgroundColor = UIColor.init(red: 248/255.0, green: 245/255.0, blue: 246/255.0, alpha: 1)

cell.multidimensionalRankVos = self.multidimensionalRankVosList?[indexPath.row%(self.multidimensionalRankVosList?.count)!]

return cell

}

func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {

print(indexPath.row%(self.multidimensionalRankVosList?.count)!)

}

/// 开启定时器

func starTimer () {

let timer = Timer.init(timeInterval: 3, target: self, selector: #selector(nextPage), userInfo: nil, repeats: true)

// 这一句代码涉及到runloop 和 主线程的知识,则在界面上不能执行其他的UI操作

RunLoop.main.add(timer, forMode: RunLoopMode.commonModes)

self.timer = timer

}

/// 在1秒后,自动跳转到下一页

@objc func nextPage() {

// 1.获取collectionView的X轴滚动的偏移量

let currentOffsetX = collectionView.contentOffset.x

let offsetX = currentOffsetX + collectionView.bounds.width

// 2.滚动该位置

collectionView.setContentOffset(CGPoint(x: offsetX, y: 0), animated: true)

}

//    // 监听collectionView的滚到

//    func scrollViewDidScroll(_ scrollView: UIScrollView) {

//        // 1、获取滚动的偏移量 + scrollView.bounds.width * 0.5给偏移量加一半,当滑动一般就滚动pageControl的当前选中

//        let offsetX = scrollView.contentOffset.x + scrollView.bounds.width * 0.5

//        // 2、计算pageContra的currentIndex。这 % (cycleModelArr?.count ?? 1)也是跟上同样道理

//        pageControl.currentPage = Int(offsetX / scrollView.bounds.width) % (imageArray?.count ?? 1)

//    }

//

/// 当collectionView开始拖动的时候,取消定时器

func scrollViewWillBeginDragging(_ scrollView: UIScrollView) {

self.timer?.invalidate()

self.timer = nil

}

/// 当用户停止拖动的时候,开启定时器

func scrollViewWillEndDragging(_ scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>) {

starTimer()

}

}

//

//  LiveRankCell.swift

//  YYSwiftProject

//

//  Created by Domo on 2018/7/28.

//  Copyright © 2018年 知言网络. All rights reserved.

//

import UIKit

class LiveRankCell: UICollectionViewCell {

private lazy var imageView : UIView = {

let imageView = UIView()

return imageView

}()

private lazy var titleLabel : UILabel = {

let label = UILabel()

label.font = UIFont.systemFont(ofSize: 18)

return label

}()

private lazy var label : UILabel = {

let label = UILabel()

label.text = ">"

label.textColor = UIColor.lightGray

return label

}()

override init(frame: CGRect) {

super.init(frame: frame)

self.addSubview(self.titleLabel)

self.titleLabel.snp.makeConstraints { (make) in

make.left.equalToSuperview().offset(10)

make.height.equalTo(40)

make.width.equalTo(100)

make.centerY.equalToSuperview()

}

self.addSubview(self.imageView)

self.imageView.snp.makeConstraints { (make) in

make.right.equalToSuperview().offset(-5)

make.top.equalToSuperview().offset(5)

make.bottom.equalToSuperview().offset(-5)

make.width.equalTo(180)

}

self.imageView.addSubview(self.label)

self.label.snp.makeConstraints { (make) in

make.right.equalToSuperview().offset(-5)

make.height.width.equalTo(10)

make.centerY.equalToSuperview()

}

}

required init?(coder aDecoder: NSCoder) {

super.init(coder: aDecoder)

}

var multidimensionalRankVos:MultidimensionalRankVosModel? {

didSet {

guard let model = multidimensionalRankVos else { return }

self.titleLabel.text = model.dimensionName

let num:Int = (model.ranks?.count)!

let margin:CGFloat = 50

for index in 0..<num {

let picView = UIImageView.init(frame: CGRect(x:margin*CGFloat(index)+5*CGFloat(index),y:5,width:margin,height:margin))

picView.layer.masksToBounds = true

picView.layer.cornerRadius = picView.frame.size.width/2

picView.kf.setImage(with: URL(string: (model.ranks?[index].coverSmall!)!))

self.imageView.addSubview(picView)

}

}

}

}

swift中使用UIColllectionView实现横向轮播的一般方法的更多相关文章

  1. js 实现横向轮播效果

    参考:https://www.cnblogs.com/LIUYANZUO/p/5679753.html html: <!DOCTYPE html> <html> <hea ...

  2. Bootstrap 历练实例-轮播(carousel)插件方法

    方法 下面是一些轮播(Carousel)插件中有用的方法: 方法 描述 实例 .carousel(options) 初始化轮播为可选的 options 对象,并开始循环项目. $('#identifi ...

  3. React中使用CSSTransitionGroup插件实现轮播图

    动画效果,是一个页面上必不可少的功能,学习一个新的东西,当然就要学习,如何用新的东西,用它的方法去实现以前的东西啦.今天呢,我就在这里介绍一个试用react-addons-css-transition ...

  4. html中使用JS实现图片轮播效果

    1.首先是效果图,要在网页中实现下图的轮播效果,有四张图片,每张图片有自己的标题,然后还有右下角的小方框,鼠标悬浮在小方框上,会切换到对应的图片中去. 2.先是HTML中的内容,最外层是轮播图整个的容 ...

  5. 记一个jquery 无缝轮播的制作方法

    接触前端也很久了,今天才发现,要做好一个轮播,其实有很多东西需要考虑进去,否则做出来的轮播效果并不好,下面我就来做一个轮播,是依赖jquery来写的 1.要做轮播,首先需要的是HTML的内容,css的 ...

  6. 移动端轮播图实现方法(dGun.js)

    本文章介绍在移动端无缝隙轮播图实现的原理,这个轮子比较简单,但可以方便刚刚入门的同学参考.最终效果是在移动端无缝隙无限滑动,可以自定义轮播的速度.支持手势左右滑动.最后会放上源码. HTML部分 &l ...

  7. H5制作显示轮播图的方法Swiper

    1.需要引入Swiper插件 <!-- swiper插件 --> <link rel="stylesheet" href="https://unpkg. ...

  8. swiper横向轮播--3d

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  9. swiper横向轮播(兼容IE8)

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

随机推荐

  1. Java枚举类型enum使用详解

      java的Enum枚举类型终于在j2se1.5出现了.之前觉得它只不过是鸡肋而已,可有可无.毕竟这么多年来,没有它,大家不都过得很好吗?今日看<Thinking in Java>4th ...

  2. python-python基础6(面向对象)

    一.面向对象编程 编程范式 编程是 程序 员 用特定的语法+数据结构+算法组成的代码来告诉计算机如何执行任务的过程 , 一个程序是程序员为了得到一个任务结果而编写的一组指令的集合,正所谓条条大路通罗马 ...

  3. Rancher概述

    概述 What’s Rancher? Rancher是一套容器管理平台,它可以帮助组织在生产环境中轻松快捷的部署和管理容器. Rancher可以轻松地管理各种环境的Kubernetes,满足IT需求并 ...

  4. vCenter 导入Windows Server 2003/XP自定义规范失败

    1.vcsa 切换到/etc/vmware-vpx/sysprep目录下,会有很多个目录,根据Windows Server 2003的版本,64位找到 svr2003-64 这个目录,32位找到svr ...

  5. vux 中 this.$vux.loading undefined 的问题

    时间:2018-04-03 摘要:this.$vux.loading 报 undefined 今天在使用 事件触发 vux 的 loading  组件时,发现无法触发成功,显示 undefined 然 ...

  6. other#nginx配置

    #user nobody; worker_processes ; #error_log logs/error.log; #error_log logs/error.log notice; #error ...

  7. java不要登录发送邮件noReply

    最近在工作中遇到一个问题: 客户需要让我们的系统给他们发邮件,但是不给我们提供用户密码. 这样就导致一个问题,即,一般我们使用的都是smtp方式发邮件,发邮件的时候必须登录,虽然可以修改发件人的邮箱名 ...

  8. eshop-环境配置

    1. iptables # Generated by iptables-save v1. :: #*filter #:INPUT ACCEPT [:] #:FORWARD ACCEPT [:] #:O ...

  9. jmeter非GUI模式命令

    一.如果没有.jtl文件,运行如下命令: jmeter -n -t baidu.jmx -l result.jtl 以非GUI形式运行Jmeter脚本jmeter -n -t baidu.jmx -l ...

  10. CSS - input 只显示下边框

      CSS 样式 :   border:none;   border-bottom: 1px solid #000