1. 程式人生 > >IOS_實現TabBar切換時底部切換效果

IOS_實現TabBar切換時底部切換效果

1.首先實現代理方法

#pragma mark -- UITabBarControllerDelegate

- (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController
{
    UIImageView* slider = (UIImageView*)[self.tabBar viewWithTag:TAB_SLIDER_TAG];
    
    NSUInteger selectedIndex = [self.viewControllers indexOfObjectIdenticalTo:viewController];
    if (slider)
    {
        [self.tabBar bringSubviewToFront:slider];
        
        [UIView beginAnimations:nil context:nil];
        [UIView setAnimationDuration:0.2];
        CGRect frame = slider.frame;
        frame.origin.x = [self horizontalLocationFor:selectedIndex];
        slider.frame = frame;
        [UIView commitAnimations];
    }
    else
    {
        [self addTabBarSliderAtIndex:selectedIndex];
    }
}

2.步驟1中又兩個方法,需要實現下一個是水平移動、一個是更改圖片
- (void)addTabBarSliderAtIndex:(NSUInteger)itemIndex
{
    UIImage* sliderImage = [UIImage imageNamed:@"tab_slider"];
    UIImageView* slider = [[UIImageView alloc] initWithImage:sliderImage] ;
    slider.tag = TAB_SLIDER_TAG;
    
    slider.frame = CGRectMake([self horizontalLocationFor:itemIndex]
                                   , self.tabBar.height - sliderImage.size.height
                                   , sliderImage.size.width
                                   , sliderImage.size.height);
    
    [self.tabBar addSubview:slider];
}

- (CGFloat) horizontalLocationFor:(NSUInteger)tabIndex
{
    
    CGFloat tabItemWidth = self.tabBar.frame.size.width / self.viewControllers.count;
    CGFloat halfTabItemWidth = (tabItemWidth / 2.0) - (_sliderWidth / 2.0);
    return (tabIndex * tabItemWidth) + halfTabItemWidth;
}