UITextView con bordes


127

Quiero tener un borde gris delgado alrededor de a UITextView. He revisado la documentación de Apple pero no pude encontrar ninguna propiedad allí. Por favor ayuda.

Respuestas:


306
#import <QuartzCore/QuartzCore.h>

....

// typically inside of the -(void) viewDidLoad method
self.yourUITextView.layer.borderWidth = 5.0f;
self.yourUITextView.layer.borderColor = [[UIColor grayColor] CGColor];

62
No pensé que realmente necesitara mucha explicación, la vista es UITextView, y el código va a donde sea que haya configurado la vista (awakeFromNib o viewDidLoad son dos lugares posibles). Como no se proporcionó ningún código, no hay forma de dar un buen contexto en respuesta.
Kendall Helmstetter Gelner

XCode no me deja establecer el borde para la capa. Dice que la capa es de solo lectura. Hice UIView (donde puse algunos elementos) e intenté establecer un borde para esa vista. Tratando de hacer esto self.myView.layer.borderWidth ..., pero como dije, la capa es de solo lectura, por lo que la capa no tiene ningún método o variable para establecer
Paulius Vindzigelskis

2
¿Importó QuartzCore? También puede intentar obtener un CALayer de self.myView y establecer borderWidth en eso. Es configurable.
Kendall Helmstetter Gelner

Más información sobre "capa" de solo lectura en UIView (la propiedad de capa es, pero puede establecer valores en la capa para una vista): stackoverflow.com/questions/12837077/…
Kendall Helmstetter Gelner

42

Agregue lo siguiente para las esquinas redondeadas:

self.yourUITextview.layer.cornerRadius = 8; 

23

Aquí está el código que usé para agregar un borde alrededor de mi TextViewcontrol llamado "tbComments":

self.tbComments.layer.borderColor = [[UIColor grayColor] CGColor];
self.tbComments.layer.borderWidth = 1.0;
self.tbComments.layer.cornerRadius = 8;

Y así es como se ve:

ingrese la descripción de la imagen aquí

Pan comido.


19

Añado UIImageViewcomo una subvista de la UITextView. Esto coincide con el borde nativo en un UITextField, incluido el gradiente de arriba a abajo:

ingrese la descripción de la imagen aquí

textView.backgroundColor = [UIColor clearColor];
UIImageView *borderView = [[UIImageView alloc] initWithFrame: CGRectMake(0, 0, textView.frame.size.width, textView.frame.size.height)];
borderView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
UIImage *textFieldImage = [[UIImage imageNamed:@"TextField.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(15, 8, 15, 8)];
borderView.image = textFieldImage;
[textField addSubview: borderView];
[textField sendSubviewToBack: borderView];

Estas son las imágenes png que uso y una representación jpg:

@ 1x

@ 2x

ingrese la descripción de la imagen aquí


Buena solución. ¿Son estas imágenes tuyas? ¿Somos libres de usarlos?
James Webster

Estas imágenes se 'modelan' en las que se usan en las propias aplicaciones de Apple. En verdad, los extraje e hice muy pocos cambios, si es que hubo alguno. Úselo bajo su propio riesgo. El objetivo era imitar la apariencia nativa, por lo que es difícil encontrar algo que se vea muy diferente. Por lo que vale, he enviado y había aprobado aplicaciones que usan esta imagen sin problemas.
Ben Packard

Parece que los archivos de imagen png se han eliminado; no tengo la intención de actualizar esto constantemente con una nueva ubicación de imagen, así que pido disculpas si el jpg no funciona para usted. Puedo volver a subir como y cuando se solicite a través de comentarios.
Ben Packard

3
Con la imagen adjunta, esto funciona mejor: coderesizableImageWithCapInsets: UIEdgeInsetsMake (28, 14, 28, 14)
RefuX

Los enlaces de WikiUpload (para las dos imágenes) no pueden encontrar los archivos de imagen ahora. ;-(
Mike Gledhill

18

Funciona muy bien, pero el color debe ser un CGColor, no UIColor:

view.layer.borderWidth = 5.0f;
view.layer.borderColor = [[UIColor grayColor] CGColor];

44
#import <QuartzCore / QuartzCore.h>
kolinko

6

Creo que las respuestas anteriores son para las versiones anteriores de Swift. Busqué en Google un poco y el código a continuación funciona para Swift 4. Simplemente lo comparto para quien se beneficie.

self.textViewName.layer.borderColor = UIColor.lightGray.cgColor
self.textViewName.layer.borderWidth = 1.0
self.textViewName.layer.cornerRadius = 8

¡Feliz codificación!


Con Swift5 y el modo oscuro, incluso puede usar los colores del sistema:self.textViewName.layer.borderColor = UIColor.systemGray4.cgColor
multitudes

4

para programación rápida, use esto

tv_comment.layer.borderWidth = 2
tv_comment.layer.borderColor = UIColor(red: 0.2, green: 0.2, blue: 0.2, alpha: 1).CGColor

O simplementeUIColor(white: 0.2, alpha: 1).CGColor
Leo

3

esto es lo más cerca que pude de un UITextField original

func updateBodyTextViewUI() {
    let borderColor = UIColor.init(red: 212/255, green: 212/255, blue: 212/255, alpha: 0.5)

    self.bodyTextView.layer.borderColor = borderColor.CGColor
    self.bodyTextView.layer.borderWidth = 0.8
    self.bodyTextView.layer.cornerRadius = 5
}

1

puede agregar borde a UITextView desde el Guión gráfico - Inspector de identidad - Atributo de tiempo de ejecución definido por el usuario

ingrese la descripción de la imagen aquí


0

A partir de iOS 8 y Xcode 6, ahora encuentro que la mejor solución es subclasificar UITextView y marcar la subclase como IB_DESIGNABLE, lo que le permitirá ver el borde en el guión gráfico.

Encabezamiento:

#import <UIKit/UIKit.h>

IB_DESIGNABLE

@interface BorderTextView : UITextView

@end

Implementación:

#import "BorderTextView.h"

@implementation BorderTextView

- (void)drawRect:(CGRect)rect
{
    self.layer.borderWidth = 1.0;
    self.layer.borderColor = [UIColor blackColor].CGColor;
    self.layer.cornerRadius = 5.0f;
}

@end

Luego, simplemente arrastre su UITextView en el guión gráfico y establezca su clase en BorderTextView


0

Lo que lo hizo funcionar (además de seguir las respuestas aquí) es agregar el borderStyleatributo:

#import <QuartzCore/QuartzCore.h>
..

phoneTextField.layer.borderWidth = 1.0f;
phoneTextField.layer.borderColor = [[UIColor blueColor] CGColor];
phoneTextField.borderStyle = UITextBorderStyleNone;

0

Solo una pequeña adición. Si hace que el borde sea un poco más ancho, interferirá con el lado izquierdo y derecho del texto. Para evitar eso, agregué la siguiente línea:

self.someTextView.textContainerInset = UIEdgeInsetsMake(8.0, 8.0, 8.0, 8.0);

0

En Swift 3, puede usar las siguientes dos líneas:

myText.layer.borderColor = UIColor.lightGray.cgColor

myText.layer.borderWidth = 1.0

-3

Resolví este problema en el guión gráfico poniendo un deshabilitado completamente UIButtondetrás UITextViewy haciendo el color de fondo de UITextViewclearColor. Esto funciona sin requerir código o paquetes adicionales.


3
Por supuesto, esto no funciona en iOS 7, ya que los botones no tienen bordes (los botones parecen etiquetas ahora)
Mike Gledhill
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.