¿Cómo mantener una image networkingondaVer alnetworkingedor con el layout automático?

¿Cómo puedo convertir una vista de image rectangular en una vista de image circular que puede mantener la forma en el layout automático sin configurar las restricciones de ancho y alto? De este modo, permite que imageView defina su tamaño y tamaño más grande y más pequeño en relación con los objects que lo rodean, con restricciones principales, posteriores, superiores e inferiores.

Hice una pregunta similar el otro día, pero creo que esto podría plantearse de una manera más concisa. ¡Muchas gracias!

EDITAR

Ok, comencé a hacer esto lo más simple posible. Tengo una vista llamada "Celda" y una UIImageView llamada "perro" dentro de la celda, y eso es todo. Ya no tengo "incapaz de satisfacer las restricciones simultáneamente" en la console, solo dos vistas simples con layout automático. Todavía estoy tratando de usar este código para networkingondear el UIImageView:

profileImageView.layer.cornerRadius = profileImageView.frame.size.width / 2 profileImageView.clipsToBounds = true 

Aquí está la configuration de restricción de celdas:

screenshot 1

Aquí está la configuration de restricción de image del perfil:

screenshot 2

Aquí está el resultado sin el código, sin networkingondear, pero bonito y cuadrado:

screenshot 3

Aquí está el resultado con el código para networkingondear:

screenshot 4

Esto no tiene sentido para mí, porque sin el código de networkingondeo la image es cuadrada, y con el código tiene forma de diamante. Si es cuadrada, ¿no debería ser un círculo sin problemas?

EDIT 2

Esto es lo que sucede cuando elimino la restricción inferior y agrego un multiplicador de .637 para la altura igual a Superview.

captura de pantalla 5

Desafortunadamente, no puedes hacerlo con cornerRadius y autolayout: el CGLayer no se ve afectado por la reproducción automática, por lo que cualquier cambio en el tamaño de la vista no cambiará el radio que se ha establecido una vez que, como ya has notado, el círculo pierda su forma .

Puede crear una subclass personalizada de UIImageView y anular layoutSubviews para configurar el cornerRadius cada vez que cornerRadius los límites de la image.

EDITAR

Un ejemplo podría parecerse a esto:

 class Foo: UIImageView { override func layoutSubviews() { super.layoutSubviews() let radius: CGFloat = self.bounds.size.width / 2.0 self.layer.cornerRadius = radius } } 

Y, obviamente, tendría que restringir el ancho de la instancia de Foobar para que sea igual a la altura (para mantener un círculo). También es probable que desee configurar el contentMode la instancia de Foobar en UIViewContentMode.ScaleAspectFill para que sepa cómo dibujar la image (es decir, es probable que la image se recorte).

Configurar el radio en viewWillLayoutSubviews resolverá el problema

 override func viewWillLayoutSubviews() { super.viewWillLayoutSubviews() profileImageView.layer.cornerRadius = profileImageView.frame.height / 2.0 } 

Crea una nueva interfaz en tu file .h como

  @interface cornerClip : UIImageView @end 

y la implementación en el file .m como

 @implementation cornerClip -(void)layoutSubviews { [super layoutSubviews]; { CGFloat radius = self.bounds.size.width / 2.0; self.layer.cornerRadius = radius; } } @end 

ahora solo regale la class como "cornerClip" a su vista de image. 100% trabajando … disfruta

Parece que cuando agrega una vista como una subview de otra que la vista con networking no necesariamente tendrá la misma altura que su vista de supervisión. Eso es lo que parece ser el problema. La solución es no agregar su imageView como una subvista, sino tenerla encima de su backgroundView. En la siguiente image estoy usando una UILabel como mi backgroundView.

captura de pantalla

También en su caso, cuando está configurando la esquinaRadius use esto: let radius: CGFloat = self.bounds.size.height / 2.0 .

Con mi solución hacky obtendrás animation de radio de esquina suave junto con el cambio de tamaño de fotogtwig.

Digamos que tiene ViewSubclass: UIView. Debería contener el siguiente código:

 class ViewSubclass: UIView { var animationDuration : TimeInterval? let imageView = UIImageView() //some imageView setup code override func layoutSubviews() { super.layoutSubviews() if let duration = animationDuration { let anim = CABasicAnimation(keyPath: "cornerRadius") anim.fromValue = self.imageView.cornerRadius let radius = self.imageView.frame.size.width / 2 anim.toValue = radius anim.duration = duration self.imageView.layer.cornerRadius = radius self.imageView.layer.add(anim, forKey: "cornerRadius") } else { imageView.cornerRadius = imageView.frame.size.width / 2 } animationDuration = nil } } 

Entonces deberás hacer esto:

 let duration = 0.4 //For example instanceOfViewSubclass.animationDuration = duration UIView.animate(withDuration: duration, animations: { //Your animation instanceOfViewSubclass.layoutIfNeeded() }) 

No es hermoso, y puede que no funcione para múltiples animaciones complejas, pero responde la pregunta.

Tengo el mismo problema y ahora obtengo lo que sucedió aquí, espero que algunas ideas te puedan ayudar: hay algo diferente entre los remolques:

  1. tu perfilImageView en el guión gráfico
  2. tu perfilImageView en viewDidLoad

el tamaño del encuadernado y el marco es diferente cuando viewDidLoad y en el guión gráfico, simplemente porque la vista es networkingimensionada para diferentes tamaños de dispositivo. Puede intentarlo print(profileImageView.bounds.size) en viewDidLoad y viewDidAppear encontrará el tamaño en viewDidLoad que estableció cornerRadius no es el verdadero tamaño "en ejecución".

un consejo para usted: puede usar una subclass de ImageView para evitarlo, o no lo use en storyboard,

Agregue una restricción de relación de aspecto 1: 1 a imageView para que siga siendo circular, a pesar de los cambios de altura o ancho.

Se puede hacer fácilmente creando un IBOutlet para la restricción que debe modificarse en time de ejecución. A continuación se muestra el código:

  1. Cree un IBOutlet para la restricción que debe cambiarse en time de ejecución.

     @IBOutlet var widthConstraint: NSLayoutConstraint! 
  2. Agregue el código siguiente en viewDidLoad() :

     self.widthConstraint.constant = imageWidthConstraintConstant() 

A continuación, la function determina que los types de dispositivo cambien la restricción de ancho en consecuencia.

 func imageWidthConstraintConstant() -> CGFloat { switch(self.screenWidth()) { case 375: return 100 case 414: return 120 case 320: return 77 default: return 77 } }