新特性引导页

新特性引导页,第1张

1. ViewController的创建: NewFeatureViewController.swift

/// 可重用 CellId
private let WBNewFeatureViewCellId = "WBNewFeatureViewCellId"

/// 新特性图像的数量
private let WBNewFeatureImageCount = 4

class NewFeatureViewController: UICollectionViewController {
    //懒加载属性,必须要在控制器实例化之后才会被创建
    //private lazy var layout = UICollectionViewFlowLayout()
    
    //MARK: - 构造函数
    init(){
        // super.指定的构造函数
        let layout = UICollectionViewFlowLayout()
        layout.itemSize = UIScreen.main.bounds.size
        layout.minimumInteritemSpacing = 0
        layout.minimumLineSpacing = 0
        layout.scrollDirection = .horizontal
        //构造函数,完成之后内部属性才会被创建
        super.init(collectionViewLayout: layout)
        //开启分页
        collectionView.isPagingEnabled = true
        //关闭d簧效果
        collectionView.bounces = false
        //关闭指示器
        collectionView.showsHorizontalScrollIndicator = false
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    //iOS 7.0  开始,推荐要隐藏状态栏,可以每个控制器分别设置,默认是 NO
    override var prefersStatusBarHidden: Bool{
        return true
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        //注册可重用 Cell
        self.collectionView!.register(NewFeatureCell.self, forCellWithReuseIdentifier: WBNewFeatureViewCellId)
    }

    // MARK: UICollectionViewDataSource
    //每个分组中,格子的数量
    override func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        
        return WBNewFeatureImageCount
    }

    //Cell
    override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: WBNewFeatureViewCellId, for: indexPath) as! NewFeatureCell
        // Configure the cell
        //cell.backgroundColor = indexPath.row % 2 == 0 ? .orange : .cyan
        cell.imageIndex = indexPath.item
        return cell
    }
    
    //ScrollView 停止滚动方法
    override func scrollViewDidEndDecelerating(_ scrollView: UIScrollView) {
        //在最后一页才调用动画方法
        //根据 contentOffset 计算页数
        let page = Int(scrollView.contentOffset.x / scrollView.bounds.width)
        //判断是否是最后一页
        if page != WBNewFeatureImageCount - 1 {
            return
        }
        //Cell 播放动画
        let cell = collectionView.cellForItem(at: IndexPath(item: page, section: 0)) as! NewFeatureCell
        cell.showButtonAnim()
    }
}

2. 自定义 Cell

/// MARK: - 新特性 Cell
private class NewFeatureCell: UICollectionViewCell{
    /// 图像属性
    var imageIndex: Int = 0 {
        didSet{
            iconView.image = UIImage(named: "new_feature_\(imageIndex + 1)")
            //隐藏按钮
            startButton.isHidden = true
        }
    }
    
    /// 点击开始体验按钮
    @objc private func clickStart(){
        print("clickStart")
    }
    
    /// 显示按钮动画
    func showButtonAnim(){
        startButton.isHidden = false
        startButton.transform = CGAffineTransform(scaleX: 0, y: 0)
        startButton.isUserInteractionEnabled = false
        UIView.animate(
            withDuration: 1.7,            //动画时长
            delay: 0,                     //延时时间
            usingSpringWithDamping: 0.8,  //d力系数,0 - 1,越小越d
            initialSpringVelocity: 10,    //初始速度,模拟重力加速度
            options: [])                  //动画选项
        {
            self.startButton.transform = CGAffineTransform.identity
        } completion: { Bool in
            print("OK")
            self.startButton.isUserInteractionEnabled = true
        }
    }
    
    //frame 的大小是 layout.itemSize 指定的
    override init(frame: CGRect) {
        super.init(frame: frame)
        setupUI()
    }
    
    required init?(coder: NSCoder) {
        fatalError("init(coder:) has not been implemented")
    }
    
    //设置UI
    private func setupUI(){
        //1.添加控件
        addSubview(iconView)
        addSubview(startButton)
        //2.指定位置
        iconView.frame = bounds
        //不能单单在这设置隐藏
        startButton.isHidden = true
        //自动布局
        startButton.snp.makeConstraints { make in
            make.centerX.equalTo(self.snp.centerX)
            make.bottom.equalTo(self.snp.bottom).multipliedBy(0.7)
        }
        //监听方法
        startButton.addTarget(self, action: #selector(clickStart), for: .touchUpInside)
    }
    
    //MARK - 懒加载控件
    //图像
    private lazy var iconView = UIImageView()
    //开始体验按钮
    private lazy var startButton:UIButton = UIButton(title: "开始体验", color: .white, imageName: "new_feature_finish_button")
}

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/993456.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-21
下一篇 2022-05-21

发表评论

登录后才能评论

评论列表(0条)

保存