ios - icon - ¿Qué tamaño deberían tener las imágenes de TabBar?
search bar ios (6)
Tengo iconos para un tabBar de tamaño 100.
Revisé las Pautas de interfaz humana de Apple y dice que el tamaño de la imagen debe ser de 30x30 / 60x60 .
Pero como la altura del controlador de la barra de pestañas es 50, mantuve el tamaño de la imagen en 50x50 .
Ahora, cuando ejecuto el proyecto, veo el feo diseño a continuación:
¿Alguna idea de qué tamaño de imágenes debería usar para que el diseño sea perfecto?
Nota: No estoy escribiendo texto también (por ejemplo, Inicio, Búsqueda, etc.). El texto del botón de tabulación está allí en la imagen misma.
30x30 son puntos, lo que significa 30px @ 1x, 60px @ 2x, no en un punto intermedio. Además, no es una gran idea insertar el título de la pestaña en la imagen: va a tener unos resultados de localización y acceso bastante pobres.
De acuerdo con las últimas pautas de interfaz humana de Apple:
En orientación vertical, los iconos de la barra de pestañas aparecen encima de los títulos de las pestañas. En orientación horizontal, los iconos y títulos aparecen uno al lado del otro. Según el dispositivo y la orientación, el sistema muestra una barra de pestañas regular o compacta. Su aplicación debe incluir iconos de barra de pestañas personalizados para ambos tamaños.
De acuerdo con las pautas de interfaz humana de Apple :
@ 1x: aproximadamente 25 x 25 (máximo: 48 x 32)
@ 2x: aproximadamente 50 x 50 (máximo: 96 x 64)
@ 3x: aproximadamente 75 x 75 (max: 144 x 96)
De acuerdo con mi práctica, uso 40 x 40 para el ícono de ítem de barra de pestañas estándar de iPad, 80 X 80 para retina.
De la referencia de Apple. https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/BarIcons.html#//apple_ref/doc/uid/TP40006556-CH21-SW1
Si desea crear un icono de barra que parece estar relacionado con la familia de iconos de iOS 7, use un trazo muy fino para dibujarlo. Específicamente, un trazo de 2 píxeles (alta resolución) funciona bien para iconos detallados y un trazo de 3 píxeles funciona bien para iconos menos detallados.
Independientemente del estilo visual del icono, cree una barra de herramientas o un icono de barra de navegación en los siguientes tamaños:
Aproximadamente 44 x 44 píxeles Aproximadamente 22 x 22 píxeles (resolución estándar) Independientemente del estilo visual del icono, cree un icono de barra de pestañas en los siguientes tamaños:
Aproximadamente 50 x 50 píxeles (96 x 64 píxeles máximo) Aproximadamente 25 x 25 píxeles (48 x 32 píxeles máximo) para resolución estándar
Los pulgares arriba antes de los códigos de uso por favor !!! Crea una imagen que cubra por completo todo el elemento de la barra de pestañas para cada elemento. Esto es necesario para usar la imagen que ha creado como un botón de elemento de barra de pestañas. Asegúrese de hacer que la relación alto / ancho sea la misma de cada elemento de la barra de pestañas. Entonces:
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
Entonces, el tamaño 50x50 es una buena opción.