Каким размером должны быть изображения TabBar?

У меня есть значки для tabBar размером 100.

Я проверил в Руководстве по человеческому интерфейсу Apple, и он говорит, что размер изображения должен быть 30x30/60x60.

Но поскольку высота контроллера панели вкладок равна 50, я сохранил размер изображения в 50x50.

Теперь, когда я запускаю проект, я вижу уродливый дизайн ниже:

Любая идея, какие изображения размера я должен использовать, чтобы дизайн был идеальным?

Примечание. Я также не пишу текст (например, "Дом", "Поиск" и т.д.). Текст кнопки вкладки находится в самом изображении.

Ответ 1

30x30 - это точки, что означает 30px @1x, 60px @2x, а не где-то посередине. Кроме того, не очень хорошая идея вставить заголовок вкладки в изображение - у вас будет довольно плохая доступность и результаты локализации.

Ответ 2

В соответствии с Руководством по человеческому интерфейсу Apple:

@1x: около 25 x 25 (максимум: 48 x 32)

@2x: около 50 x 50 (максимум: 96 x 64)

@3x: около 75 x 75 (макс.: 144 x 96)

Ответ 3

Ссылка: https://developer.apple.com/ios/human-interface-guidelines/graphics/custom-icons/[https://developer.apple.com/ios/human-interface-guidelines/graphics/custom-icons/].

Таким образом, размер 50x50 является хорошим выбором.

Ответ 4

В соответствии с моей практикой я использую 40 x 40 для стандартного значка на панели инструментов iPad, 80 X 80 для сетчатки.

Из ссылки Apple. https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/BarIcons.html#//apple_ref/doc/uid/TP40006556-CH21-SW1

Если вы хотите создать значок панели, который похож на семейство значков iOS 7, используйте очень тонкий штрих, чтобы нарисовать его. В частности, двухпиксельный штрих (высокое разрешение) хорошо работает для подробных значков, а 3-пиксельный ход хорошо работает для менее подробных значков.

Независимо от визуального стиля значков, создайте панель инструментов или значок панели навигации в следующих размерах:

Около 44 x 44 пикселя Около 22 x 22 пикселя (стандартное разрешение) Независимо от визуального стиля значков, создайте значок панели вкладок в следующих размерах:

Около 50 x 50 пикселей (максимум 96 x 64 пикселя) Около 25 x 25 пикселей (максимум 48 x 32 пикселя) для стандартного разрешения

Ответ 5

В соответствии с последним Руководства Apple по человеческому интерфейсу:

Ответ 6

Thumbs up прежде, чем использовать коды, пожалуйста!!! Создайте изображение, которое полностью охватывает весь элемент панели вкладок для каждого элемента. Это необходимо для использования созданного вами изображения в качестве кнопки элемента панели вкладок. Не забудьте сделать соотношение высоты и ширины одинаковым для каждого элемента панели вкладок. Тогда:

UITabBarController *tabBarController = (UITabBarController *)self;
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];

int x,y;

x = tabBar.frame.size.width/4 + 4; //when doing division, it may be rounded so that you need to add 1 to each item; 
y = tabBar.frame.size.height + 10; //the height return always shorter, this is compensated by added by 10; you can change the value if u like.

//because the whole tab bar item will be replaced by an image, u dont need title
tabBarItem1.title = @"";
tabBarItem2.title = @"";
tabBarItem3.title = @"";
tabBarItem4.title = @"";

[tabBarItem1 setFinishedSelectedImage:[self imageWithImage:[UIImage imageNamed:@"item1-select.png"] scaledToSize:CGSizeMake(x, y)] withFinishedUnselectedImage:[self imageWithImage:[UIImage imageNamed:@"item1-deselect.png"] scaledToSize:CGSizeMake(x, y)]];//do the same thing for the other 3 bar item