2008-09-30 14 views

Respuesta

68

La documentación dice que la imagen de la barra de pestañas es generalmente 30x30, pero he encontrado que la mejor configuración de tamaño de las imágenes es de 48x32 píxeles. Este tamaño aún se renderiza y le da un poco más de espacio.

La imagen es un PNG con transparencia, solo se usa la máscara. La interfaz de usuario muestra la máscara gris cuando no está seleccionada o azul/cromada cuando se selecciona.

5

Comprobar la "Referencia de la Clase UITabBarItem" en el SDK documentation

+4

La respuesta sería aún mejor si se vinculó a la documentación. – Kekoa

+0

Estoy bastante seguro de haber respondido esto cuando no había enlaces públicos fáciles * a * la documentación. (ETA: que ya no es relevante, ya que la información no parece estar allí * ahora * - pero http://developer.apple.com/library/ios/#documentation/UIKit/Reference/UITabBarItem_Class/Reference/ Reference.html si realmente quieres un enlace) – Dre

18

http://developer.apple.com/iphone/library/documentation/UserExperience/Conceptual/MobileHIG/IconsImages/IconsImages.html

Cuando sea posible, se debe utilizar los botones e iconos proporcionados por el sistema de navegación en bares, barras de herramientas y barras de tabulación ... Para obtener una lista completa de los botones e iconos estándar, y directrices sobre cómo para usarlos, consulte “System-Provided Buttons and Icons.”

Por supuesto, no todas las tareas que realiza su aplicación son estándar. Si su aplicación admite tareas personalizadas que los usuarios deben realizar con frecuencia, debe crear iconos personalizados que representen estas tareas en la barra de herramientas o en la barra de navegación. Del mismo modo, si su aplicación muestra una barra de pestañas que permite a los usuarios cambiar entre modos de aplicaciones personalizadas o subconjuntos de datos personalizados, debe diseñar iconos de barra de pestañas que describan claramente estos modos o subconjuntos. Esta sección le brinda orientación sobre cómo diseñar iconos que funcionen bien en barras de navegación, barras de herramientas y barras de pestañas.

Antes de crear el arte de su icono, debe dedicar un tiempo a pensar qué debería transmitir. Al considerar los diseños, busque un icono que sea:

  • Simple y optimizado. Demasiados detalles pueden hacer que un icono parezca descuidado o indescifrable.
  • No se confunde fácilmente con uno de los íconos provistos por el sistema. Los usuarios deberían ser capaces de distinguir su icono personalizado de los iconos estándar de un vistazo.
  • Entendido y ampliamente aceptado. Esfuércese por crear un símbolo que la mayoría de los usuarios interpretarán correctamente y que ningún usuario encontrará ofensivo.

Después de que haya decidido sobre la apariencia de su icono, siga estas pautas medida que lo crea:

  • utilizar el formato PNG.
  • Utilice blanco puro con el alfa adecuado.
  • No incluya una sombra paralela.
  • Utilice anti-aliasing.
  • Si decide agregar un bisel, asegúrese de que sea de 90 ° (para ayudarlo a hacer esto, imagine una fuente de luz ubicada en la parte superior del icono).
  • Para la barra de herramientas y los iconos de la barra de navegación, cree un icono que mida unos 20 x 20 píxeles.
  • Para los iconos de barra de pestañas, cree un icono que mida aproximadamente 30 x 30 píxeles ...
16

Esta afirmación es técnicamente incorrecto:

"... sólo se utiliza la máscara La interfaz de usuario hace que la máscara gris cuando no seleccionada o azul/cromo cuando se selecciona ..."

No estás suministrando ningún tipo de máscara. En su lugar, la imagen de la pestaña debería ser simplemente una monocromática .png imagen, también conocida como , solo 1 color utilizado.

Si proporciona una imagen en color, UIKit la cuantizará en una imagen monocroma. En el peor de los casos, la imagen en color será ~ 8000 bytes, lo que supone un desperdicio de ~ 6k (retina). El formato de archivo debe ser .png de 24 bits con transparencia para que la cuantización funcione correctamente. Aunque este es un formato de archivo de color, no use el color o está perdiendo espacio.

El fondo es tener el tamaño adecuado, con el mejor rendimiento y el uso de memoria, utilice uno de los siguientes:

pantalla estándar
    48x32 PNG, de 24 bits con transparencia (pero use solo 1 color). El peor tamaño de la caja ~ 500 bytes.
    30x30 .PNG, 24 bits con transparencia (pero utilice solo 1 color). Peor tamaño de la caja ~ 350 bytes.

pantalla Retina
    60x60 .PNG, 24 bits con transparencia (pero utilice sólo 1 color). Peor tamaño de la caja ~ 2000 bytes.

Cuestiones relacionadas