Estoy tratando de resolver esto desde la semana pasada sin ir más allá. Ok, entonces necesito aplicar algunas restricciones programáticamente en Swift para UIView
usar este código:
var new_view:UIView! = UIView(frame: CGRectMake(0, 0, 100, 100));
new_view.backgroundColor = UIColor.redColor();
view.addSubview(new_view);
var constX:NSLayoutConstraint = NSLayoutConstraint(item: new_view, attribute: NSLayoutAttribute.CenterX, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.CenterX, multiplier: 1, constant: 0);
self.view.addConstraint(constX);
var constY:NSLayoutConstraint = NSLayoutConstraint(item: new_view, attribute: NSLayoutAttribute.CenterY, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.CenterY, multiplier: 1, constant: 0);
self.view.addConstraint(constY);
var constW:NSLayoutConstraint = NSLayoutConstraint(item: new_view, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: new_view, attribute: NSLayoutAttribute.Width, multiplier: 1, constant: 0);
self.view.addConstraint(constW);
var constH:NSLayoutConstraint = NSLayoutConstraint(item: new_view, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: new_view, attribute: NSLayoutAttribute.Height, multiplier: 1, constant: 0);
self.view.addConstraint(constH);
Pero Xcode devuelve esta salida extraña:
2014-10-03 09:48:12.657 Test[35088:2454916] Unable to simultaneously satisfy constraints. Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)
(
"<NSLayoutConstraint:0x7fa4ea446830 UIView:0x7fa4ea429290.centerX == UIView:0x7fa4ea4470f0.centerX>",
"<NSAutoresizingMaskLayoutConstraint:0x7fa4ea4516c0 h=--& v=--& UIView:0x7fa4ea429290.midX == + 50>",
"<NSLayoutConstraint:0x7fa4ea452830 'UIView-Encapsulated-Layout-Width' H:[UIView:0x7fa4ea4470f0(375)]>",
"<NSAutoresizingMaskLayoutConstraint:0x7fa4ea446db0 h=-&- v=-&- 'UIView-Encapsulated-Layout-Left' H:|-(0)-[UIView:0x7fa4ea4470f0] (Names: '|':UIWindow:0x7fa4ea444b20 )>"
)
Will attempt to recover by breaking constraint <NSLayoutConstraint:0x7fa4ea446830 UIView:0x7fa4ea429290.centerX == UIView:0x7fa4ea4470f0.centerX>
Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger. The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in
<UIKit/UIView.h> may also be helpful.
2014-10-03 09:48:12.658 Test[35088:2454916] Unable to simultaneously satisfy constraints. Probably at least one of the constraints in the following list is one you don't want. Try this: (1) look at each constraint and try to figure out which you don't expect; (2) find the code that added the unwanted constraint or constraints and fix it. (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)
(
"<NSLayoutConstraint:0x7fa4ea44d160 UIView:0x7fa4ea429290.centerY == UIView:0x7fa4ea4470f0.centerY>",
"<NSAutoresizingMaskLayoutConstraint:0x7fa4ea451b30 h=--& v=--& UIView:0x7fa4ea429290.midY == + 50>",
"<NSLayoutConstraint:0x7fa4ea44cf00 'UIView-Encapsulated-Layout-Height' V:[UIView:0x7fa4ea4470f0(667)]>",
"<NSAutoresizingMaskLayoutConstraint:0x7fa4ea452700 h=-&- v=-&- 'UIView-Encapsulated-Layout-Top' V:|-(0)-[UIView:0x7fa4ea4470f0] (Names: '|':UIWindow:0x7fa4ea444b20 )>"
)
Will attempt to recover by breaking constraint <NSLayoutConstraint:0x7fa4ea44d160 UIView:0x7fa4ea429290.centerY == UIView:0x7fa4ea4470f0.centerY>
Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger. The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKit/UIView.h> may also be helpful.
¿Me puedes ayudar? Muchas gracias
ios
swift
uiview
autolayout
nslayoutconstraint
Sara Canducci
fuente
fuente
>
. Te lo he arreglado esta vez.Respuestas:
¿Planea tener un cuadrado
UIView
de ancho: 100 y Altura: 100 centrado dentroUIView
de unUIViewController
? Si es así, puede probar uno de los 6 siguientes estilos de diseño automático (Swift 5 / iOS 12.2):1. Usando
NSLayoutConstraint
inicializador2. Uso del lenguaje de formato visual
3. Usando una combinación de
NSLayoutConstraint
inicializador y lenguaje de formato visual4. Usando
UIView.AutoresizingMask
Nota: Springs y Struts se traducirán en las restricciones de diseño automático correspondientes en tiempo de ejecución.
5. Usando
NSLayoutAnchor
6. Usando
intrinsicContentSize
yNSLayoutAnchor
Resultado:
fuente
newView.centerXAnchor.constraintEqualToAnchor(view.centerXAnchor).active = true
newView.translatesAutoresizingMaskIntoConstraints = false
parte! Eso me llevó un tiempo ver.Me ayuda a aprender visualmente, así que esta es una respuesta complementaria.
Código repetitivo
Cada uno de los siguientes ejemplos son independientes de los demás.
Pin borde izquierdo
myView.leading = leadingMargin + 20
Método 1: estilo de anclaje
leadingAnchor
, también haytrailingAnchor
,topAnchor
ybottomAnchor
.Método 2: NSLayoutConstraint Style
.leading
también hay.trailing
,.top
y.bottom
..leadingMargin
también hay.trailingMargin
,.topMargin
y.bottomMargin
.Establecer ancho y alto
width = 200
height = 100
Método 1: estilo de anclaje
Método 2: NSLayoutConstraint Style
Centro en contenedor
myView.centerX = centerX
myView.centerY = centerY
Método 1: estilo de anclaje
Método 2: NSLayoutConstraint Style
Notas
NSLayoutConstraint
estilo, sin embargo, solo está disponible desde iOS 9, por lo que si es compatible con iOS 8, aún debe usar elNSLayoutConstraint
estilo.myView
en mi proyecto de prueba, necesitaba cuatro restricciones.Otras lecturas
fuente
leading
vs.centerX
addConstraint()
enview
el fin de hacer que los layoutconstraints registran.Si desea llenar su super vista, le sugiero la forma rápida:
De lo contrario, si necesita restricciones no iguales, consulte NSLayoutAnchor a partir de iOS 9. A menudo es mucho más fácil de leer que usar NSLayoutConstraint directamente:
fuente
isActive = true
no siempre es una buena idea. Es mejor y más eficaz agrupar las restricciones relacionadas en una y activarlas todas a la vez usandoNSLayoutConstraint.activate
.Restricciones para múltiples vistas en el patio de recreo.
Swift 3+
fuente
El problema, como sugiere el mensaje de error, es que tiene restricciones de tipo
NSAutoresizingMaskLayoutConstraints
que entran en conflicto con sus restricciones explícitas, porquenew_view.translatesAutoresizingMaskIntoConstraints
está establecido en verdadero.Esta es la configuración predeterminada para las vistas que crea en el código. Puedes apagarlo así:
Además, sus restricciones de ancho y altura son raras. Si desea que la vista tenga un ancho constante, esta es la forma correcta:
(Reemplace 100 por el ancho que desea que tenga).
Si su objetivo de implementación es iOS 9.0 o posterior, puede usar este código más corto:
De todos modos, para un diseño como este (tamaño fijo y centrado en la vista principal), sería más sencillo usar la máscara de tamaño automático y dejar que el sistema traduzca la máscara en restricciones:
Tenga en cuenta que el uso de autoresizing es perfectamente legítimo incluso cuando también está utilizando autolayout. (UIKit todavía usa la modificación automática en muchos lugares internamente). El problema es que es difícil aplicar restricciones adicionales a una vista que utiliza la modificación automática.
fuente
Básicamente implicaba 3 pasos
Esto pone la etiqueta "hola mundo" en el centro de la pantalla.
Consulte el enlace Restricciones de Autolayout mediante programación
fuente
Actualizado para Swift 3
Tipo de restricciones
fuente
El diseño automático se realiza aplicando restricciones en las imágenes. Use NSLayoutConstraint. Es posible implementar un diseño ideal y hermoso en todos los dispositivos. Por favor, intente el siguiente código.
fuente
es un poco diferente en xcode 7.3.1. esto es lo que se me ocurre
fuente
Me gustaría agregar un concepto teórico a la respuesta de Imanou Petit, para que uno pueda entender cómo funciona el diseño automático.
Para comprender el diseño automático, considere su vista como el objeto de goma que se reduce inicialmente.
Para colocar un objeto en la pantalla necesitamos 4 cosas obligatorias:
Coordenada X del objeto (posición horizontal).
Coordenada Y del objeto (posición vertical)
Ancho del objeto
Altura del objeto.
1 coordenada X: hay varias formas de dar coordenadas x a una vista.
Tales como restricción inicial, restricción posterior, centro horizontal, etc.
Coordenada 2 Y: hay varias formas de dar coordenadas y a una vista:
Tales como restricción superior, restricción inferior, centro vertical, etc.
3 Ancho del objeto: hay dos formas de dar restricción de ancho a una vista:
a. Agregue una restricción de ancho fijo (considere esta restricción como una barra de hierro de ancho fijo y ha enganchado el objeto de goma horizontalmente para que el objeto de goma no se contraiga ni se expanda)
si. No agregue ninguna restricción de ancho, pero agregue la restricción de la coordenada x al final y al final de la vista, estas dos restricciones expandirán / encogerán el objeto de goma al tirar / empujarlo desde ambos extremos, el inicio y el final.
4 Altura del objeto: similar al ancho, también hay dos formas de dar restricción de altura a una vista:
a. Agregue una restricción de altura fija (considere estas restricciones como una barra de hierro de altura fija y ha enganchado el objeto de goma verticalmente para que el objeto de goma no se contraiga ni se expanda)
si. No agregue ninguna restricción de altura, pero agregue la restricción de la coordenada x a ambos extremos de la vista superior e inferior, estas dos restricciones expandirán / encogerán el objeto de goma tirando / empujándolo desde ambos extremos, superior e inferior.
fuente
fuente
Esta es una forma de agregar restricciones mediante programación
fuente
Está agregando todas las restricciones definidas a las
self.view
cuales está mal, ya que las restricciones de ancho y alto deben agregarse a sunewView
.Además, según tengo entendido, desea establecer un ancho y una altura constantes de 100: 100. En este caso, debe cambiar su código a:
fuente
Si considera que lo anterior es feo. Debería considerar usar un DSL para las restricciones. Como SnapKit hace que la API de restricción sea mucho más fácil de usar
fuente
Podemos hacer esto fácilmente con Swift 5.1
configuración 1
ancho de la subvista establecido con flotador
configuración 2
ancho de subvista establecido usando ancho de vista alto
fuente
Prueba esta elegante
UIView
extensión para ver las limitaciones. Puede hacer restricciones fácilmente como:Aquí hay una extensión, solo cópiela en su proyecto.
fuente