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

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

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

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

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

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

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

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

Согласно рекомендациям Apple Human Interface Guidelines :

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

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

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

Согласно последним рекомендациям Apple Human Interface Guidelines:

В книжной ориентации значки панели вкладок отображаются над заголовками вкладок. В альбомной ориентации значки и заголовки отображаются рядом. В зависимости от устройства и ориентации система отображает обычную или компактную панель вкладок. Ваше приложение должно включать пользовательские значки панели вкладок для обоих размеров.

Я предлагаю вам использовать приведенную выше ссылку, чтобы понять полную концепцию. Поскольку яблоко обновляет свой документ через регулярные промежутки времени

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

Так что размер 50x50 - хороший выбор.

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

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

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

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

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

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

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

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