Centrar una columna de text de ancho variable en una UIScrollView utilizando Auto Layout

Tengo un layout aparentemente simple que no puedo express usando restricciones de layout automático: en un UIScrollView, necesito mostrar una columna de text cinput que tenga un ancho mínimo de 300 puntos y un ancho máximo de 500 puntos (manteniendo un margen de al less 10 puntos en todos los casos).

La columna de text es en realidad un UIStackView, pero eso realmente no importa para esta discusión, la vista podría ser fácilmente una UIImageView con ajuste de aspecto.

He intentado utilizar vistas de relleno con diferentes aarms de contenido y resistencia de compression, una vista de stack con un eje horizontal, restricciones de ancho con constantes menores o iguales, etc. Quiero hacerlo todo dentro del guión gráfico, husmeando durante cambios de layout o el uso de classs de tamaño se siente como hacer trampa.

(Algunos de mis experimentos han causado que Xcode cuelgue al actualizar el guión gráfico: me da una pista dolorosa de que no hay solución para este tipo de restricciones).

Y antes de sugerirlo, he leído sobre las sutilezas de UIScrollView y Auto Layout .

Esto parece ser un problema insoluble, lo cual es una lástima. Es un patrón muy común y algo que a los diseñadores les encanta usar con CSS (usando min-width y max-width). Espero que me esté perdiendo algo aquí y que alguien con un conocimiento más profundo de layout automático pueda explicar una manera de hacerlo (y actuar como reference para otros a quienes les gustaría hacer lo mismo).

Actualización: las sugerencias de Adam y Ben a continuación son muy útiles para lograr este layout. Pero tan pronto como obtenga múltiples bloques de text, el solucionador iterativo de layout automático no puede manejarlo (y Xcode se cuelga). Para get más información: http://openradar.appspot.com/25173433

¡Este es realmente bastante sencillo! He incluido un file storyboard como una demostración. Los bits de key para el text dentro de la vista de contenido:

  • Márgenes principales / finales> = 10
  • Ancho> = 300
  • Ancho <= 500
  • Alineación del centro

No se requieren cambios de prioridad, a less que tenga otro contenido que tenga prioridad.

introduzca la descripción de la imagen aquí

Pruebe una restricción anterior y posterior de 10 pero establezca su prioridad en 750. Luego, centro horizontalmente y un ancho> = 300 y ancho <= 500 y deje los valores a 1000 prioridad.

Si estoy siguiendo el problema correctamente, creo que tengo una configuration bastante simple que funciona para esto.

Empiezo con la vista de desplazamiento, luego agrego una UIView básica para que actúe como un contenedor. Pincho la UIView en los bordes superior, inferior, inicial y posterior de la vista de desplazamiento para que el tamaño de contenido de la scrollview se maneje correctamente. Agrego una restricción a esa vista de contenedor para que coincida con el ancho con scrollview.

A continuación, agrego el UIStackView a la vista del contenedor y le asigno estas restricciones:

  • Alinear el centro X para Superview
  • Espacio posterior a Superview> = 10
  • Espacio principal para supervisar> = 10
  • Ancho = 500 con prioridad 750
  • Ancho> = 300
  • Espacio inferior a Superview = 10
  • Top Space to Superview = 10

Todo con las prioridades pnetworkingeterminadas, excepto ancho = 500. Luego coloco algunas tags en la vista de stack, y el resultado que obtengo es una columna que tendrá al less un margen de 10 puntos en cualquier lado, pero nunca será más ancho que 500 puntos, y bajará a 300 puntos de ancho dependiendo del contenido de la vista de stack.

Creo que tengo una solución, si entiendo el problema correctamente. Probé esto con una UILabel dentro de UIScrollView, pero debería funcionar para cualquier vista con un tamaño intrínseco. Para cualquier vista interna que esté usando, pruebe estas restricciones:

  • Ancho <= 500
  • Ancho> = 300
  • Alinear el centro X a Superview
  • Espacio superior a Superview = 10
  • Espacio inferior a Superview = 10
  • Espacio principal a Superview = 10 (prioridad 750)
  • Espacio posterior a Superview = 10 (prioridad 750)
  • Prioridad de resistencia de compression de contenido horizontal: 250

Establecer una prioridad baja para la resistencia de compression de contenido horizontal es la key. Mi UILabel tiene un montón de text, por lo que su tamaño de contenido intrínseco es algo así como 2200px. Con la resistencia de compression horizontal pnetworkingeterminada, siempre se expandirá al ancho máximo de 500 px y la vista de desplazamiento se desplazará tanto horizontal como verticalmente en pantallas más pequeñas. Solo quiero un desplazamiento vertical, así que establezco una prioridad de resistencia de compression horizontal más baja en la UILabel, que le dice a la disposition automática que la apriete para que quepa.