Por casualidad, si alguien llega a escuchar por una búsqueda en Google (como lo hice yo) y está buscando agregar un borde a UIImageView, busque la respuesta por @mclin en la parte inferior. ¡Funciona genial!
Mahendra Liya
Respuestas:
241
Con OS> 3.0 puedes hacer esto:
//you need this import#import <QuartzCore/QuartzCore.h>[imageView.layer setBorderColor:[[UIColor blackColor]CGColor]];[imageView.layer setBorderWidth:2.0];
Cuando aspecto las imágenes en la vista de imagen anterior, la imagen se ve perfectamente pero los lados de la imagen se dejan en blanco, y lo mismo ocurre con la parte superior e inferior de la imagen cuando la imagen es horizontal. El espacio en blanco se ve feo con el borde establecido. ¿Te enfrentaste a este problema? En caso afirmativo, sugiera un método para resolver esto
conozca el
@Hamutsi imageView.image = myImage;
Kyle Clegg
66
Sí tu puedes. Las instancias de UIImagese pueden dibujar en un contexto gráfico con CoreGraphics.
Mark Adams
Como señala @rockstar, es posible que deba agregar imageView.layer.masksToBounds = YES;
Este código producirá un borde rosado alrededor de la imagen. Sin embargo, si solo va a mostrar el borde, use la capa UIImageViewy establezca su borde.
@ MarcusS.Zarra Me doy cuenta de que no existían cuando se respondió esta pregunta, pero esta solución no tiene en cuenta la pantalla Retina. Si pudieras revisarlo, estaría muy agradecido :)
Luke
@lukech La muestra no necesita ser revisada. Simplemente aumente el ancho de línea si está en un dispositivo de retina.
Marcus S. Zarra
2
El sizees 320x480 independientemente de si está o no en un dispositivo Retina, por lo que cuando guarda la imagen, se guarda con esa resolución de 320x480px, no 640x960.
Hack brillante, especialmente cuando se trata del uso de memoria: las otras respuestas tomarán 2 veces más memoria solo para agregar ese borde momentáneamente. Consejo profesional: si solo desea agregar un borde en un lado, también puede cambiar los límites. ¡Gran respuesta!
judepereira
11
Si conoce las dimensiones de su imagen, entonces agregar un borde a la capa de UIImageView es la mejor solución AFAIK. De hecho, simplemente puede configurar enmarcar su imageView a x, y, image.size.width, image.size.height
En caso de que tenga un ImageView de un tamaño fijo con imágenes cargadas dinámicamente que se están redimensionando (o escalando a AspectFit), entonces su objetivo es cambiar el tamaño de la vista de imagen a la nueva imagen redimensionada.
La forma más corta de hacer esto:
// containerView is my UIImageView
containerView.layer.borderWidth =7;
containerView.layer.borderColor =[UIColor colorWithRed:0.22 green:0.22 blue:0.22 alpha:1.0].CGColor;// this is the key command[containerView setFrame:AVMakeRectWithAspectRatioInsideRect(image.size, containerView.frame)];
Pero para usar AVMakeRectWithAspectRatioInsideRect, debe agregar esto
#import <AVFoundation/AVFoundation.h>
importe la declaración a su archivo y también incluya el marco AVFoundation en su proyecto (viene incluido con el SDK).
No puede agregar un borde, pero esto funcionaría para el mismo efecto. También podría convertir el UIView llamado blackBG en este ejemplo en un UIImageView con una imagen de borde y un centro en blanco, y luego tendría un borde de imagen personalizado en lugar de solo negro.
Esto es lo que terminé haciendo; anidando mi UIImageViewen el centro de un UIViewcolor un poco más grande de mi marco.
Ben Kreeger el
6
todas estas respuestas funcionan bien PERO agregan un rect a una imagen. Supongamos que tiene una forma (en mi caso, una mariposa) y desea agregar un borde (un borde rojo):
necesitamos dos pasos: 1) tomar la imagen, convertirla a CGImage, pasar a una función para dibujar fuera de la pantalla en un contexto usando CoreGraphics y devolver una nueva CGImage
-(void)viewDidLoad
{[super viewDidLoad];// Do any additional setup after loading the view, typically from a nib.CGRect frame =CGRectMake(0,0,160,122);UIImage* img =[UIImage imageNamed:@"butterfly"];// take low res OR high res, but frame should be the low-res one.
imgV =[[UIImageView alloc]initWithFrame:frame];[imgV setImage: img];
imgV.center = self.view.center;[self.view addSubview: imgV];
frame.size.width = frame.size.width *1.3;
frame.size.height = frame.size.height*1.3;CGImageRef cgImage =[ViewController createResizedCGImage:[img CGImage] toWidth:frame.size.width andHeight: frame.size.height ];
imgV2 =[[UIImageView alloc]initWithFrame:frame];[imgV2 setImage:[UIImage imageWithCGImage:cgImage]];// release:if(cgImage)CGImageRelease(cgImage);[self.view addSubview: imgV2];
}
Agregué una mariposa normal y una mariposa más grande con borde rojo.
Puede manipular la imagen en sí, pero una forma mucho mejor es simplemente agregar una vista UIView que contenga el UIImageView y cambiar el fondo a negro. Luego configure el tamaño de esa vista de contenedor a un poco más grande que UIImageView.
¿Funcionará con un tamaño diferente de imágenes que cambian sobre la marcha? ¿El UIImageView cambiará todo el tiempo y el UIView? ps Manipular la imagen en sí será genial.
Shay
Tendría que ajustar el marco de la vista que lo contiene junto con la imagen; podría guardar las propiedades del centro para ambas vistas, ajustar el tamaño de la imagen, ajustar el tamaño del contenedor y luego restablecer las propiedades del centro para ambas.
Kendall Helmstetter Gelner
Esta es exactamente la forma en que lo hice en lugar de trazar el camino con CG. Simplemente parecía más fácil.
Corey Floyd el
2
Otra forma es hacerlo directamente desde el diseñador.
Seleccione su imagen y vaya a "Mostrar el inspector de identidad".
Aquí puede agregar manualmente " Atributos de tiempo de ejecución definidos por el usuario" :
He creado una clase que agrega un borde a imageView h. Utilice esta clase en lugar de UIImageView. Le he dado un relleno de 4. Puede dar según su deseo.
Respuestas:
Con OS> 3.0 puedes hacer esto:
fuente
UIImage
se pueden dibujar en un contexto gráfico con CoreGraphics.Puede hacer esto creando una nueva imagen (también respondida en su otra publicación de esta pregunta):
Este código producirá un borde rosado alrededor de la imagen. Sin embargo, si solo va a mostrar el borde, use la capa
UIImageView
y establezca su borde.fuente
CGContextSetLineWidth
size
es 320x480 independientemente de si está o no en un dispositivo Retina, por lo que cuando guarda la imagen, se guarda con esa resolución de 320x480px, no 640x960.Este código se puede usar para agregar un
UIImageView
borde de vista.fuente
fuente
Si conoce las dimensiones de su imagen, entonces agregar un borde a la capa de UIImageView es la mejor solución AFAIK. De hecho, simplemente puede configurar enmarcar su imageView a x, y, image.size.width, image.size.height
En caso de que tenga un ImageView de un tamaño fijo con imágenes cargadas dinámicamente que se están redimensionando (o escalando a AspectFit), entonces su objetivo es cambiar el tamaño de la vista de imagen a la nueva imagen redimensionada.
La forma más corta de hacer esto:
Pero para usar AVMakeRectWithAspectRatioInsideRect, debe agregar esto
importe la declaración a su archivo y también incluya el marco AVFoundation en su proyecto (viene incluido con el SDK).
fuente
No puede agregar un borde, pero esto funcionaría para el mismo efecto. También podría convertir el UIView llamado blackBG en este ejemplo en un UIImageView con una imagen de borde y un centro en blanco, y luego tendría un borde de imagen personalizado en lugar de solo negro.
fuente
UIImageView
en el centro de unUIView
color un poco más grande de mi marco.todas estas respuestas funcionan bien PERO agregan un rect a una imagen. Supongamos que tiene una forma (en mi caso, una mariposa) y desea agregar un borde (un borde rojo):
necesitamos dos pasos: 1) tomar la imagen, convertirla a CGImage, pasar a una función para dibujar fuera de la pantalla en un contexto usando CoreGraphics y devolver una nueva CGImage
2) convertir a uiimage de nuevo y dibujar:
}
}
Agregué una mariposa normal y una mariposa más grande con borde rojo.
fuente
Puede agregar borde al UIImageView y luego cambiar el tamaño del UIimageView de acuerdo con el tamaño de la imagen:
Asegúrese de establecer el origen de imageView en el centro
fuente
Puede manipular la imagen en sí, pero una forma mucho mejor es simplemente agregar una vista UIView que contenga el UIImageView y cambiar el fondo a negro. Luego configure el tamaño de esa vista de contenedor a un poco más grande que UIImageView.
fuente
Otra forma es hacerlo directamente desde el diseñador.
Seleccione su imagen y vaya a "Mostrar el inspector de identidad".
Aquí puede agregar manualmente " Atributos de tiempo de ejecución definidos por el usuario" :
fuente
// necesitas importar
y luego para ImageView en el borde
fuente
Esta función te devolverá la imagen con borde negro. Prueba esto. Espero que esto te ayude.
fuente
En Swift 3, así es como lo haces al UIImage en sí:
fuente
Para aquellos que buscan una solución plug-and-play en UIImage, escribí la respuesta de CodyMace como una extensión.
Uso:
let outlined = UIImage(named: "something")?.outline()
fuente
He creado una clase que agrega un borde a imageView h. Utilice esta clase en lugar de UIImageView. Le he dado un relleno de 4. Puede dar según su deseo.
fuente
Yo uso este método para agregar un borde fuera de la imagen . Puede personalizar el ancho del borde en
boderWidth
constante.Swift 3
fuente