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

Question

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

у меня есть значки для панели вкладок размером 100.

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

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

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

enter image description here

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

Примечание: я также не пишу текст (например, Home, Search и т. д.). Текст кнопки tab находится в самом изображении.

733 6

objective-c ios uitabbarcontroller

6 ответов:

Comments

Ничего не найдено.

garrettmurray · Accepted Answer · 2013-08-06 01:14:14

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

rsc · Accepted Answer · 2017-12-16 20:30:16

по словам 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)

Mihir Oza · Accepted Answer · 2018-05-04 13:46:24

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

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

Allen · Accepted Answer · 2017-02-08 09:11:12

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

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

firelyu · Accepted Answer · 2014-09-09 05:34:00

согласно моей практике, я использую значок 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, Используйте очень тонкий штрих, чтобы нарисовать его. В частности, 2-пиксельный ход (высокий разрешение) хорошо работает для подробных значков, а 3-пиксельный штрих хорошо работает для менее подробных значков.

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

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

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

James · Accepted Answer · 2016-06-06 05:08:47

пальцы сначала перед использованием кодов, пожалуйста!!! Создайте изображение, которое полностью покрывает весь элемент панели вкладок для каждого элемента. Это необходимо для использования изображения, созданного в качестве кнопки элемента панели вкладок. Убедитесь, что соотношение высота / ширина будет одинаковым для каждого элемента панели вкладок. Затем:
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