swift - tabbar点击动画

先上swift版效果图 OC版本点击动画

tabbatAnimation.gif

因为是刚学习swift4，所以代码工程相对规范一点，考虑长期。有需要的朋友可以直接去github下载

swift点击动画GitHub

前言:本人刚接触swift语法，之前一直从事开发Object-C。所以对于swift还是小白一枚。demo如果能帮到大家还希望点个星星谢谢。

直接上实现代码

首先为了满足我们tabbar点击时，只有图片做放大缩小动画。那么我们需要考虑几个问题

1.找到指定点击tabbar按钮

2.寻找tabbr上边的图片

基于这些思路，我们就可以开动代码了。

首先创建tabbarController，然后创建三个vc，这里创建不做细讲，主要看实现动画代码

1.自定义tabbar继承系统UITabBar，为了我们后续动画做铺垫，这里自定义tabbar我们命名为SignTabbar

image.png

2.创建好我们的signTabbar后，通过系统KVC方式，替换掉系统原生tabbar使用我们自定义的signTabbar

image.png

        let tab = SignTabbar()
        
        setValue(tab, forKey: "tabBar")//KVC替换

3.替换成我们自定义的signTabbar之后，我们先打印一下UITabbar的视图

image.png

[<_UIBarBackground: 0x10278c530; frame = (0 0; 320 49); userInteractionEnabled = NO; layer = >, 
>, 
>, 
>]
[<_UIBarBackground: 0x10278c530; frame = (0 0; 320 49); userInteractionEnabled = NO; layer = >, 
>, 
>, 
>]

打印tabbar的所有视图即可出现以上打印结果

   print(subviews)

4.请大家自动忽略走了两次的问题，直接看今天的主题UITabBarButton，没错我们今天搞事情的对象就是这位大大

5.找到当前的UITabBarButton，自己增加点击事件。上代码

image.png

    override func layoutSubviews() {
        super.layoutSubviews()
        print(subviews)
        for tabBarButton in subviews {
            if NSStringFromClass(tabBarButton.classForCoder) == "UITabBarButton"{
                let ctr = tabBarButton as! UIControl
                ctr.addTarget(self,
                              action: #selector(self.barButtonActin(sender:)),
                              for: UIControlEvents.touchUpInside)
            }
        }
    }

6.实现点击方法

    @objc func barButtonActin(sender:UIControl)  {

    }

7.这里我们就要找到当前的UIImageView了，因为我们要给图片做动画，所以，打印UIControl的所有view，即subViews

我们看下打印的控制台输出

 print(sender.subviews)

image.png

[>, 
>]

当我们点击按钮的时候，看下打印的控制台，出现了两个属性。一个UITabBarSwappableImageView，我们要做动画的视图，一个就是UITabBarButtonLabel，暂且不管

8.那么我们拿到了ImageView了，是不是再做动画，就简单多了呢，这里举例做一个放大缩小的动画

image.png

    @objc func tabBarAnimationWithView(view:UIView){
        let scaleAnimation = CAKeyframeAnimation()
        scaleAnimation.keyPath = "transform.scale"
        scaleAnimation.values = [1.0,1.3,1.5,1.25,0.8,1.25,1.0]
        scaleAnimation.duration = 0.5
        scaleAnimation.calculationMode = kCAAnimationCubic
        scaleAnimation.repeatCount = 1
        view.layer.add(scaleAnimation, forKey: "123")
    }

OK，到这里动画实现就完毕了，我们来看下完整的SignTabbar代码

image.png

class SignTabbar: UITabBar {

    override func layoutSubviews() {
        super.layoutSubviews()
        for tabBarButton in subviews {
            if NSStringFromClass(tabBarButton.classForCoder) == "UITabBarButton"{
                let ctr = tabBarButton as! UIControl
                ctr.addTarget(self,
                              action: #selector(self.barButtonActin(sender:)),
                              for: UIControlEvents.touchUpInside)
            }
        }
    }
    @objc func barButtonActin(sender:UIControl)  {
        print(sender.subviews)

        for imageView in sender.subviews {
            if NSStringFromClass(imageView.classForCoder) == "UITabBarSwappableImageView"{
                self.tabBarAnimationWithView(view: imageView)
            }
        }
    }

    @objc func tabBarAnimationWithView(view:UIView){
        let scaleAnimation = CAKeyframeAnimation()
        scaleAnimation.keyPath = "transform.scale"
        scaleAnimation.values = [1.0,1.3,1.5,1.25,0.8,1.25,1.0]
        scaleAnimation.duration = 0.5
        scaleAnimation.calculationMode = kCAAnimationCubic
        scaleAnimation.repeatCount = 1
        view.layer.add(scaleAnimation, forKey: "123")
    }
}

小结：可以看出，swift代码相对于OC还是比较简洁的，感觉到swift4了都。属于swift的时代已经到来了。希望和大家一起学习一起进步

swift点击动画GitHub