如何为标签栏的项目设置动画

Question

在我的 Swift 应用程序中，我有一个处理UITabBar类。

class CustomTabBar: UITabBar {
    override func awakeFromNib() {
        super.awakeFromNib()
    }
}

当用户点击它们时，如何为项目设置动画？ 我的意思是CGAffine(scaleX: 1.1, y: 1.1)那么我如何为标签栏的项目设置动画？

Answer 1

第一的：

创建一个自定义的UITabBarController如下：

 import UIKit enum TabbarItemTag: Int { case firstViewController = 101 case secondViewConroller = 102 } class CustomTabBarController: UITabBarController { var firstTabbarItemImageView: UIImageView! var secondTabbarItemImageView: UIImageView! override func viewDidLoad() { super.viewDidLoad() let firstItemView = tabBar.subviews.first! firstTabbarItemImageView = firstItemView.subviews.first as? UIImageView firstTabbarItemImageView.contentMode = .center let secondItemView = self.tabBar.subviews[1] self.secondTabbarItemImageView = secondItemView.subviews.first as? UIImageView self.secondTabbarItemImageView.contentMode = .center } private func animate(_ imageView: UIImageView) { UIView.animate(withDuration: 0.1, animations: { imageView.transform = CGAffineTransform(scaleX: 1.25, y: 1.25) }) { _ in UIView.animate(withDuration: 0.25, delay: 0.0, usingSpringWithDamping: 0.5, initialSpringVelocity: 3.0, options: .curveEaseInOut, animations: { imageView.transform = CGAffineTransform(scaleX: 1.0, y: 1.0) }, completion: nil) } } override func tabBar(_ tabBar: UITabBar, didSelect item: UITabBarItem) { guard let tabbarItemTag = TabbarItemTag(rawValue: item.tag) else { return } switch tabbarItemTag { case .firstViewController: animate(firstTabbarItemImageView) case .secondViewConroller: animate(secondTabbarItemImageView) } } }

第二：

为每个视图控制器的tabBarItem设置tag值：

第一个视图控制器：

 import UIKit class FirstViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() tabBarItem.tag = TabbarItemTag.firstViewController.rawValue } }

第二个视图控制器：

 import UIKit class SecondViewController: UIViewController { override func viewDidLoad() { super.viewDidLoad() tabBarItem.tag = TabbarItemTag.secondViewConroller.rawValue } }

确保您的故事板（如果您正在使用）已经设置了所有内容，就这样！

输出：

你可以检查回购：

https://github.com/AhmadFayyas/Animated-TabbarItem/tree/master

为了证明答案。

Answer 2

由于UITabBarItem不是UIView子类，而是NSObject子类，因此在点击时没有直接的方法来为项目设置动画。

您要么必须挖掘属于该项目的UIView并为其设置动画，要么创建一个自定义选项卡栏。

这里有一些挖掘UIView想法。 在这里例如如何在点击项目时触发。 但是要非常小心这种方法：

• Apple 可能会更改UITabBar实现，这可能会破坏这一点。
• 您可能会干扰 iOS 动画并获得奇怪的效果。

顺便说一句，没有必要UITabBar 。 实现UITabBarDelegate就是你所需要的。

我实际上会建议您坚持使用标准的UITabBar行为和皮肤选项，稍后再弄清楚或根本不解决。 像这样的事情可以消耗你的时间而不会给应用程序增加太多。

Answer 3

这对我有用：

class MyCustomTabController: UITabBarController {

    override func tabBar(_ tabBar: UITabBar, didSelect item: UITabBarItem) {
        guard let barItemView = item.value(forKey: "view") as? UIView else { return }

        let timeInterval: TimeInterval = 0.3
        let propertyAnimator = UIViewPropertyAnimator(duration: timeInterval, dampingRatio: 0.5) {
            barItemView.transform = CGAffineTransform.identity.scaledBy(x: 0.9, y: 0.9)
        }
        propertyAnimator.addAnimations({ barItemView.transform = .identity }, delayFactor: CGFloat(timeInterval))
        propertyAnimator.startAnimation()
    }

}