Celdas personalizadas de iOS


Ejemplo

Personalizar un UITableViewCell puede permitir interfaces muy potentes, dinámicas y responsivas. Con una amplia personalización y en combinación con otras técnicas se pueden hacer cosas como: actualizar propiedades específicas o elementos de la interfaz a medida que cambian, animar o dibujar cosas en la celda, cargar eficientemente el vídeo a medida que el usuario se desplaza, o incluso mostrar imágenes a medida que se descargan de una red. Las posibilidades son casi infinitas. A continuación se muestra un ejemplo sencillo de cómo puede ser una celda personalizada.

Ejemplo de una UITableViewCell personalizada

Esta sección cubre lo básico, y esperamos que se amplíe para detallar procesos más complejos como los descritos anteriormente.

Creando tu celda personalizada

Primero, crea una nueva subclase de UITableViewCell (crea una nueva clase Cocoa Touch en Xcode y establece UITableViewCell como la superclase). A continuación se muestra el aspecto que puede tener su código después de la subclase.

Swift

class CustomTableViewCell: UITableViewCell { static var identifier: String { return NSStringFromClass(self) } var customLabel: UILabel! override func awakeFromNib() { super.awakeFromNib() // Initialization code customLabel = UILabel(frame: CGRect(x: 0, y: 0, width: contentView.frame.width, height: contentView.frame.height)) customLabel.textAlignment = .center contentView.addSubview(customLabel) }}

Opcionalmente, marque ‘Crear también un archivo XIB’ al crear su nuevo archivo para personalizarlo mediante Interface Builder. En el caso de que lo haga, conecte customLabel como un @IBOutlet

Cree también un archivo XIB

En un UIViewController que contenga el tableView, registre la clase de la nueva celda personalizada (véase más abajo). Tenga en cuenta que esto sólo es necesario si no diseña la celda con un Storyboard en la interfaz de su vista de tabla.

Swift

override func viewDidLoad() { super.viewDidLoad() // Register Cell Class tableView.register(CustomTableViewCell.self, forCellReuseIdentifier: CustomTableViewCell.identifier)}

Si ha elegido utilizar un archivo XIB, registerNib en su lugar:

Swift

// Register NibtableView.register(UINib(nibName: CustomTableViewCell.identifier, bundle: nil), forCellReuseIdentifier: CustomTableViewCell.identifier)

Ahora que tu tableView sabe de tu celda personalizada, puedes dequeue en cellForRowAtIndexPath:

Swift

func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell { // Load the CustomTableViewCell. Make sure the identifier supplied here matches the one from your cell let cell: CustomTableViewCell = tableView.dequeueReusableCellWithIdentifier(CustomTableViewCell.identifier) as! CustomTableViewCell // This is where the magic happens - setting a custom property on your very own cell cell.customLabel.text = "My Custom Cell" return cell}

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *