先看一下效果
1.首先创建一个新工程,结构是TabbarViewController+UIViewController*4
@interface AppDelegate ()<UITabBarControllerDelegate>
{
UITabBarController *tabBarController;
NSMutableArray *isInArray; // 标记动画方向
UIViewController *controller; //一个全局VC
}
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
//
//初始化window设置其背景图
//
self.window = [[UIWindow alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH_NEW, SCREEN_HEIGHT_NEW)];
UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:[NSString stringWithFormat:@"b%d",5]]];
imageView.frame = self.window.frame;
[self.window addSubview:imageView];
//
//array:存放4个透明VC(为了正常显示系统的TabBar和其点击事件)。第一个VC默认设置微信截图
//
NSMutableArray *array = [[NSMutableArray alloc]initWithCapacity:4];
NSArray *titleArray = @[@"微信",@"通讯录",@"发现",@"我"];
for(int i = 0 ; i < 4 ; i ++){
UIViewController *controller_ = [[UIViewController alloc]init];
[array addObject:controller_];
UITabBarItem *item = [[UITabBarItem alloc]initWithTitle:titleArray[i] image:[UIImage imageNamed:[NSString stringWithFormat:@"%d",i+1]] tag:i];
controller_.tabBarItem = item;
if (i == 0) {
UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:[NSString stringWithFormat:@"b%d",i+1]]];
imageView.frame = self.window.frame;
[controller_.view addSubview:imageView];
}
}
tabBarController = [[UITabBarController alloc]init];
tabBarController.viewControllers = array;
tabBarController.delegate = self;
self.window.rootViewController = tabBarController;
[self.window makeKeyAndVisible];
//
//全局VC,展示不同截图
//
controller = [[UIViewController alloc]init];
//
//动画方向
//
isInArray = @[[NSNumber numberWithBool:NO],
[NSNumber numberWithBool:YES],
[NSNumber numberWithBool:YES],
[NSNumber numberWithBool:YES]].mutableCopy;
return YES;
}
2 实现UITabBarControllerDelegate
-(void)tabBarController:(UITabBarController *)tabBarControllerLocal didSelectViewController:(UIViewController *)viewController{
NSLog(@"%lu",(unsigned long)tabBarController.selectedIndex);
//
//tabBarItem点击后 就把默认图移除
//
[tabBarController.viewControllers[0].view removeAllSubviews];
//
//设置对应截图
//
UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:[NSString stringWithFormat:@"b%lu",tabBarController.selectedIndex+1]]];
imageView.frame = self.window.frame;
[controller.view addSubview:imageView];
[tabBarController.view insertSubview:controller.view belowSubview:tabBarController.tabBar];
//
//开始动画
//
[self genieToRect:CGRectMake(0, 0, 0, 0) edge:BCRectEdgeTop ];
}
3 实现动画方法 。从github上下载UIView+Genie这个开源代码,然后引入UIView+Genie。地址https://github.com/Ciechan/BCGenieEffect/
- (void) genieToRect: ( CGRect)rect2 edge: (BCRectEdge) edge
{
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
//
//isin = NO执行的是向下回收的动画 一个页面下来 其他的应该都下去
//
//
//不同的起始位置
//
CGRect rect = CGRectMake(SCREEN_WIDTH_NEW/4* tabBarController.selectedIndex, SCREEN_HEIGHT_NEW +100, SCREEN_WIDTH_NEW / 5, 20);
UIView *tranView = controller.view;
BOOL isin = [isInArray[tabBarController.selectedIndex] boolValue];
if (isin == NO) {
//
//向下
//
for (int i = 0; i < isInArray.count; i ++) {
if (i != tabBarController.selectedIndex) {
[isInArray replaceObjectAtIndex:i withObject:[NSNumber numberWithBool:YES]];
tabBarController.viewControllers[i].view.frame = CGRectMake(SCREEN_WIDTH_NEW/4* i, SCREEN_HEIGHT_NEW +20, SCREEN_WIDTH_NEW/5, 20);;
}
}
}else{
//
//向上
//
for (int i = 0; i < isInArray.count; i ++) {
if (i != tabBarController.selectedIndex) {
[isInArray replaceObjectAtIndex:i withObject:[NSNumber numberWithBool:YES]];
tabBarController.viewControllers[i].view.frame = CGRectMake(SCREEN_WIDTH_NEW/4* i, SCREEN_HEIGHT_NEW +20, SCREEN_WIDTH_NEW/5, 20);;
}
}
}
NSTimeInterval duration = 0.5;
tabBarController.tabBar.userInteractionEnabled = NO;
CGRect endRect = rect;
if (isin) {
[tranView genieOutTransitionWithDuration:duration startRect:endRect startEdge:edge completion:^{
BOOL isInLocal = [isInArray[tabBarController.selectedIndex] boolValue];
[isInArray replaceObjectAtIndex:tabBarController.selectedIndex withObject:[NSNumber numberWithBool:!isInLocal]];
tabBarController.tabBar.userInteractionEnabled = YES;
}];
} else {
NSLog(@"xia");
[tranView genieInTransitionWithDuration:duration destinationRect:endRect destinationEdge:edge completion:
^{
BOOL isInLocal = [isInArray[tabBarController.selectedIndex] boolValue];
[isInArray replaceObjectAtIndex:tabBarController.selectedIndex withObject:[NSNumber numberWithBool:!isInLocal]];
tabBarController.tabBar.userInteractionEnabled = YES;
}];
}
});
}
demo 下载 http://download.csdn.net/detail/qq_15509071/9824864