CODEWITHSUNDEEP
objective-cheightuitabbariphone-x
Najam
Najam

Reputation: 1159

IOS Tab Bar height issue on iPhone X

I have tried many solutions including This Solution. So Please read full question before flagging it as duplicate. For iPhone X I have use Safe Area guide to support iPhone X design. Everything is fine except for Tab Bar I have double check on its safe area constraints but still after running it's items got scattered. enter image description here

But please not that on height of tab bar is constant and correct only items in it are disturb.

Here is image of my story board please not its constraints and its adjustment.

enter image description here

As per my knowledge everything is everything is right... but for sure I am missing something, please check and any suggestion will be a great help. But please not I have tried almost every way which is mentioned on stack or first few links of google.

Here is my code which I am using to populate items' images.

UIColor *color = [UIColor colorWithRed:192.0f/255.0f green:41.0f/255.0f blue:66.0f/255.0f alpha:1.0f];

NSDictionary *textColors = [NSDictionary dictionaryWithObjectsAndKeys:color, NSForegroundColorAttributeName, nil];

for(UITabBarItem *tab in self.tabBar.items)
{
    [tab setTitleTextAttributes:textColors forState:UIControlStateNormal];
    [tab setTitleTextAttributes:textColors forState:UIControlStateSelected];
}
self.tabBar.itemPositioning = UITabBarItemPositioningAutomatic;

[self.tabBar.items[0] setImage:[[UIImage imageNamed:@"search_icon"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
[self.tabBar.items[1] setImage:[[UIImage imageNamed:@"user_icon"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
[self.tabBar.items[2] setImage:[[UIImage imageNamed:@"call_icon"]
    imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];
[self.tabBar.items[3] setImage:[[UIImage imageNamed:@"services_icon"]
    imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]];

Upvotes: 0

Views: 3070

Answers (4)

Gaurav Sharma
Gaurav Sharma

Reputation: 1

This will definitely work.

override func viewDidLoad() { super.viewDidLoad()

    let numberOfItems = CGFloat(tabBArView.items!.count)
    let tabBarItemSize = CGSize(width: tabBArView.frame.width / numberOfItems, height: 48)

     tabBArView.selectionIndicatorImage =  UIImage.imageWithColor(color: UIColor.orange, size: tabBarItemSize).resizableImage(withCapInsets: UIEdgeInsets.zero)
    tabBArView.frame.size.width = self.view.frame.width + 4
    tabBArView.frame.origin.x = -2

extension UIImage {

class func imageWithColor(color: UIColor, size: CGSize) -> UIImage {
    let rect: CGRect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
    UIGraphicsBeginImageContextWithOptions(size, false, 0)
    color.setFill()
    UIRectFill(rect)
    let image: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
    return image
}

Upvotes: 0

Serhii Stakhiv
Serhii Stakhiv

Reputation: 1036

Just put your UITabBar inside a UIView!

This is working for me.

Upvotes: 0

Najam
Najam

Reputation: 1159

at first I tried almost every possible solution but that didn't work at all, but then at the end somehow I added some negative margin with bottom. Let's say "-1" and then everything started working like charm. I also tried setting positive margin just for experiment. But that didn't work, I concluded only negative number works. This must be an issue in UIKit. Set bottom constraint with safe area as any negative number will solve this issue.enter image description here

check its bottom constraint.

Upvotes: 1

LGP
LGP

Reputation: 4333

Try using the method recommended in the documentation to set the items.

To configure tab bar items directly, use the setItems:animated: method of the tab bar itself.

- (void)setItems:(NSArray<UITabBarItem *> *)items animated:(BOOL)animated;

Do something like this.

UIIImage *image0 = [UIImage imageNamed:@"search_icon"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UITabBarItem *item0 = [[UITabBarItem alloc] initWithTitle:self.tabBar.items[0].title image:image0 tag:0];
// And so on or in a loop
NSArray<UITabBarItem *> *items = @[ item0, ]; // Add all items here
[self.tabBar setItems:items animated:NO];

Read more here

https://developer.apple.com/documentation/uikit/uitabbar?language=objc

Upvotes: 0

Related Questions