bar - ios system icons

Swift y Xcode: cómo crear iconos de barra de pestañas personalizados

Question

Tengo un proyecto de aplicación con pestañas en el que estoy trabajando en Xcode escrito en Swift ( Xcode 6.3 and Swift 1.2 ). Estoy teniendo muchos problemas con los iconos personalizados de la barra de pestañas. Diseñé una imagen en Photoshop (CS6), la guardé como PNG, la redimensioné en Prepo para que fuera 30x30 y la 30x30 a Xcode en la biblioteca de activos. Luego configuro el ícono de tab view controllers para esa imagen. Sin embargo, no aparece.

He mirado estas páginas pero no he encontrado ninguna ayuda:
https://www.youtube.com/watch?v=4qqqoAWNfZA Color del icono de la barra de pestañas personalizada http://www.raywenderlich.com/forums/viewtopic.php?f=2&t=19333
http://www.appcoda.com/ios-programming-how-to-customize-tab-bar-background-appearance/ https://www.youtube.com/watch?v=4Tj_SeApUrs

¿Cuál es el proceso adecuado para crear iconos de barra de pestañas personalizados?

Answer 1

¿Creó la vista de pestañas en el constructor de interfaces? Si es así, ya que agregó las imágenes como un activo, deberían aparecer en la propiedad ''Imagen'' de cada botón de pestaña debajo de la barra lateral del inspector. Además, sé que ya has publicado un montón de tutoriales, pero este está bastante actualizado y lo explica detalladamente: http://codewithchris.com/ios-tab-bar-app/

Answer 2

Después de un poco de investigación resolví el problema, así que pensé en publicar aquí en caso de que alguien más tenga un problema similar. En Photoshop hice lo siguiente:

1. Importé la imagen que quería usar como icono de la barra de pestañas (es más fácil si usa una imagen en blanco y negro para no tener que eliminar el color).
2. Establezca el fondo en ''Transparente'' en lugar de blanco.
3. Se eliminó todo el blanco de la imagen para que fuera solo una imagen negra con un fondo transparente.
4. Guardó la imagen como .png.
5. Cambiar el tamaño de la imagen para que sea un cuadrado con dimensiones de 75x75 pixels (y con el nombre [email protected] ), 50x50 pixels (y con el nombre [email protected] ) y 25x25 pixels (y con el nombre imageName.png )

En Xcode hice lo siguiente:

6. Arrastre las imágenes a Xcode y icoImageName el nombre del grupo de imágenes como icoImageName .
7. Seleccioné la pestaña para la que quería establecer la imagen en el guión gráfico en Xcode y establecer la ''Imagen'' (debajo de ''Elemento de barra'' en el Panel de inspección) como icoImageName . Tenga en cuenta que no configuré la ''Imagen seleccionada'' debajo del ''Elemento de la barra de pestañas'' (deje esto en blanco).

Hecho.

Espero que esto ayude a alguien. Gracias a todos por su ayuda también.

Answer 3

Parece que tienes todo configurado correctamente en xCode. El problema es el archivo png que está utilizando.

Descargue esta imagen, http://i.stack.imgur.com/zluev.png , y vea si el problema persiste.

De acuerdo con una respuesta en UITabBarItem, las imágenes solo aparecen como un bloque gris :

Los iconos de la barra de tabulación estándar en iOS se representan únicamente desde el canal alfa. Los colores son ignorados por completo. En lugar de colores, puede utilizar diferentes valores alfa que conducen a un tono de gris diferente (o azul si se selecciona)

Haz el fondo de tus iconos transparente.

Answer 4

class ViewController: UIViewController {
@IBOutlet var btnHome : UIButton!
@IBOutlet var btnInvoice : UIButton!
@IBOutlet var btnSettings : UIButton!
@IBOutlet var btnMyOrder : UIButton!
@IBOutlet var btnLogout : UIButton!
@IBOutlet weak var viewContainer: UIView!
var navController : UINavigationController!
var selectedIndex : Int! = 0
var arrTabColor = [UIColor(red: 35.0/255.0, green: 93.0/255.0, blue: 175.0/255.0, alpha: 1.0),
UIColor(red: 29.0/255.0, green: 86.0/255.0, blue: 167.0/255.0, alpha: 1.0),
UIColor(red: 35.0/255.0, green: 93.0/255.0, blue: 175.0/255.0, alpha: 1.0),
UIColor(red: 29.0/255.0, green: 86.0/255.0, blue: 167.0/255.0, alpha: 1.0),
UIColor(red: 35.0/255.0, green: 93.0/255.0, blue: 175.0/255.0, alpha: 1.0)]
var arrTabIdentiFierVC = ["FirstVC","SecondVC","FirstVC","FirstVC","SecondVC"]
// MARK: - Life Cycle
override func viewDidLoad()
{
super.viewDidLoad()
setTabbarImage(0)
// Do any additional setup after loading the view, typically from a nib.
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
func setTabBarClicked(_ storyIdentifier : String,identifier : String)
{
let aStoryboard = UIStoryboard.init(name: storyIdentifier, bundle: nil)
let newViewController = aStoryboard.instantiateViewController(withIdentifier: identifier)
navController = UINavigationController(rootViewController: newViewController)
self.addChildViewController(navController)
navController.view.frame = viewContainer.frame
newViewController.view.frame = viewContainer.frame
self.viewContainer.addSubview(navController.view)
newViewController.didMove(toParentViewController: self)
}
func setTabbarImage(_ selectedIndex : Int!)
{
btnHome.backgroundColor = arrTabColor[0]
btnInvoice.backgroundColor = arrTabColor[1]
btnSettings.backgroundColor = arrTabColor[2]
btnMyOrder.backgroundColor = arrTabColor[3]
btnLogout.backgroundColor = arrTabColor[4]
let selectedColor = UIColor(red: 40/255, green: 142/255, blue: 206.0/255, alpha: 1.0)
if selectedIndex == 0
{
btnHome.backgroundColor = selectedColor
}
else if selectedIndex == 1
{
btnInvoice.backgroundColor = selectedColor
}
else if selectedIndex == 2
{
btnSettings.backgroundColor = selectedColor
}
else if selectedIndex == 3
{
btnMyOrder.backgroundColor = selectedColor
}
else if selectedIndex == 4
{
btnLogout.backgroundColor = selectedColor
}
}
// MARK: - Action Method
@IBAction func HomeClicked(_ sender : AnyObject?)
{
setTabbarImage(0)
setTabBarClicked("Main",identifier: arrTabIdentiFierVC[0])
}
@IBAction func InvoiceClicked(_ sender : AnyObject?)
{
setTabbarImage(1)
setTabBarClicked("Main",identifier: arrTabIdentiFierVC[1])
}
@IBAction func SettingClicked(_ sender : AnyObject?)
{
setTabbarImage(2)
setTabBarClicked("Main",identifier: arrTabIdentiFierVC[2])
}
@IBAction func MyorderClicked(_ sender : AnyObject?)
{
setTabbarImage(3)
setTabBarClicked("Main",identifier: arrTabIdentiFierVC[3])
}
@IBAction func logoutClicked(_ sender : AnyObject?)
{
setTabbarImage(4)
let alert = UIAlertController(title: "", message: "Are you sure want to logout?", preferredStyle: UIAlertControllerStyle.alert)
let CancelAction = UIAlertAction(title: "NO", style: .default) { (action:UIAlertAction!) in
}
alert.addAction(CancelAction)
let OKAction = UIAlertAction(title: "YES", style: .default) { (action:UIAlertAction!) in
// var isNav : Bool! = false
//for objChild in (self.parent?.childViewControllers)!
// {
// if objChild.isKind(of: LoginVC.self)
// {
// self.navigationController!.popToViewController(objChild, animated: true)
// CommonMethods.removeCustomObject(Constants.kUserProfile)
//
// isNav = true
// break
//
// }
// }
// if !isNav
// {
// CommonMethods.removeCustomObject(Constants.kUserProfile)
// let aNavController = (AppDelegate.getDelegate().window!.rootViewController! as! UINavigationController)
// let storyboard = UIStoryboard(name: "Main", bundle: nil)
// var aVCObj = UIViewController()
// aVCObj = storyboard.instantiateViewController(withIdentifier: "LoginVC")
// var aMutArr = aNavController.viewControllers
// aMutArr.insert(aVCObj, at: 0)
// aNavController.viewControllers = aMutArr
// aNavController.popToRootViewController(animated: true)
// }
}
alert.addAction(OKAction)
self.present(alert, animated: true, completion: nil)
}
// MARK: - Action Method
}