2012-01-18 48 views
7

我试图以编程方式为我的应用程序中的tabbar设置背景图片。我的代码如下:为tabbar设置背景图片

RootViewController.h

IBOutlet UITabBar *mainTabBar; 
    IBOutlet UITabBarItem *settingsBarItem; 
    IBOutlet UITabBarItem *infoBarItem; 
    IBOutlet UITabBarItem *aboutBarItem; 

RootViewController.m

-(void)viewDidLoad { 

    UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"smallMenuBackground.png"]];  
    [mainTabBar insertSubview:imageView atIndex:0]; 
    [imageView release]; 

    [super viewDidLoad]; 
} 

这不是为我工作。

UPDATE

UPDATE 2012年1月23日

好吧,我做了一点点进步。这只是升级到Xcode 4.2和IOS5后才停止工作。我设法使用Interface Builder中的选项恢复它,但现在它只适用于IOS5。理想情况下,我希望能够以编程方式进行工作,但现在我会解决IB解决方案。

我似乎无法让它适用于任何以前的版本。

注:我的TabBar只在我的RootViewController上,这是我的应用程序的主屏幕。

理想的情况下,如果我能得到的代码工作是尼西建议,那将是巨大的:

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tabBG.png"]]; 

if ([[[UIDevice currentDevice] systemVersion] floatValue] > 4.9) { 
    //iOS 5 
    [self.tabBarController.tabBar insertSubview:imageView atIndex:1]; 
} 
else { 
    //iOS 4.whatever and below 
    [self.tabBarController.tabBar insertSubview:imageView atIndex:0]; 
} 

[imageView release]; 

任何帮助,将不胜感激。

问候, 斯蒂芬

+1

检查此链接。尽管它被要求提供背景颜色,但是有代码将图像作为背景放在一篇文章中。 [检查它](http://stackoverflow.com/questions/571028/changing-tint-background-color-of-uitabbar)。 – Sarah

回答

14

你可以使用自定义类UITabBarController &覆盖你的tabBarController。在那里你可以设置你需要的按钮&他们的行为与图像。

这是您的自定义标签栏控制器类怎么能是这样的:

// CustomTabBarController。^ h

#import <UIKit/UIKit.h> 

@interface CustomTabBarController : UITabBarController { 
    UIButton *settingsButton; 
    UIButton *infoButton; 
    UIButton *aboutUsButton; 
} 

@property (nonatomic, retain) UIButton *settingsButton; 
@property (nonatomic, retain) UIButton *infoButton; 
@property (nonatomic, retain) UIButton *aboutUsButton; 

-(void) addCustomElements; 
-(void) selectTab:(int)tabID; 

@end 

// CustomTabBarController.m

#import "CustomTabBarController.h" 

@implementation CustomTabBarController 

@synthesize settingsButton, infoButton, aboutUsButton; 

- (void)viewDidAppear:(BOOL)animated { 
    [super viewDidAppear:animated]; 


} 
-(void)viewDidLoad 
{ 
    [super viewDidLoad]; 
    [self addCustomElements]; 
} 

-(void)addCustomElements 
{ 
    // Background 
    UIImageView* bgView = [[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tabBarBackground.png"]] autorelease]; 
    bgView.frame = CGRectMake(0, 420, 320, 60); 
    [self.view addSubview:bgView]; 

    // Initialise our two images 
    UIImage *btnImage = [UIImage imageNamed:@"settings.png"]; 
    UIImage *btnImageSelected = [UIImage imageNamed:@"settingsSelected.png"]; 

    self.settingsButton = [UIButton buttonWithType:UIButtonTypeCustom]; //Setup the button 
    settingsButton.frame = CGRectMake(10, 426, 100, 54); // Set the frame (size and position) of the button) 
    [settingsButton setBackgroundImage:btnImage forState:UIControlStateNormal]; // Set the image for the normal state of the button 
    [settingsButton setBackgroundImage:btnImageSelected forState:UIControlStateHighlighted]; // Set the image for the selected state of the button 
    [settingsButton setBackgroundImage:btnImageSelected forState:UIControlStateSelected]; // Set the image for the selected state of the button 
    [settingsButton setBackgroundImage:btnImageSelected forState:UIControlStateDisabled]; 
    [settingsButton setImage:btnImageSelected forState:(UIControlStateHighlighted|UIControlStateSelected)]; 
    [settingsButton setTag:101]; // Assign the button a "tag" so when our "click" event is called we know which button was pressed. 
    [settingsButton setSelected:true]; // Set this button as selected (we will select the others to false as we only want Tab 1 to be selected initially 

    // Now we repeat the process for the other buttons 
    btnImage = [UIImage imageNamed:@"info.png"]; 
    btnImageSelected = [UIImage imageNamed:@"infoSelected.png"]; 
    self.infoButton = [UIButton buttonWithType:UIButtonTypeCustom]; 
    infoButton.frame = CGRectMake(110, 426, 100, 54); 
    [infoButton setBackgroundImage:btnImage forState:UIControlStateNormal]; 
    [infoButton setBackgroundImage:btnImageSelected forState:UIControlStateSelected]; 
    [infoButton setBackgroundImage:btnImageSelected forState:UIControlStateHighlighted]; 
    [infoButton setImage:btnImageSelected forState:(UIControlStateHighlighted|UIControlStateSelected)]; 

    [infoButton setTag:102]; 

    btnImage = [UIImage imageNamed:@"aboutUs.png"]; 
    btnImageSelected = [UIImage imageNamed:@"aboutUsSelected.png"]; 
    self.aboutUsButton = [UIButton buttonWithType:UIButtonTypeCustom]; 
    aboutUsButton.frame = CGRectMake(210, 426, 100, 54); 
    [aboutUsButton setBackgroundImage:btnImage forState:UIControlStateNormal]; 
    [aboutUsButton setBackgroundImage:btnImageSelected forState:UIControlStateSelected]; 
    [aboutUsButton setBackgroundImage:btnImageSelected forState:UIControlStateHighlighted]; 
    [aboutUsButton setImage:btnImageSelected forState:(UIControlStateHighlighted|UIControlStateSelected)]; 

    [aboutUsButton setTag:103]; 

    // Add my new buttons to the view 
    [self.view addSubview:settingsButton]; 
    [self.view addSubview:infoButton]; 
    [self.view addSubview:aboutUsButton]; 

    // Setup event handlers so that the buttonClicked method will respond to the touch up inside event. 
    [settingsButton addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside]; 
    [infoButton addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside]; 
    [aboutUsButton addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside]; 
} 

- (void)buttonClicked:(id)sender 
{ 
    int tagNum = [sender tag]; 
    [self selectTab:tagNum]; 
} 

- (void)selectTab:(int)tabID 
{ 
    switch(tabID) 
    { 
     case 101: 
      [settingsButton setSelected:true]; 
      [infoButton setSelected:false]; 
      [aboutUsButton setSelected:false]; 
      break; 
     case 102: 
      [settingsButton setSelected:false]; 
      [infoButton setSelected:true]; 
      [aboutUsButton setSelected:false]; 
      break; 
     case 103: 
      [settingsButton setSelected:false]; 
      [infoButton setSelected:false]; 
      [aboutUsButton setSelected:true]; 
      break; 
    } 
    self.selectedIndex = tabID; 
} 

- (void)dealloc { 
    [settingsButton release]; 
    [infoButton release]; 
    [aboutUsButton release]; 

    [super dealloc]; 
} 

@end 

希望这将帮助你很多。

+0

谢谢Erfan,我只想在我的RootViewController中的tabbar,我该如何调用自定义类? – Stephen

+0

在这种情况下,您可以调用上述的自定义类.....只是有点不同,在故事板/主窗口中添加一个UIViewController。在您的应用程序委托类中,在applicationDidFinishLaunching中,将viewController添加为窗口中的子视图。然后你的RootViewController将出现在你的viewController里面的屏幕上。然后,您可以根据需要在viewController上隐藏或取消隐藏TabBar控制器。这只是一个建议。你可以试试这个。我希望它会完成。 :) – Erfan

+0

'self.selectedIndex = tabID;'这一行必须改为'self.selectedIndex = tabID-101;' –

0

以一个自定义视图,并添加它UITaB吧。现在在该视图上添加按钮并提供了到标签栏按钮的方法链接。现在你可以通过添加图像或任何东西来做任何事情。它的工作原理与自定义标签栏相似。

3

您将需要通过操作系统版本有条件地对此进行编码。

如果您只支持iOS 5,则可以简单地使用Tabbar的backgroundImage属性。如果您需要支持低于5的iOS版本,您应该添加一些条件代码,以便'入侵'它。有几种方法可以做到这一点,这里有一个:

Custom tab bar background image - in iOS 4.x

6
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"tabBG.png"]]; 

if ([[[UIDevice currentDevice] systemVersion] floatValue] > 4.9) { 
    //iOS 5 
    [self.tabBarController.tabBar insertSubview:imageView atIndex:1]; 
} 
else { 
    //iOS 4.whatever and below 
    [self.tabBarController.tabBar insertSubview:imageView atIndex:0]; 
} 

[imageView release]; 
+0

谢谢Nithin,我刚刚尝试过,但没有奏效。 – Stephen

+0

@Stephen http://www.tumblr.com/tagged/uitabbar检查此链接中给出的方法 – nithin

+0

再次感谢Nithin,我尝试了链接中的示例,但无法正常工作。 – Stephen

0

我已经在过去所做的是创建我自己的TabbarController加载不同UIViewControllers。通过这个控制器,我可以操纵Tabbar和Tabbar项目的外观。

这对我来说很好,但它最初是有点工作。因为你必须“模拟”UITabBarController,因为你实际上并没有使用'原生'UITabBar

0
jUst call these two methods 
    hideTabBar; 
    addCustomElements; 

    hideTabBar method hides the original tabbar 
    And addCustomElements method will add the custom tabbar image as well as custom tabbar button also 


- (void)hideTabBar 
{ 
    for(UIView *view in self.tabBarController.view.subviews) 
    { 
     //  if([view isKindOfClass:[UITabBar class]]) 
     //  { 
     //   view.hidden = YES; 
     //   break; 
     //  } 

     if([view isKindOfClass:[UITabBar class]]) 
     { 
      [view setFrame:CGRectMake(view.frame.origin.x, 480, view.frame.size.width, view.frame.size.height)]; 
     } 
     else 
     { 
      [view setFrame:CGRectMake(view.frame.origin.x, view.frame.origin.y, view.frame.size.width, 480)]; 
     } 


    } 
} 

-(void)addCustomElements 
{ 
    // Initialise our two images 
    UIImage *btnImage = [UIImage imageNamed:@"homet.png"]; 
    UIImage *btnImageSelected = [UIImage imageNamed:@"homehovert.png"]; 

    self.btn1 = [UIButton buttonWithType:UIButtonTypeCustom]; //Setup the button 
    btn1.frame = CGRectMake(28, 446, 25,28); // Set the frame (size and position) of the button) 
    [btn1 setBackgroundImage:btnImage forState:UIControlStateNormal]; // Set the image for the normal state of the button 
    [btn1 setBackgroundImage:btnImageSelected forState:UIControlStateSelected]; // Set the image for the selected state of the button 
    [btn1 setTag:0]; // Assign the button a "tag" so when our "click" event is called we know which button was pressed. 
    [btn1 setSelected:true]; // Set this button as selected (we will select the others to false as we only want Tab 1 to be selected initially 

    // Now we repeat the process for the other buttons 
    btnImage = [UIImage imageNamed:@"blogt.png"]; 
    btnImageSelected = [UIImage imageNamed:@"bloghovert.png"]; 
    self.btn2 = [UIButton buttonWithType:UIButtonTypeCustom]; 
    btn2.frame = CGRectMake(107, 448, 22,28); 
    [btn2 setBackgroundImage:btnImage forState:UIControlStateNormal]; 
    [btn2 setBackgroundImage:btnImageSelected forState:UIControlStateSelected]; 
    [btn2 setTag:1]; 

    btnImage = [UIImage imageNamed:@"networkt.png"]; 
    btnImageSelected = [UIImage imageNamed:@"networkhovert.png"]; 
    self.btn3 = [UIButton buttonWithType:UIButtonTypeCustom]; 
    btn3.frame = CGRectMake(180, 446, 35,29); 
    [btn3 setBackgroundImage:btnImage forState:UIControlStateNormal]; 
    [btn3 setBackgroundImage:btnImageSelected forState:UIControlStateSelected]; 
    [btn3 setTag:2]; 

    btnImage = [UIImage imageNamed:@"contactt.png"]; 
    btnImageSelected = [UIImage imageNamed:@"contacthovert.png"]; 
    self.btn4 = [UIButton buttonWithType:UIButtonTypeCustom]; 
    btn4.frame = CGRectMake(262, 447, 32,28); 
    [btn4 setBackgroundImage:btnImage forState:UIControlStateNormal]; 
    [btn4 setBackgroundImage:btnImageSelected forState:UIControlStateSelected]; 
    [btn4 setTag:3]; 

    self.img1 = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"tabbar.png"]] ; 
    img1.frame = CGRectMake(0, 440, 320, 40); 




    [self.tabBarController.view addSubview:img1]; 
    // Add my new buttons to the view 
    [self.tabBarController.view addSubview:btn1]; 
    [self.tabBarController.view addSubview:btn2]; 
    [self.tabBarController.view addSubview:btn3]; 
    [self.tabBarController.view addSubview:btn4]; 

    // Setup event handlers so that the buttonClicked method will respond to the touch up inside event. 
    [btn1 addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside]; 
    [btn2 addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside]; 
    [btn3 addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside]; 
    [btn4 addTarget:self action:@selector(buttonClicked:) forControlEvents:UIControlEventTouchUpInside]; 
} 
0
// not supported on iOS4  
UITabBar *tabBar = [tabController tabBar]; 
if ([tabBar respondsToSelector:@selector(setBackgroundImage:)]) 
{ 
    // set it just for this instance 
    [tabBar setBackgroundImage:[UIImage imageNamed:@"tabbar_brn.jpg"]]; 

    // set for all 
    // [[UITabBar appearance] setBackgroundImage: ... 
} 
else 
{ 
    // ios 4 code here 
} 
1

像在iOS 5之前提到的,我建议你使用的背景图片:

UITabBar *tabBar = tabController.tabBar; 
if ([tabBar respondsToSelector:@selector(setBackgroundImage:)]) { 
    tabBar.backgroundImage = [UIImage imageNamed:@"TabBackground.png"]; 
} 

始终使用支票像respondsToSelector,而不是明确的版本检查。这会产生更安全,更有前途的验证码。

在iOS 4上,我建议你使用-[UITabBar drawRect:]方法,最好在一个子类中使用。然后在Interface Builder中将自定义类(通常在MainWindow.xib中)设置为您的自定义子类。

然而,如果你不使用的MainWindow.xib,而像iOS 5的代码模板可以生成你的UITabBarController在代码中,你只能使用覆盖上UITabBar一个类别drawRect:方法。

// UITabBar+CustomBackground.h 
@interface UITabBar (CustomBackground) 
@end 

// UITabBar+CustomBackground.m 
@implementation UITabBar (CustomBackground) 
- (void) drawRect:(CGRect)frame { 
    [[UIColor redColor] set]; 

    CGContextRef ctx = UIGraphicsGetCurrentContext(); 
    CGContextFillRect(ctx, [self bounds]); 
} 
@end 

这只适用于系统iOS 4.x和更早的版本,但多数民众赞成,因为我们已经涵盖了iOS 5。

1

你只需要确定每个案例,检查版本-respondToSelector维诺德说。我建议你在UITabBar上创建一个类别,并且很容易。因此,代码都会有这样的形式:

// UITabBar+Custom.h 

    #import <UIKit/UIKit.h> 
    #import <QuartzCore/QuartzCore.h> 

    @interface UITabBar (Custom) 
    -(void)setTabBarBackground:(UIImage *)backgroundImage; 
    @end 

与.m文件:

// UITabBar+Custom.m 

    #import "UITabBar+Custom.h" 
    #import <objc/runtime.h> 

    static char *backgroundImageKey; 

    -(void)setImage:(UIImage *)anImage { 
      objc_setAssociatedObject(self, &backgroundImageKey, 
       anImage, OBJC_ASSOCIATION_RETAIN_NONATOMIC); 
      [self setNeedsDisplay]; 
    } 

    -(UIImage *)image { 
      return objc_getAssociatedObject(self, &backgroundImageKey); 
    } 

    -(void)setTabBarBackground:(UIImage *)backgroundImage { 
     if([self respondsToSelector:@selector(setBackgroundImage:)]) { 
       [self setBackgroundImage:backgroundImage]; 
     } else { 
       [self setImage:backgroundImage]; 
     } 
    } 

    -(void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx { 
     UIGraphicsPushContext(ctx); 
     UIImage *currentImage = [self image]; 
     CGContextTranslateCTM(ctx, 0, currentImage.size.height); 
     CGContextScaleCTM(ctx, 1.0, -1.0); 

     CGContextDrawImage(ctx, self.bounds, currentImage.CGImage); 
     UIGraphicsPopContext(); 
    } 

-drawLayer:inContext将快速绘制背景图像。

1

正如我上面回答,无需添加的UIView它可以将背景图片添加到UITabBar,当你调用[tabBar setNeedsDisplay]可能消失的图像,所以我想在-drawLayer:layer inContext:ctx绘制图像的(在-drawInRect:rect不叫)。但是,如果你能避免调用[tabBar setNeedsDisplay],有这样做的一个简单的方法:

// UITabBar+Custom.m 

#import "UITabBar+Custom.h" 
#import <QuartzCore/QuartzCore.h> 

-(void)setTabBarBackground:(UIImage *)backgroundImage { 
    if([self respondsToSelector:@selector(setBackgroundImage:)]) { 
      // ios 5+ 
      [self setBackgroundImage:backgroundImage]; 
    } else { 
      // ios 3.x/4.x 
      self.layer.contents = (id)backgroundImage.CGImage; 
    } 
} 
0
// Change the tab bar background 
UIImage* tabBarBackground = [UIImage imageNamed:@"tabbar.png"]; 
[[UITabBar appearance] setBackgroundImage:tabBarBackground];