Only image as UITabBarItem

问题:

I would only like to have an icon as the UITabBarItem and not the text underneath and I was wondering if this was possible, if so, how? TIA

回答1:

If you use story board, maybe you can use Image Inset from size inspector of bar item and set title to empty at the same time:

回答2:

REMOVE THE TITLE

The easy way with inspector

• Select your TabbarItem
• In Title Position change to Custom Offset
• Set vertical to 100
• Done

Fix IMAGE

Adjuste the image

• Select your TabbarItem
• define your Top and Bottom

回答3:

if you just set the image and pass nil to title, the image will be displayed at the top level of the UITabBar item. You have to set the position also.

int offset = 7;
UIEdgeInsets imageInset = UIEdgeInsetsMake(offset, 0, -offset, 0);

After you set icon image for TabBarItem, you set the property value to change the image position, doing:

uiViewController.tabBarItem.imageInsets = imageInset;

回答4:

Setting the item's title to nil is often insufficient, because if you set the view controller's title it will set the title of the tabbar item also.

Instead, do this:

tabbarItem.titlePositionAdjustment = UIOffsetMake(0.f, 50.f);

回答5:

You can use this Swift extension to define a new method tabBarItemShowingOnlyImage(), which will return any UITabBarItem modified to show only the image:

// helper for creating an image-only UITabBarItem
extension UITabBarItem {
    func tabBarItemShowingOnlyImage() -> UITabBarItem {
        // offset to center
        self.imageInsets = UIEdgeInsets(top:6,left:0,bottom:-6,right:0)
        // displace to hide
        self.setTitlePositionAdjustment(UIOffset(horizontal:0,vertical:30000))
        return self
    }
}

This extension builds from the advice offered in other comments.

It hides the title by displacing it, rather than setting it to nil, because sometimes other objects like the view controller itself will set the title to some value after the tab bar item is initialized. It centers the image by using the imageInsets to offset it by 6pt, a value I get just from eyeballing it on an iPhone 6 running iOS8.3.

I imagine that other devices and layout configurations might require a different offset correction, so a general solution would probably have to be more complex.

回答6:

I know its been quite some time. But I might have a solution for this problem.

@ThiagoPires answer is useful only if the image is big enough to cover the title. In case if it isn't, then the title will be visible under the image.

I think that the easiest way to accomplish this, is by setting the title of the tabBarItem to "" in your view controllers code.

It is important to know that every time you change your view controllers title, the tabbaritem's title will be updated too. You could go fancy using KVO to observe the title's change and set "" to the tabbaritem title accordingly. But if you don't change it in many places in your code, you could just set it right in the place you change the ViewController's title.

Here is an example in swift:

override func viewDidLoad() {

    super.viewDidLoad()

    self.title = "View controller's Title"

    self.tabBarItem.title = ""
}

That's it. I hope that this could help.

回答7:

Relevant docs (highlighting mine):

initWithTitle:image:tag: Creates and returns a new item using the specified properties.

- (id)initWithTitle:(NSString *)title image:(UIImage *)image tag:(NSInteger)tag

Parameters

title: The item’s title. If nil, a title is not displayed.

image: The item’s image. If nil, an image is not displayed. The images displayed on the tab bar are derived from this image. If this image is too large to fit on the tab bar, it is clipped to fit. The size of a tab bar image is typically 30 x 30 points. The alpha values in the source image are used to create the unselected and selected images—opaque values are ignored.

tag: The receiver’s tag, an integer that you can use to identify bar item objects in your application.

Return Value: Newly initialized item with the specified properties.

回答8:

Try with below code:

UIViewController *viewController1=[[RootViewController alloc]initWithNibName:@"RootViewController" bundle:nil];
UIViewController *viewController2=[[SecondViewCtr alloc]initWithNibName:@"SecondViewCtr" bundle:nil];
UIViewController *viewController3=[[ThirdViewCtr alloc]initWithNibName:@"ThirdViewCtr" bundle:nil];
UIViewController *viewController4=[[FourthVIewCtr alloc]initWithNibName:@"FourthVIewCtr" bundle:nil];
UIViewController *viewController5=[[FIfthViewCtr alloc]initWithNibName:@"FIfthViewCtr" bundle:nil];


UINavigationController *nav1 = [[UINavigationController alloc] initWithRootViewController:viewController1];
UINavigationController *nav2 = [[UINavigationController alloc] initWithRootViewController:viewController2];
UINavigationController *nav3 = [[UINavigationController alloc] initWithRootViewController:viewController3];
UINavigationController *nav4 = [[UINavigationController alloc] initWithRootViewController:viewController4];
UINavigationController *nav5 = [[UINavigationController alloc] initWithRootViewController:viewController5];
peekArray = [[NSMutableArray alloc] init];

self.tabBarController = [[UITabBarController alloc] init];
self.tabBarController.viewControllers = [NSArray arrayWithObjects:nav1, nav2,nav3,nav4,nav5, nil];

UITabBar *tabBar = _tabBarController.tabBar;
UITabBarItem *tabBarItem1 = [tabBar.items objectAtIndex:0];
UITabBarItem *tabBarItem2 = [tabBar.items objectAtIndex:1];
UITabBarItem *tabBarItem3 = [tabBar.items objectAtIndex:2];
UITabBarItem *tabBarItem4 = [tabBar.items objectAtIndex:3];
UITabBarItem *tabBarItem5 = [tabBar.items objectAtIndex:4];

[tabBarItem1 setFinishedSelectedImage:[UIImage imageNamed:@"home123.png"] withFinishedUnselectedImage:[UIImage imageNamed:@"home_112.png"]];
[tabBarItem2 setFinishedSelectedImage:[UIImage imageNamed:@"gift123.png"] withFinishedUnselectedImage:[UIImage imageNamed:@"gift_112.png"]];
[tabBarItem3 setFinishedSelectedImage:[UIImage imageNamed:@"cam12.png"] withFinishedUnselectedImage:[UIImage imageNamed:@"cam_112.png"]];
[tabBarItem4 setFinishedSelectedImage:[UIImage imageNamed:@"message12.png"] withFinishedUnselectedImage:[UIImage imageNamed:@"message_112.png"]];
[tabBarItem5 setFinishedSelectedImage:[UIImage imageNamed:@"people12.png"] withFinishedUnselectedImage:[UIImage imageNamed:@"people_112.png"]];

[self.tabBarController setSelectedIndex:0];
self.window.rootViewController = self.tabBarController;

回答9:

like this

UITabBarItem * personalBarItem = [[UITabBarItem alloc] init];
[personalBarItem setFinishedSelectedImage:[UIImage imageNamed:@"personal_click"] withFinishedUnselectedImage:[UIImage imageNamed:@"personal"]];