
动画标签栏
用于为 iOS 标签栏项和图标添加动画的 Swift UI 模块库。
我们专注于为移动应用和网站设计自定义 UI。

关注最新更新
需求
- iOS 9.0+
- Xcode 10.2
安装
只需将 RAMAnimatedTabBarController 文件夹添加到您的项目中。
或者使用 CocoaPods,通过 Podfile
pod 'RAMAnimatedTabBarController'
或 Carthage 用户可以直接添加到他们的 Cartfile
github "Ramotion/animated-tab-bar"
或 Swift Package Manager
使用方法
-
在 Storyboard 或 nib 中创建一个新的 UITabBarController。
-
在 Storyboard 或 nib 中将 UITabBarController 的类设置为 RAMAnimatedTabBarController。
-
对于每个 UITabBarItem,设置类为 RAMAnimatedTabBarItem。
-
为每个 RAMAnimatedTabBarItem 添加自定义图像图标
-
为每个 RAMAnimatedTabBarItem 添加动画
- 将 NSObject 项目拖放到 ViewController
- 将其类设置为 ANIMATION_CLASS(其中 ANIMATION_CLASS 是要使用的动画的类名)
- 连接 RAMAnimatedTabBarItem 中的 animation 输出到您的 ANIMATION_CLASS 步骤 5 的演示视频
包括的动画
- RAMBounceAnimation
- RAMLeftRotationAnimation
- RAMRightRotationAnimation
- RAMFlipLeftTransitionItemAnimations
- RAMFlipRightTransitionItemAnimations
- RAMFlipTopTransitionItemAnimations
- RAMFlipBottomTransitionItemAnimations
- RAMFrameItemAnimation
- RAMFumeAnimation
创建自定义动画
- 创建一个继承自 RAMItemAnimation 的新类
class NewAnimation : RAMItemAnimation
- 实现 RAMItemAnimationProtocol 中的方法
// method call when Tab Bar Item is selected
override func playAnimation(icon: UIImageView, textLabel: UILabel) {
// add animation
}
// method call when Tab Bar Item is deselected
override func deselectAnimation(icon: UIImageView, textLabel: UILabel, defaultTextColor: UIColor, defaultIconColor: UIColor) {
// add animation
}
// method call when TabBarController did load
override func selectedState(icon: UIImageView, textLabel: UILabel) {
// set selected state
}
- 示例
import RAMAnimatedTabBarController
class RAMBounceAnimation : RAMItemAnimation {
override func playAnimation(_ icon: UIImageView, textLabel: UILabel) {
playBounceAnimation(icon)
textLabel.textColor = textSelectedColor
}
override func deselectAnimation(_ icon: UIImageView, textLabel: UILabel, defaultTextColor: UIColor, defaultIconColor: UIColor) {
textLabel.textColor = defaultTextColor
}
override func selectedState(_ icon: UIImageView, textLabel: UILabel) {
textLabel.textColor = textSelectedColor
}
func playBounceAnimation(_ icon : UIImageView) {
let bounceAnimation = CAKeyframeAnimation(keyPath: "transform.scale")
bounceAnimation.values = [1.0 ,1.4, 0.9, 1.15, 0.95, 1.02, 1.0]
bounceAnimation.duration = TimeInterval(duration)
bounceAnimation.calculationMode = kCAAnimationCubic
icon.layer.add(bounceAnimation, forKey: "bounceAnimation")
}
}
📄 许可
动画标签栏在MIT许可下发布。查看LICENSE获取详情。
此库是我们最好的UI开源项目之一选择之一。
如果您在自己的项目中使用了这个开源库,请确保引用和链接回www.ramotion.com
📱 获取iOS的Showroom App进行试用
在我们的iOS应用中尝试这个UI组件和其他类似组件。如果您感兴趣,请联系我们。

