UltraDrawerView 使用教程

UltraDrawerView 使用教程

UltraDrawerView🐝 Super ultra drawer view项目地址:https://gitcode.com/gh_mirrors/ul/UltraDrawerView

1、项目介绍

UltraDrawerView 是一个轻量级的 Swift 库，旨在帮助 iOS 开发者轻松实现类似抽屉的界面交互效果。无需复杂的自定义布局或动画处理，这个库提供了简单易用的接口，可以方便地集成到你的 UITableView 或者任何其他 scrollView 中，为你的用户带来流畅的顶部和底部滑动体验。

2、项目快速启动

安装

首先，确保你已经安装了 CocoaPods。然后在你的 Podfile 文件中添加以下行：

pod 'UltraDrawerView'

保存并运行以下命令来安装依赖：

pod install

基本使用

在你的视图控制器中，导入 UltraDrawerView 并设置一个简单的抽屉视图：

import UltraDrawerView

class ViewController: UIViewController {
    var drawerView: DrawerView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // 创建一个简单的内容视图
        let contentView = UIView()
        contentView.backgroundColor = .blue

        // 初始化抽屉视图
        drawerView = DrawerView(with: contentView)
        drawerView.availableStates = [.top, .middle, .bottom]
        drawerView.middlePosition = .fromBottom(256)
        drawerView.cornerRadius = 16
        drawerView.containerView.backgroundColor = .white

        // 添加到主视图
        view.addSubview(drawerView)
        drawerView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            drawerView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            drawerView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            drawerView.topAnchor.constraint(equalTo: view.topAnchor),
            drawerView.bottomAnchor.constraint(equalTo: view.bottomAnchor)
        ])

        // 设置初始状态
        drawerView.setState(.middle, animated: false)
    }
}

3、应用案例和最佳实践

导航栏渐隐渐现效果

在用户滚动时，可以将导航栏作为一个抽屉头部进行渐隐渐现的效果展示：

class NavigationDrawerController: UIViewController {
    var drawerView: DrawerView!
    var scrollView: UIScrollView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // 创建一个滚动视图
        scrollView = UIScrollView()
        scrollView.contentSize = CGSize(width: view.bounds.width, height: 2000)
        view.addSubview(scrollView)

        // 创建导航栏视图
        let navBarView = UIView()
        navBarView.backgroundColor = .red

        // 初始化抽屉视图
        drawerView = DrawerView(with: navBarView)
        drawerView.availableStates = [.top, .middle]
        drawerView.middlePosition = .fromTop(64)

        // 添加到主视图
        view.addSubview(drawerView)
        drawerView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            drawerView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
            drawerView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
            drawerView.topAnchor.constraint(equalTo: view.topAnchor),
            drawerView.heightAnchor.constraint(equalToConstant: 64)
        ])

        // 监听滚动事件
        scrollView.delegate = self
    }
}

extension NavigationDrawerController: UIScrollViewDelegate {
    func scrollViewDidScroll(_ scrollView: UIScrollView) {
        let offsetY = scrollView.contentOffset.y
        if offsetY > 100 {
            drawerView.setState(.middle, animated: true)
        } else {
            drawerView.setState(.top, animated: true)
        }
    }
}

底部标签页控制器

在内容滚动时，可以隐藏或显示底部固定的标签页控制器：

class BottomTabDrawerController: UIViewController {

UltraDrawerView🐝 Super ultra drawer view项目地址:https://gitcode.com/gh_mirrors/ul/UltraDrawerView