本人小白一枚,最近研究了一下UITabBar上实现UITabBarItem点击动画的两种办法。
一、第一种是自定义UITabBar类
通过KVC方法来替换UITabBarController中的私有、只读的属性tabBar,然后通过自定义UITabBar类的layoutSubviews函数实现对tabBar中按钮对象的遍历,加入点击响应函数,在响应函数中实现动画效果。上代码:
1 、自定义UITabBar
@interface MainTabBarView : UITabBar
2、重载MainTabBarView的layoutSubviews函数
- (void)layoutSubviews{
[super layoutSubviews];
//遍历tabBarButton,添加点击动作
for (UIControl *tabBarButton in self.subviews) {
if ([tabBarButton isKindOfClass:NSClassFromString(@"UITabBarButton")]){
[tabBarButton addTarget:self action:@selector(tabBarButtonClick:) forControlEvents:UIControlEventTouchUpInside];
}
}
}
3、在MainTabBarView的tarBarButtonClick函数中添加动画效果
- (void)tabBarButtonClick:(UIControl *)tabBarButton
{
for (UIView *imageView in tabBarButton.subviews) {
//添加动画
}
}
}
4、自定义UITabBarController
@interface MainTabBarViewController : UITabBarController
5、在MainTabBarViewController中定义属性mainTabBar,并懒加载
@property (nonatomic, strong) MainTabBarView *mainTabBar;
//懒加载
-(MainTabBarView *)mainTabBar{
if(!_mainTabBar){
_mainTabBar = [[MainTabBarView alloc] init];
}
return _mainTabBar;
}
6、在MainTabBarViewController的viewDidLoad函数中利用KVC将默认的tabBar替换自定义的mainTabBar
[self setValue:self.mainTabBar forKey:@"tabBar"];
二、第二种是利用UITabBarControllerDelegate代理函数直接实现
利用didSelectItem函数直接实现点击动画效果。上代码:
1、自定义UITabBarController
@interface MainTabBarViewController : UITabBarController
2、在MainTabBarViewController中添加当前点击按钮的位置标志indexFlag,并在viewDidLoad中初始化为0
//记录上一次点击tabbar,在viewDidLoad或init中初始化为0
@property (nonatomic, assign) NSInteger indexFlag;
//在viewDidLoad中初始化indexFlag
self.indexFlag = 0;
3、在UITabBarControllerDelegate的didSelectItem函数中添加动画效果
-(void)tabBar:(UITabBar *)tabBar didSelectItem:(UITabBarItem *)item{
NSInteger index = [self.tabBar.items indexOfObject:item];
if (index != self.indexFlag) {
UIView *imageView = self.tabBar.subviews[index+1];
if ([imageView isKindOfClass:NSClassFromString(@"UITabBarButton")]) {
//添加动画
}
//记录当前indexFlag
self.indexFlag = index;
}
}
三、几种动画效果,可在第一种方法的tabBarButtonClick函数和第二种方法的didSelectItem函数中的注释 "//添加动画"下面添加
//z轴旋转180度
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
//速度控制函数,控制动画运行的节奏
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
//执行时间
animation.duration = 0.2;
//执行次数
animation.repeatCount = 1;
![Uploading QQ20171019-145022-HD_859710.gif . . .]
animation.removedOnCompletion = YES;
//初始伸缩倍数
animation.fromValue = [NSNumber numberWithFloat:0];
//结束伸缩倍数
animation.toValue = [NSNumber numberWithFloat:M_PI];
[imageView layer] addAnimation:animation forKey:nil];
//向上移动
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.translation.y"];
//速度控制函数,控制动画运行的节奏
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
//执行时间
animation.duration = 0.2;
//执行次数
animation.repeatCount = 1;
animation.removedOnCompletion = YES;
//初始伸缩倍数
animation.fromValue = [NSNumber numberWithFloat:0];
//结束伸缩倍数
animation.toValue = [NSNumber numberWithFloat:-10];
[[imageView layer] addAnimation:animation forKey:nil];
//放大效果,并回到原位
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
//速度控制函数,控制动画运行的节奏
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
//执行时间
animation.duration = 0.2;
//执行次数
animation.repeatCount = 1;
//完成动画后会回到执行动画之前的状态
animation.autoreverses = YES;
//初始伸缩倍数
animation.fromValue = [NSNumber numberWithFloat:0.7];
//结束伸缩倍数
animation.toValue = [NSNumber numberWithFloat:1.3];
[[imageView layer] addAnimation:animation forKey:nil];
//放大效果
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
//速度控制函数,控制动画运行的节奏
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
animation.duration = 0.2; //执行时间
animation.repeatCount = 1; //执行次数
animation.removedOnCompletion = NO;
animation.fillMode = kCAFillModeForwards; //保证动画效果延续
animation.fromValue = [NSNumber numberWithFloat:1.0]; //初始伸缩倍数
animation.toValue = [NSNumber numberWithFloat:1.15]; //结束伸缩倍数
[[array[index] layer] addAnimation:animation forKey:nil];
参考文件:www.jianshu.com/p/944479741d7a
www.cnblogs.com/yajunLi/p/6288811.html