iOS 7.1 问题 - 标签栏图标图像在该标签按钮上触摸和拖动时会自动调整大小

iOS 7.1 issue - Tabbar icon image is automatically resize when touch and drag on that tab button

提问by SaintTail

I have this code

我有这个代码

[tabBarItem1 setFinishedSelectedImage:[UIImage imageNamed:@"tab_pressed_home_icon"] withFinishedUnselectedImage:[UIImage imageNamed:@"tab_home_icon"]];

tabBarItem1.imageInsets = UIEdgeInsetsMake(8, 0, -2, 0);

which set an icon on the tab bar.

它在标签栏上设置了一个图标。

everything work fines so far until last night that i update Xcode 5.1

到目前为止一切正常，直到昨晚我更新了 Xcode 5.1

and run the app on ios7.1 simulator.

并在 ios7.1 模拟器上运行该应用程序。

here is the app

这是应用程序

now when i tap the tab bar the icon image size is decrease an when i release the finger image is back to normal. But if i tap the icon and drag it the image is look like this (scale down).

现在，当我点击标签栏时，图标图像大小会减小，而当我松开手指图像时，它会恢复正常。但是如果我点击图标并拖动它，图像看起来像这样（缩小）。

like this

像这样

how can this happen? is there anyway to solve this?

这怎么会发生？有没有办法解决这个问题？

Thanks.

谢谢。

回答by wrightak

This problem was resolved by setting the imageInsets of the tabBarItem as others have mentioned. You can do this in code or you can do it in Interface Builder, it doesn't matter.

这个问题是通过设置 tabBarItem 的 imageInsets 来解决的，正如其他人提到的那样。您可以在代码中执行此操作，也可以在 Interface Builder 中执行此操作，这无关紧要。

The important point is to have the top inset BE EQUAL to the bottom inset.

重要的一点是让顶部插图与底部插图相等。

回答by CoderPug

I had the same problem on iOS 7.1 when trying to set the Image insets by code like:

我在 iOS 7.1 上尝试通过以下代码设置图像插入时遇到了同样的问题：

[self.tabBarItem setImageInsets:UIEdgeInsetsMake(5, 0, -5, 0)];

[self.tabBarItem setImageInsets:UIEdgeInsetsMake(5, 0, -5, 0)];

So I solved it using directly the Bar Item Size on my Storyboard.

所以我直接使用故事板上的 Bar Item Size 解决了这个问题。

Take in count that for this to work you should be assigning the image of you TabBarItem in the following way

考虑到要使其工作，您应该按以下方式分配 TabBarItem 的图像

UITabBar *tabBar = self.tabBarController.tabBar;
UITabBarItem *myItem = [tabBar.items objectAtIndex:0];

[homeItem setFinishedSelectedImage:[UIImage imageNamed:@"A.png"]
       withFinishedUnselectedImage:[UIImage imageNamed:@"B.png"]];

instead of this way

而不是这种方式

[self.tabBarItem setFinishedSelectedImage:[UIImage imageNamed:@"A.png"]
              withFinishedUnselectedImage:[UIImage imageNamed:@"B.png"]];

Update

更新

To access the Bar Item Size select directly the 'Item' element under the Scene of any of your Tab Bar Controller's child. (Image1)

要访问 Bar Item Size，请直接选择任何 Tab Bar Controller 子项的 Scene 下的“Item”元素。（图片1）

回答by Felipe FMMobile

my problem is similar, the tabbar icon changed it position in 7.1 update, this problem is really annoying, and I did a quick solution because I have to approve the app. Was this:

我的问题是类似的，标签栏图标在7.1更新中改变了它的位置，这个问题真的很烦人，我做了一个快速解决方案，因为我必须批准该应用程序。这是：

Ok I not sure that is the best solution, but for me works.

好的，我不确定这是最好的解决方案，但对我来说是有效的。

回答by iHilas

Same problem here. Also after update to iOS 7.1 and xcode 5.1 My solution: The tab bar item size was set at 4 for Bottom.(in Size inspector) I changed it to 0 like all the others and the problem was gone.

同样的问题在这里。同样在更新到 iOS 7.1 和 xcode 5.1 之后，我的解决方案：选项卡栏项目大小设置为底部的 4。（在大小检查器中）我像所有其他人一样将其更改为 0，问题就消失了。

回答by yuhua

I give it up, my solution is here:

我放弃了，我的解决方案在这里：

use the function to resize and make offset with UIImage

使用该函数调整大小并进行偏移 UIImage

- (UIImage *)imageWithImage:(UIImage *)image scaledToSize:(CGSize)newSize andOffSet:(CGPoint)offSet{
    UIGraphicsBeginImageContextWithOptions(newSize, NO, 0.0);
    [image drawInRect:CGRectMake(offSet.x, offSet.y, newSize.width-offSet.x, newSize.height-offSet.y)];
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return newImage;
}

and set the tab bar item image properly:

并正确设置标签栏项目图像：

UITabBarItem *barItem  = [self.tabBarController.tabBar.items objectAtIndex:i];
CGSize size = CGSizeMake(49, 49);
CGPoint offset = CGPointMake(10, 10);
[barItem setFinishedSelectedImage:[self imageWithImage:selectedImage scaledToSize:size andOffSet:offset]
         withFinishedUnselectedImage:[self imageWithImage:unSelectedImage scaledToSize:size andOffSet:offset]];

if any other solutions would be help!

如果任何其他解决方案会有所帮助！

回答by Tope

You may put a UIView on top of the tab bar, and add a UITapGestureReognizer to the UIView. When tapped, I determine where it is and call the appropriate selected item for the tabbar. Hack, but works quite nicely and lets you keep your inset values to whatever you want.

您可以将 UIView 放在选项卡栏的顶部，并在 UIView 中添加一个 UITapGestureReognizer。当点击时，我确定它在哪里并为标签栏调用适当的选定项目。Hack，但效果很好，可以让您将插入值保留为您想要的任何值。

 @property UIView  tabBarCover;//place on top of uitabbar and give it clear color background

 - (void)viewDidLoad
 {
   [tabBar setSelectedItem:[tabBar.items objectAtIndex:0]];
    UITapGestureRecognizer *singleFingerTap =
                        [[UITapGestureRecognizer alloc] initWithTarget:self
                                        action:@selector(handleSingleTap:)];
   [tabBarCover addGestureRecognizer:singleFingerTap];

 }

Then each time the UIView is tapped, set the selected item based on where the user touched. I had 3 tab bar items, so I just did some logic for the x coordinate.

然后每次点击 UIView 时，根据用户触摸的位置设置所选项目。我有 3 个标签栏项目，所以我只是为 x 坐标做了一些逻辑。

-(void) handleSingleTap:(UITapGestureRecognizer *) recognizer
{
    CGPoint location = [recognizer locationInView:[recognizer.view superview]];
    //NSLog(@"tapped it %lf", location.x);
    if(location.x<=105){
        //1st 3rd tapped, do something

    }
    else if(location.x >105 && location.x<=210)
    {
       //do nothing, selected item stays same. this is glas
    }else{
       //must be in 3rd section so do that load

    }

}

Hope it helps.

希望能帮助到你。

回答by Yessenzhol Tuiteyev

I spent about 3 hours of it! And I have found our mistake. it is not bug of iOS.

我花了大约3个小时！我发现了我们的错误。这不是iOS的错误。

Note: imageInsets will not help! because this is problem with image's scale. I played 2 hours with it! and no result. it was stupid way to try solve the problem!

注意：imageInsets 不会有帮助！因为这是图像比例的问题。我玩了2个小时！并没有结果。尝试解决问题的方法很愚蠢！

Please look this project http://www.raywenderlich.com/50310/storyboards-tutorial-in-ios-7-part-2

请看这个项目http://www.raywenderlich.com/50310/storyboards-tutorial-in-ios-7-part-2

on this project Players and Gestures icons works perfectly! because there are icons for retina and non-retina.

在这个项目中，玩家和手势图标完美无缺！因为有视网膜和非视网膜的图标。

if you have icons for both scale, then no problem. use them! everything will work fine! it was 1-variant!

如果您有两个比例的图标，那么没问题。使用它们！一切都会好起来的！它是 1 变体！

2-variant. if you have only one big image and you want use for both display, then you need specify the "scale" of the resized image:

2-变体。如果您只有一张大图像并且想要同时用于两个显示，那么您需要指定调整大小的图像的“比例”：

(UIImage *)thumbnailImageSize:(CGSize)size fromImage:(UIImage *)image { 
    if ([[UIScreen mainScreen] respondsToSelector:@selector(scale)] == YES && [[UIScreen mainScreen] scale] == 3.00) {
        _scale = 3.00; 
    } else if ([[UIScreen mainScreen] respondsToSelector:@selector(scale)] == YES && [[UIScreen mainScreen] scale] == 2.00) { 
        _scale = 2.00; 
    } else 
        _scale = 1.00;

    UIGraphicsBeginImageContextWithOptions(size, NO, _scale); 
    [image drawInRect:CGRectMake(0, 0, size.width, size.height)]; 
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext(); 
    return newImage; 
}

回答by IdoT

My answer is based on others posted here - setting to 0 all ImageInsets in tab bar items:

我的回答基于此处发布的其他人 - 将标签栏项目中的所有 ImageInsets 设置为 0：

for (UITabBarItem* item in self.tabBar.items)
{
    [item setImageInsets: UIEdgeInsetsMake(0, 0, 0, 0)];
}

回答by Santiago Carmona González

My solution was to divide by 2 the x and y points, then I set it to left, right, top and bottom respectively.

我的解决方案是将 x 和 y 点除以 2，然后分别将其设置为左、右、上和下。

回答by Ahmad Al-Attal

try this it should do the trick and won't affect the older versions

试试这个它应该可以解决问题并且不会影响旧版本

Put the below lines in the any controller init method:

将以下几行放在任何控制器 init 方法中：

UIImage* image = [UIImage imageNamed: @"Your tabbar image name goes here"];
    if ([image respondsToSelector: @selector(imageWithRenderingMode:)])
            [self.tabBarItem setImage: [image imageWithRenderingMode: UIImageRenderingModeAlwaysOriginal]];