NavigationView 1.1.3

NavigationView 1.1.3

renchaopeng 维护。



  • cpcoder

NavigationView

CI Status Version License Platform

示例

要运行示例项目,首先克隆仓库,然后从 Example 目录中运行 pod install

要求

安装

NavigationView 可以通过 CocoaPods 获得。要安装它,只需将以下行添加到您的 Podfile 中

pod 'NavigationView'

使用

配置导航栏

// 全局导航配置, 都有默认值
NavigationManager.shared.configNavigation { config in
    /// 后退按钮图片名称,默认:"nav_btn_close_pre"
    config.backImageName = "nav_btn_close_pre"
    /// 左键到屏幕的距离,默认:8 pt
    config.leftSpacing = 8
    /// 右视图到屏幕的距离,默认:8 pt
    config.rightSpacing = 8
    /// 标题颜色,默认:UIColor.black
    config.titleColor = UIColor.black
    /// 背景色,默认:UIColor.clear
    config.backgaroundColor = UIColor.clear
    /// 右侧每一项的高度,默认:30 pt
    config.rightViewItemsHeight = 30
    /// 右侧有多个项目时项目之间的间距,默认:10 pt
    config.rightViewItemsSpacing = 10
    /// 标题字体,默认:UIFont.systemFont(ofSize: 15, weight: .medium)
    config.titleFont = UIFont.systemFont(ofSize: 15, weight: .medium)
}

初始化导航控制器

window = UIWindow(frame: UIScreen.main.bounds)
window?.backgroundColor = .white
window?.rootViewController = UINavigationController(rootViewController: AViewController())
window?.makeKeyAndVisible()

控制器中的导航栏设置

导航栏默认没有底部线条,如果需要的话,使用变量接收

1. 导航条控件设置

a: 设置有标题的导航

// 此方法返回一个UIButton对象, 可用变量接收后添加自定义编辑
title("AViewController")

b: 设置没有标题的导航

// 此方法返回一个UIButton对象, 可用变量接收后添加自定义编辑
title("")

或者

// 此方法返回一个NavigationView对象, 可用变量接收后添加自定义控件
let naviView = navigationView()
naviView.backgroundColor = .red

2. 左侧返回按钮的展示

a: 正常返回按钮

// 此方法返回一个UIButton对象, 可用变量接收后添加自定义编辑
showBackButton()

b: 当前页面自定义返回按钮,例如,模态一个 NavigationController,左上角返回按钮图标可能是 X

// 以下两种方法效果相同
// 区别: 
// 方法1会如果不传参数会使用导航条配置中的返回按钮icon
// 1.使用返回按钮的方法
// 此方法返回一个UIButton对象, 可用变量接收后添加自定义编辑
// 如果NavigationManager配置了返回按钮的icon名称 使用: 
showBackButton()
// 如果在当前页面返回icon有区别于配置的icon名称, 使用以下两种方法
showBackButton(image: UIImage(named: "ex_image_name"))
// 2.或者使用左侧按钮的方法
// 此方法返回一个UIButton对象, 可用变量接收后添加自定义编辑
showLeftButton(image: UIImage(named: "ex_image_name"))

补充:返回(左侧)按钮的事件,在 UIViewController 中按需重写

override func popViewController() {
    super.popViewController()
    // 返回事件里添加自己的代码
}

3. 右侧返回按钮的展示

需要手动添加回调事件方法

// 右侧按钮是一个icon
let rightImgBtn = addRightBtn(image: UIImage(named: "ex_image_name"))
rightImgBtn.addTarget(self, action: #selector(rightBtnAction), for: .touchUpInside)
// 右侧按钮仅文本
let rightTitleBtn = addRightBtn(title: "右侧按钮")
rightImgBtn.addTarget(self, action: #selector(rightBtnAction), for: .touchUpInside)

// 注意: 以上两种均返回UIButton对象, 接收后可设置属性

布局

添加导航栏后,当前 ViewController 的 view 是全屏的

因此需要在 ViewController 的 View 子控件布局顶部为导航栏保留高度

附上导航栏精确高度定义,包括刘海屏和非刘海屏

/// 状态栏高度
let StatusBarHeight: CGFloat = UIApplication.shared.statusBarFrame.size.height
/// 导航栏高度: 状态栏高度 + 44
let NavigationHeight: CGFloat = StatusBarHeight + 44

布局示例 demo

// 使用SnapKit布局
// top.equalTo(NavigationHeight) 留出导航条的高度
view.addSubview(iMainTb)
iMainTb.snp.makeConstraints { (make) in
    make.top.equalTo(NavigationHeight)
    make.left.right.bottom.equalToSuperview()
}
// 使用CGRect布局
// y: 导航条高度, 留出导航条的高度
iMainTb.frame = CGRect(x: 0,
                       y: NavigationHeight,
                       width: UIScreen.main.bounds.width,
                       height: UIScreen.main.bounds.height - NavigationHeight)

导航条上的重新布局

如果导航条的设计比较复杂,那么

// 返回NavigationView对象, 实际是UIView
let naviView = navigationView()
// 更改导航条背景色
naviView.backgroundColor = .red
// 添加子控件
naviView.addSubview(subView)

作者

cpcoder, [email protected]

许可证

NavigationView 可在 MIT 许可证下获得。有关更多信息,请参阅 LICENSE 文件。