美文网首页
swift中UICollectionView的使用

swift中UICollectionView的使用

作者: 不安分心 | 来源:发表于2016-12-17 10:37 被阅读0次
    class MainViewController: UIViewController {
    
        // 屏幕的宽和高
        let width = UIScreen.main.bounds.width
        let height = UIScreen.main.bounds.height
        
        override func viewDidLoad() {
            super.viewDidLoad()
            
            // 加载UICollectionView
            self.setupCollectionView()
        }
        
        // MARK: 加载UICollectionView
        func setupCollectionView() {
            // 1. 定义collectionView的布局类型,流布局
            let layout = UICollectionViewFlowLayout()
            // 2. 设置cell的大小
            layout.itemSize = CGSize(width: width/2, height: height/3)
            // 3. 滑动方向
            /**
             默认方向是垂直
             UICollectionViewScrollDirection.vertical  省略写法是.vertical
             水平方向
             UICollectionViewScrollDirection.horizontal 省略写法是.horizontal
             */
            layout.scrollDirection = .vertical
            // 4. 每个item之间最小的间距
            layout.minimumInteritemSpacing = 0
            // 5. 每行之间最小的间距
            layout.minimumLineSpacing = 0
            // 6. 定义一个UICollectionView 
            let collectionView = UICollectionView(frame: CGRect(x: 0, y: 0, width: width, height: height), collectionViewLayout: layout)
            collectionView.backgroundColor = UIColor.red
            
            // 7. 设置collectionView的代理和数据源
            collectionView.delegate = self
            collectionView.dataSource = self;
            
            // 8. collectionViewCell的注册
            collectionView.register(UINib(nibName: "CollectionViewCell", bundle: nil), forCellWithReuseIdentifier: "MyCell")
            // 9. header 的注册
            collectionView.register(UICollectionReusableView.self, forSupplementaryViewOfKind: UICollectionElementKindSectionHeader, withReuseIdentifier: "headView")
            
            self.view.addSubview(collectionView)
        }
    }
    
    extension MainViewController: UICollectionViewDataSource, UICollectionViewDelegate, UICollectionViewDelegateFlowLayout {
        
        // MARK: UICollectionViewDataSource 代理方法
        /**
            该方法为可选方法,默认为1
            return: collectionView中section的个数
         */
        func numberOfSections(in collectionView: UICollectionView) -> Int {
             return 1
        }
        
        // MARK: UICollectionviewDataSource  代理方法
        /**
            改方法为必选方法
            return: section中的item的个数
         */
        func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
             return 8
        }
        
        // MARK: UICollectionviewDataSource  代理方法
        /**
         改方法为必选方法
         return: 绘制collectionView的cell
         */
        func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
            let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "MyCell", for: indexPath) as! CollectionViewCell
            cell.imageView.image = UIImage(named: "\((indexPath as NSIndexPath).row + 2).png")
            cell.label.text = "美景\((indexPath as NSIndexPath).row + 1)"
            return cell
        }
        
        // MARK: UICollectionViewDelegate的代理方法
        /**
            Description: 当点击某个item之后的回应
         */
        func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
            print("(\((indexPath as NSIndexPath).section), \((indexPath as NSIndexPath).row))")
        }
    
        // MARK: UICollectionViewDelegateFlowLayout的代理方法
        /**
            return: header的大小
         */
        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, referenceSizeForHeaderInSection section: Int) -> CGSize {
            return CGSize(width: width, height: 17)
        }
        
        /**
            可以定制不同的item
            return: item的大小
         */
        func collectionView(_ collectionView: UICollectionView, layout collectionViewLayout: UICollectionViewLayout, sizeForItemAt indexPath: IndexPath) -> CGSize {
            if (indexPath as NSIndexPath).row % 2 == 1 {
                return CGSize(width: width/2, height: height/3)
            }
            else {
                return CGSize(width: width/2, height: height/2)
            }
        }
    
    }
    

    相关文章

      网友评论

          本文标题:swift中UICollectionView的使用

          本文链接:https://www.haomeiwen.com/subject/eapomttx.html