Cómo incrustar un pequeño ícono en UILabel

Necesito incrustar íconos pequeños (tipo de viñetas personalizadas) en mi UILabels en iOS7. ¿Cómo puedo hacer esto en el diseñador de interfaces? O al less en el código?

En Android hay leftDrawable y rightDrawable para tags, pero ¿cómo se hace en iOS? Muestra en Android: muestra de Android

Puede hacer esto con los files adjuntos de text de iOS 7, que son parte de TextKit. Algún código de ejemplo:

NSTextAttachment *attachment = [[NSTextAttachment alloc] init]; attachment.image = [UIImage imageNamed:@"MyIcon.png"]; NSAttributedString *attachmentString = [NSAttributedString attributedStringWithAttachment:attachment]; NSMutableAttributedString *myString= [[NSMutableAttributedString alloc] initWithString:@"My label text"]; [myString appendAttributedString:attachmentString]; myLabel.attributedText = myString; 

Esta es la forma de incrustar íconos en UILabel.

También para Alinear el icono use attachment.bounds


Versión Swift

 //Create Attachment let imageAttachment = NSTextAttachment() imageAttachment.image = UIImage(named:"iPhoneIcon") //Set bound to reposition let imageOffsetY:CGFloat = -5.0; imageAttachment.bounds = CGRect(x: 0, y: imageOffsetY, width: imageAttachment.image!.size.width, height: imageAttachment.image!.size.height) //Create string with attachment let attachmentString = NSAttributedString(attachment: imageAttachment) //Initialize mutable string let completeText = NSMutableAttributedString(string: "") //Add image to mutable string completeText.append(attachmentString) //Add your text to mutable string let textAfterIcon = NSMutableAttributedString(string: "Using attachment.bounds!") completeText.append(textAfterIcon) self.mobileLabel.textAlignment = .center; self.mobileLabel.attributedText = completeText; 

Versión Objective-C

  NSTextAttachment *imageAttachment = [[NSTextAttachment alloc] init]; imageAttachment.image = [UIImage imageNamed:@"iPhoneIcon"]; CGFloat imageOffsetY = -5.0; imageAttachment.bounds = CGRectMake(0, imageOffsetY, imageAttachment.image.size.width, imageAttachment.image.size.height); NSAttributedString *attachmentString = [NSAttributedString attributedStringWithAttachment:imageAttachment]; NSMutableAttributedString *completeText= [[NSMutableAttributedString alloc] initWithString:@""]; [completeText appendAttributedString:attachmentString]; NSMutableAttributedString *textAfterIcon= [[NSMutableAttributedString alloc] initWithString:@"Using attachment.bounds!"]; [completeText appendAttributedString:textAfterIcon]; self.mobileLabel.textAlignment=NSTextAlignmentRight; self.mobileLabel.attributedText=completeText; 

introduzca la descripción de la imagen aquí

introduzca la descripción de la imagen aquí

Rápido:

 let attachment = NSTextAttachment() attachment.image = UIImage(named: "yourIcon.png") let attachmentString = NSAttributedString(attachment: attachment) let myString = NSMutableAttributedString(string: price) myString.appendAttributedString(attachmentString) label.attributedText = myString 

Su image de reference parece un button. Pruebe (también se puede hacer en Interface Builder):

introduzca la descripción de la imagen aquí

 UIButton* button = [UIButton buttonWithType:UIButtonTypeCustom]; [button setFrame:CGRectMake(50, 50, 100, 44)]; [button setImage:[UIImage imageNamed:@"img"] forState:UIControlStateNormal]; [button setImageEdgeInsets:UIEdgeInsetsMake(0, -30, 0, 0)]; [button setTitle:@"Abc" forState:UIControlStateNormal]; [button setTitleColor:[UIColor blackColor] forState:UIControlStateNormal]; [button setBackgroundColor:[UIColor yellowColor]]; [view addSubview:button]; 

He realizado una implementación de esta function en breve aquí: https://github.com/anatoliyv/SMIconLabel

El código es tan simple como es posible:

 var labelLeft = SMIconLabel(frame: CGRectMake(10, 10, view.frame.size.width - 20, 20)) labelLeft.text = "Icon on the left, text on the left" // Here is the magic labelLeft.icon = UIImage(named: "Bell") // Set icon image labelLeft.iconPadding = 5 // Set padding between icon and label labelLeft.numberOfLines = 0 // Requinetworking labelLeft.iconPosition = SMIconLabelPosition.Left // Icon position view.addSubview(labelLeft) 

Así es como se ve:

Imagen SMIconLabel

Versión Swift 3

 let attachment = NSTextAttachment() attachment.image = UIImage(named: "plus") attachment.bounds = CGRect(x: 0, y: 0, width: 10, height: 10) let attachmentStr = NSAttributedString(attachment: attachment) let myString = NSMutableAttributedString(string: "") myString.append(attachmentStr) let myString1 = NSMutableAttributedString(string: "My label text") myString.append(myString1) lbl.attributedText = myString 

Versión Swift 2.0:

 //Get image and set it's size let image = UIImage(named: "imageNameWithHeart") let newSize = CGSize(width: 10, height: 10) //Resize image UIGraphicsBeginImageContextWithOptions(newSize, false, 0.0) image?.drawInRect(CGRectMake(0, 0, newSize.width, newSize.height)) let imageResized = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() //Create attachment text with image var attachment = NSTextAttachment() attachment.image = imageResized var attachmentString = NSAttributedString(attachment: attachment) var myString = NSMutableAttributedString(string: "I love swift ") myString.appendAttributedString(attachmentString) myLabel.attributedText = myString 

Prueba a arrastrar una UIView a la pantalla en IB. Desde allí, puede arrastrar UIImageView y UILabel a la vista que acaba de crear. Establezca la image de UIImageView en el inspector de properties como la image de viñeta personalizada (que deberá agregar a su proyecto arrastrándola al panel de navigation) y puede escribir text en la label.

testing de esta manera …

  self.lbl.text=@"Drawble Left"; UIImageView *img=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 20, 20)]; img.image=[UIImage imageNamed:@"Star.png"]; [self.lbl addSubview:img]; 

Puede usar un UITextField con la propiedad leftView y luego establecer la propiedad enabled en NO

O use un button UIB y setImage:forControlState

En Swift 2.0,

Mi solución al problema es una combinación de un par de respuestas sobre esta pregunta. El problema que enfrenté en la respuesta de @ Phil fue que no podía cambiar la position del ícono, y siempre aparecía en la esquina opuesta. Y la única respuesta de @anatoliy_v, no pude cambiar el tamaño del tamaño de icono que quiero agregar a la cadena.

Para que funcione para mí, primero hice un pod 'SMIconLabel' y luego creó esta function:

 func drawTextWithIcon(labelName: SMIconLabel, imageName: String, labelText: String!, width: Int, height: Int) { let newSize = CGSize(width: width, height: height) let image = UIImage(named: imageName) UIGraphicsBeginImageContextWithOptions(newSize, false, 0.0) image?.drawInRect(CGRectMake(0, 0, newSize.width, newSize.height)) let imageResized = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() labelName.text = " \(labelText)" labelName.icon = imageResized labelName.iconPosition = .Left } 

Esta solución no solo te ayudará a ubicar la image, sino que también te permitirá realizar los cambios necesarios en el tamaño del ícono y otros attributes.

Gracias.

tienes que hacer un object personalizado donde UIView una UIView y dentro de ti pusiste un UIImageView y un UILabel

Swift 3 UILabel extensión

Sugerencia: Si necesita algo de espacio entre la image y el text, solo use un espacio o dos antes del text de la label.

 extension UILabel { func addIconToLabel(imageName: String, labelText: String, bounds_x: Double, bounds_y: Double, boundsWidth: Double, boundsHeight: Double) { let attachment = NSTextAttachment() attachment.image = UIImage(named: imageName) attachment.bounds = CGRect(x: bounds_x, y: bounds_y, width: boundsWidth, height: boundsHeight) let attachmentStr = NSAttributedString(attachment: attachment) let string = NSMutableAttributedString(string: "") string.append(attachmentStr) let string2 = NSMutableAttributedString(string: labelText) string.append(string2) self.attributedText = string } }