利用kvc对UITabBar上的UITabBarButton的尝试修改.md

一、前言

• 一次比较懒的想法，不想自定义UITabBar，也不想用第三方框架，于是想尝试修改苹果私有类来达到部分效果

• 效果如下

  • 点击tabBar 上的按钮，图片有变大再变小的动画
  • tabBar 上某个按钮（购物车按钮），点击弹出控制器是modal出来的，并不属于UITabBarController管理的
  • 上述购物车按钮，是后面加到tabBar 上的自定义的按钮UIButton，本身没有右上角的badge的提示，懒得话，就用
    
    系统UITabBarButton 的badge
  • 点击商品的加号按钮，实现tabBar上购物车按钮 显示的badge的数字的改变，并实现变大变小的动画

二、相关说明

• 在swift3及xcode8 beta2 环境下

• 运行时遍历出成员变量

  var count:UInt32 = 0
        let ivarlist = class_copyIvarList(NSClassFromString("UITabBarButton")!, &count)

        for index in 0..<numericCast(count) {
            let ivar = ivarlist![index]
            let ivarStr = String.init(utf8String: ivar_getName(ivar!))
            print("\(ivarStr)")
        }

• 1、UITabBarButton

Optional("_hitRect")
Optional("_info")
Optional("_vibrancyEffectView")
Optional("_label")
Optional("_badge")
Optional("_selectedIndicator")
Optional("_selected")
Optional("_infoInsets")
Optional("_selectedInfoOffset")
Optional("_infoOffset")
Optional("_customSelectedIndicatorImage")
Optional("_labelOffset")
Optional("_buttonTintColorsForState")
Optional("_contentTintColorsForState")
Optional("_badgeColor")
Optional("_badgeTextAttributesForState")
Optional("_showsHighlightedState")
Optional("_centerAllContents")
Optional("_appearanceGuideClass")
Optional("_tabBar")

• 其中 "_info" ,"_label" ,"_badge" 这三个是我们需要的

  • "_info"是 UIImageView 就是显示的图片，"_label"是UILabel 显示的文字

• 2、"_badge"是什么呢？它真实类型是什么,子控件及属性名是什么

let tab = window?.rootViewController as! TabBarViewController
        for view in tab.tabBar.subviews {
            if view.isKind(of: NSClassFromString("UITabBarButton")! ) {
                let badgeView = view.value(forKeyPath: "_badge")
                    print("1\(badgeView!.self)")
                let badge = badgeView as! UIView
                    print("2\(badge.subviews)")
                }
            }
        }

1 <_UIBadgeView: 0x7fd671c336c0; frame = (33 2; 18 18); text = '1'; userInteractionEnabled = NO; layer = <CALayer: 0x608000031240>>
2 [<UIImageView: 0x7fd671c09570; frame = (0 0; 18 18); opaque = NO; userInteractionEnabled = NO; tintColor = UIExtendedSRGBColorSpace 1 0.231373 0.188235 1; layer = <CALayer: 0x60800002e9a0>>, <UILabel: 0x7fd671c33ba0; frame = (6 1; 6 16); text = '1'; opaque = NO; userInteractionEnabled = NO; layer = <_UILabelLayer: 0x60800009c890>>]

var count:UInt32 = 0
let ivarlist = class_copyIvarList(NSClassFromString("_UIBadgeView")!, &count)
for index in 0..<numericCast(count) {
   let ivar = ivarlist![index]
   let ivarStr = String.init(utf8String: ivar_getName(ivar!))
   print("badge= \(ivarStr)")
}

badge= Optional("_label")
badge= Optional("_background")
badge= Optional("_mergedTextAttributes")
badge= Optional("_text")
badge= Optional("_textAttributes")
badge= Optional("_backgroundColor")

三、做法及代码

• 自定义TabBarController里，添加4个子控制器，其中第三个添加一个空的UIViewController，图片为UIImage(), 空的TabBarItem，只是让这个系统生成的UITabBarButton占好位置

• 自定义UIButton，添加到TabBar上，盖住上述 空的UITabBarButton上

• appDelegate成为TabBarController的代理，监控tabBar的点击

extension AppDelegate: UITabBarControllerDelegate {

    func tabBarController(_ tabBarController: UITabBarController, didSelect viewController: UIViewController) {
        for view  in tabBarController.tabBar.subviews {
            if view.isKind(of: NSClassFromString("UITabBarButton")! ) {
                // UITabBarButton是继承UIControl的， 通过 按钮的状态 才判别是否是现在点击的按钮
                let state = view.value(forKeyPath: "highlighted")
                let stateValue = state as! Int
                if stateValue == 1 {
                    // 拿到当前点击的 按钮的imageView
                    let imageView = view.value(forKeyPath: "_info")
                    guard let temp  = imageView else {
                        return
                    }

                    let tabButtonImgView = temp as! UIImageView
                    // 添加动画
                    UIView.animate(withDuration: 0.2, animations: {
                        tabButtonImgView.transform = CGAffineTransform(scaleX: 1.3, y: 1.3)
                        }, completion: { (Bool) in
                            tabButtonImgView.transform = CGAffineTransform(scaleX: 1.0, y: 1.0)
                    })
                }
            }
        }

    }

}

• 由于UITabBarButton的子控件都是懒加载的，需要用控制器的tabBarItem 模型对UITabBarButton进行设置

  • 点击商品加号按钮，拿到 控制器tabBarItem，设置badgeValue ，然而购物车按钮（自己添加的） 盖住了部分 系统生成的badgeView，需要调整badgeView的位置

for button in tabBar.subviews {

            if button.isKind(of: NSClassFromString("UITabBarButton")! ) {
                let label = button.value(forKeyPath: "_label") as! UILabel
                //  print("\(label.text)")
                if label.text == "" { // 通过label.text 确定是购物车按钮 那位置的 UITabBarButton

                    let badgeButton = button.value(forKeyPath: "_badge")
                    //   print("\(badgeButton!.self)")
                    guard let badgeView = badgeButton else {
                        return
                    }

                    let badge = badgeView as! UIView
                    //  print("\(badge.subviews)")
                    badge.frame.origin.x = 52  // 可根据需要计算
                }
            }
        }

• 点击商品加号按钮实现系统 badgeView的动画

let tab = window?.rootViewController as! TabBarViewController

        for button in tab.tabBar.subviews {

            if button.isKind(of: NSClassFromString("UITabBarButton")! ) {
                let label = button.value(forKeyPath: "_label") as! UILabel
                // 外界通过 lable.text 区别出是我们需要的 第三个UITabBarButton
                if label.text == "" {
                    let badgeButton = button.value(forKeyPath: "_badge")
                    guard let badgeView = badgeButton else {
                        return
                    }
                    // 拿到 badge 控件
                    let badge = badgeView as! UIView
                    //  num变量为 点击加号按钮， 商品个数 计量
                    let str:NSString = NSString.init(format: "%d", num)

                    // kvc 设置属性
                    badgeView.setValue(UIFont.systemFont(ofSize: 9), forKeyPath: "_label.font")
                    badgeView.setValue(str, forKeyPath: "_label.text")

                    let tabLabal = badgeView.value(forKeyPath: "_label")
                    let label = tabLabal as! UILabel
                    // 拿到lebel 计算label 的大小、尺寸
                    let size = str.size(attributes: [NSFontAttributeName : UIFont.systemFont(ofSize: 9)])
                    label.frame = CGRect(x: (badge.frame.size.width - size.width) * 0.5, y: (badge.frame.size.height - size.height) * 0.5, width: size.width, height: size.height)
                    // 添加核心动画
                    let scaleAni =  CABasicAnimation()
                    scaleAni.keyPath = "transform.scale"
                    scaleAni.fromValue = 1.0
                    scaleAni.toValue = 1.2
                    scaleAni.autoreverses = true
                    scaleAni.duration = 0.25
                    badge.layer.add(scaleAni, forKey: nil)

                }
            }
        }

四、 问题

• 刚学习swift 3.0， 各种不熟，各种不顺，加上xcode8 beta版各种不稳定及bug，这次仅仅是尝试swift3的改变而练习的
• 系统UITabBarButton 里面的子控件都是懒加载的，没有先设置tabBarItem模型 ，用kvc 是赋不上值得，这点得注意

五、参考的 小demo

• https://github.com/CH-HOWIE/Swift3_UITabBar_kvc