iOS
UIImageView

Crear un UIImageView

Para crear un UIImageView programáticamente, todo lo que necesita hacer es crear una instancia de UIImageView :

//Swift
let imageView = UIImageView()

//Objective-C
UIImageView *imageView = [[UIImageView alloc] init];

Puede establecer el tamaño y la posición de UIImageView con un CGRect :

//Swift
imageView.frame = CGRect(x: 0, y: 0, width: 200, height: 200)

//Objective-C
imageView.frame = CGRectMake(0,0,200,200);

O puede establecer el tamaño durante la inicialización:

//Swift
UIImageView(frame: CGRect(x: 0, y: 0, width: 200, height: 200))

//Objective-C
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0,0,200,200);

//Alternative way of defining frame for UIImageView
UIImageView *imageView = [[UIImageView alloc] init];
CGRect imageViewFrame = imageView.frame;
imageViewFrame.size.width = 200;
imageViewFrame.size.height = 200;
imageViewFrame.origin.x = 0;
imageViewFrame.origin.y = 0;
imageView.frame = imageViewFrame;

Nota: debe importar UIKit para utilizar un UIImageView .

Asignando una imagen a un UIImageView

Puede asignar una imagen a un UIImageView durante la inicialización, o más tarde, usando la propiedad de image :

//Swift
UIImageView(image: UIImage(named: "image1"))

UIImageView(image: UIImage(named: "image1"), highlightedImage: UIImage(named: "image2"))

imageView.image = UIImage(named: "image1") 

//Objective-C
[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image1"];

[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image1"] highlightedImage:[UIImage imageNamed:@"image2"]];

imageView.image = [UIImage imageNamed:@"image1"];

Animando un UIImageView

Puede animar un UIImageView mostrando rápidamente imágenes en él en una secuencia usando las propiedades de animación de UIImageView :

imageView.animationImages = [UIImage(named: "image1")!,
                             UIImage(named: "image2")!,
                             UIImage(named: "image3")!,
                             UIImage(named: "image4")!,
                             UIImage(named: "image5")!,
                             UIImage(named: "image6")!,
                             UIImage(named: "image7")!,
                             UIImage(named: "image8")!] 
imageView.animationDuration = 0.3
imageView.animationRepeatCount = 1

La propiedad animationImages es una Array de UIImages que se ejecuta de arriba a abajo cuando se activa la animación.

La propiedad animationDuration es un Double dice cuántos segundos durará la animación.

La propiedad animationRepeatCount es un Int que dice cuántas veces se ejecutará la animación.

Para iniciar y detener la animación, puede llamar a los métodos apropiados para hacerlo:

imageView.startAnimating()
imageView.stopAnimating()

Hay un método isAnimating() que devuelve un valor Boolean que indica si la animación se está ejecutando en un momento o no.

Tenga en cuenta que esta no es una forma muy eficiente de crear animaciones: es bastante lenta y consume muchos recursos. Considera usar Capas o Sprites para obtener mejores resultados

Haciendo una imagen en un círculo o redondeado.

Este ejemplo muestra, cómo hacer un UIView o UIImageView , redondeado con un radio como este:

C objetivo

someImageView.layer.cornerRadius = CGRectGetHeight(someImageView.frame) / 2;
someImageView.clipsToBounds = YES;

Rápido

someImageView.layer.cornerRadius = someImageView.frame.height/2
// this should alleviate the performance hit that adding transparency may cause - see http://stackoverflow.com/a/6254531/189804
// Be sure to check scrolling performance with Instruments if you take this approach.
someImageView.layer.shouldRasterize = true
someImageView.clipsToBounds = true // All parts of the image that are outside its bounds (the frame) are cut out (makes the rounded corners visible)

Se sugiere que si se utiliza el diseño automático que se pone el someImageView.layer.cornerRadius código en viewDidLayoutSubviews . Esto permitirá que el cornerRadius de la imagen se actualice si la imagen cambia de tamaño.

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    someImageView.layer.cornerRadius = someImageView.frame.size.width/2
    someImageView.layer.masksToBounds = true
}

UIImage enmascarado con etiqueta

Esto hace que la imagen enmascarada a la forma de las letras de la etiqueta:

C objetivo

self.maskImage.layer.mask = self.maskLabel.layer;
self.maskImage.layer.masksToBounds = YES;

Swift 3

maskImageView.mask = maskLabel
maskImageView.masksToBounds = true

Aquí está el resultado:

Cambiar color de una imagen.

//Swift
imageView.tintColor = UIColor.redColor()
imageView.image = imageView.image?.imageWithRenderingMode(.AlwaysTemplate)

//Swift 3
imageView.tintColor = UIColor.red
imageView.image = imageView.image?.withRenderingMode(.alwaysTemplate)

//Objective-C
imageView.tintColor = [UIColor redColor];
imageView.image = [imageView.image imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate]

Cómo afecta la propiedad Modo a una imagen

La propiedad de modo de contenido de una vista dice cómo se debe distribuir su contenido. En el Interface Builder, los distintos modos se pueden seleccionar en el inspector de atributos.

Usemos dos vistas de imagen para ver cómo funcionan los distintos modos.

Escala para llenar

Las alturas y los anchos de la imagen se estiran para coincidir con el tamaño de UIImageView .

Ajuste de aspecto

El lado más largo (alto o ancho) de la imagen se estira para que coincida con la vista. Esto hace que la imagen sea lo más grande posible mientras se muestra la imagen completa y no distorsiona la altura o el ancho. (Puse el fondo de UIImageView en azul para que su tamaño sea claro.)

Relleno de aspecto

El lado más corto (alto o ancho) de la imagen se estira para que coincida con la vista. Al igual que "Ajuste de aspecto", las proporciones de la imagen no se distorsionan de su relación de aspecto original.

Redibujar

Redibujar es solo para vistas personalizadas que necesitan hacer su propia escala y cambio de tamaño. No estamos usando una vista personalizada, por lo que no deberíamos usar Redraw. Tenga en cuenta que aquí UIImageView solo nos da el mismo resultado que Scale to Fill, pero está haciendo más trabajo detrás de escena.

Sobre Redraw, la documentación de Apple dice:

Los modos de contenido son buenos para reciclar el contenido de su vista, pero también puede establecer el modo de contenido en el valor UIViewContentModeRedraw cuando desee específicamente que sus vistas personalizadas se UIViewContentModeRedraw a dibujar durante la escala y las operaciones de cambio de tamaño. Establecer el modo de contenido de su vista en este valor obliga al sistema a llamar al método drawRect: su vista en respuesta a los cambios de geometría. En general, debe evitar usar este valor siempre que sea posible, y ciertamente no debe usarlo con las vistas estándar del sistema.

Centrar

La imagen se centra en la vista, pero la longitud y el ancho de la imagen no se estiran.

Parte superior

El borde superior de la imagen está centrado horizontalmente en la parte superior de la vista, y la longitud y el ancho de la imagen no se estiran.

Fondo

El borde inferior de la imagen se centra horizontalmente en la parte inferior de la vista, y la longitud y el ancho de la imagen no se estiran.

Izquierda

El borde izquierdo de la imagen se centra verticalmente a la izquierda de la vista, y la longitud y el ancho de la imagen no se estiran.

Derecha

El borde derecho de la imagen se centra verticalmente a la derecha de la vista, y la longitud y el ancho de la imagen no se estiran.

Arriba a la izquierda

La esquina superior izquierda de la imagen se coloca en la esquina superior izquierda de la vista. La longitud y el ancho de la imagen no se estiran.

Parte superior derecha

La esquina superior derecha de la imagen se coloca en la esquina superior derecha de la vista. La longitud y el ancho de la imagen no se estiran.

Abajo a la izquierda

La esquina inferior izquierda de la imagen se coloca en la esquina inferior izquierda de la vista. La longitud y el ancho de la imagen no se estiran.

Abajo a la derecha

La esquina inferior derecha de la imagen se coloca en la esquina inferior derecha de la vista. La longitud y el ancho de la imagen no se estiran.

Notas

• Este ejemplo viene originalmente de aquí .

• Si el contenido (en nuestro caso, la imagen) tiene el mismo tamaño que la vista (en nuestro caso, el UIImageView ), cambiar el modo de contenido no hará una diferencia notable.

• Vea esto y esta pregunta para una discusión sobre los modos de contenido para vistas que no sean UIImageView .

• En Swift, para configurar el modo de contenido mediante programación, haga lo siguiente:

    imageView.contentMode = UIViewContentMode.scaleToFill
    imageView.contentMode = UIViewContentMode.scaleAspectFit
    imageView.contentMode = UIViewContentMode.scaleAspectFill
    imageView.contentMode = UIViewContentMode.redraw
    imageView.contentMode = UIViewContentMode.center
    imageView.contentMode = UIViewContentMode.top
    imageView.contentMode = UIViewContentMode.bottom
    imageView.contentMode = UIViewContentMode.left
    imageView.contentMode = UIViewContentMode.right
    imageView.contentMode = UIViewContentMode.topLeft
    imageView.contentMode = UIViewContentMode.topRight
    imageView.contentMode = UIViewContentMode.bottomLeft
    imageView.contentMode = UIViewContentMode.bottomRight