¿Puedo tener un UIBarButtonItem con una imagen coloreada?

Question

Tengo una imagen que quiero mostrar en un UIBarButtonItem, pero por alguna razón solo muestra el contorno del mismo y el resto es todo blanco. ¿Cómo puedo hacer que realmente muestre la imagen?

Gracias!

Answer 1

ACTUALIZACIÓN: Consulte MANIAK_dobrii's answer para una solución más fácil, disponible en iOS 7+.

---

Aquí es cómo utilizo una imagen para un UIBarButtonItem:

UIImage *image = [UIImage imageNamed:@"buttonImage.png"]; 
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom]; 
button.bounds = CGRectMake(0, 0, image.size.width, image.size.height);  
[button setImage:image forState:UIControlStateNormal]; 
[button addTarget:myTarget action:@selector(myAction) forControlEvents:UIControlEventTouchUpInside];  
UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithCustomView:button]; 
… 

Answer 2

Nop. Como se puede leer en el Human Interface Guidelines

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

utilizar el formato PNG. Use blanco puro con el alfa apropiado. No incluya una sombra paralela. Utilice anti-aliasing. Si decide agregar un bisel, asegúrese de que sea de 90 ° (para ayudarlo a hacerlo, 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 aproximadamente 20 x 20 píxeles. Para los iconos de la barra de pestañas, cree un icono que mida unos 30 x 30 píxeles.

Nota: El icono que proporciona para barras de herramientas, barras de navegación y barras de pestañas se usa como máscara para crear el icono que ve en su aplicación. No es necesario crear un ícono a todo color.

Answer 3

Hay otra solución iOS7 +:

NSString *iconFilename = // ... 
UIImage *image = 
    [[UIImage imageNamed:iconFilename] 
     imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal]; 
UIBarButtonItem *barButtonItem = 
    [[UIBarButtonItem alloc] initWithImage:image 
            style:UIBarButtonItemStylePlain 
            target:self 
            action:@selector(onBarButtonItemTapped:)]; 

Extracto de UIImage.h:

... barras de navegación, barras de tabulación, barras de herramientas y controles segmentados tratan automáticamente sus imágenes de primer plano como plantillas ... Puede usar UIImageRenderingModeAlwaysTemplate para forzar que su imagen se represente siempre como una plantilla o UIImageRenderingModeAlwaysOriginal para forzar que su imagen siempre se represente como un original.

Answer 4

Hay otra manera que no implica la codificación en absoluto.

Primero, coloque las imágenes que desea colocar en la barra del documento Assets.xcassets.

Seleccione la imagen en el navegador de activos.

Abra el inspector de atributos de esa imagen en la barra de herramientas vertical derecho.

En "Renderizar como" seleccionar "imagen original".

A pesar de que en el guión gráfico de los botones continuarán siendo pintado con el color de la tinta, cuando se ejecuta en el simulador se mostrará la imagen original.

El modo de procesamiento predeterminado para una imagen varía de un control de interfaz de usuario para el otro. Sin embargo, si configura este parámetro en el inspector de atributos, puede forzar que una imagen siempre se represente con un modo de representación específico.

Si necesita representar la misma imagen con diferentes modos de representación en diferentes controladores, la respuesta de MANIAK_dobrii es más adecuada.

Answer 5

En Swift 3:

let iconname = // ... 
let image = UIImage(named: iconname)?.withRenderingMode(.alwaysOriginal) 
let barButtonItem = UIBarButtonItem(image: image, style: .plain, target: self, action: #selector(self. onBarButtonItemTapped)) 
self.navigationItem.leftBarButtonItem = barButtonItem