iphone - Cómo centrar una subvista de UIView

objective-c ios

Question

Tengo una UIView dentro de una UIView m y quiero que la UIView interna siempre esté centrada dentro de la externa, sin tener que cambiar el tamaño del ancho y la altura.

Establecí los puntales y muelles para que estén en la parte superior / izquierda / derecha / abajo sin configurar el cambio de tamaño. Pero todavía no se centra. ¿Alguna idea?

Answer 1

1. Si tiene habilitada la función de autodiseño:

• Sugerencia: para centrar una vista en otra vista con diseño automático, puede usar el mismo código para dos vistas que compartan al menos una vista principal.

En primer lugar, deshabilite las vistas secundarias de los niños

UIView *view1, *view2;
[childview setTranslatesAutoresizingMaskIntoConstraints:NO];

1. Si eres UIView + Autolayout o Purelayout :

   [view1 autoAlignAxis:ALAxisHorizontal toSameAxisOfView:view2];
   [view1 autoAlignAxis:ALAxisVertical toSameAxisOfView:view2];

2. Si está utilizando solo métodos de autodiseño de nivel de UIKit:

   [view1 addConstraints:({
       @[ [NSLayoutConstraint
          constraintWithItem:view1
          attribute:NSLayoutAttributeCenterX
          relatedBy:NSLayoutRelationEqual
          toItem:view2
          attribute:NSLayoutAttributeCenterX
          multiplier:1.f constant:0.f],
   
          [NSLayoutConstraint
           constraintWithItem:view1
           attribute:NSLayoutAttributeCenterY
           relatedBy:NSLayoutRelationEqual
           toItem:view2
           attribute:NSLayoutAttributeCenterY
           multiplier:1.f constant:0.f] ];
   })];

2. Sin autolayout:

Yo prefiero:

UIView *parentView, *childView;
[childView setFrame:({
    CGRect frame = childView.frame;

    frame.origin.x = (parentView.frame.size.width - frame.size.width) / 2.0;
    frame.origin.y = (parentView.frame.size.height - frame.size.height) / 2.0;

    CGRectIntegral(frame);
})];

Answer 2

Antes de comenzar, recordemos que el punto de origen es la esquina superior izquierda CGPoint de una vista. Una cosa importante para entender sobre vistas y padres.

Echemos un vistazo a este código simple, un controlador de vista que se agrega a su vista un cuadrado negro:

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        createDummyView()
        super.view.backgroundColor = UIColor.cyanColor();
    }

    func createDummyView(){
        var subView = UIView(frame: CGRect(x: 15, y: 50, width: 50 , height: 50));
        super.view.addSubview(subView);
        view.backgroundColor = UIColor.blackColor()
    }

}

Esto creará esta vista: el origen y el centro del rectángulo negro se ajusta a las mismas coordenadas que su padre

Ahora intentemos agregar subView a otro SubSubView y darle a subSubview el mismo origen que subView, pero haga que subSubView sea una vista secundaria de subView

Agregaremos este código:

var subSubView = UIView();
subSubView.frame.origin = subView.frame.origin;
subSubView.frame.size = CGSizeMake(20, 20);
subSubView.backgroundColor = UIColor.purpleColor()
subView.addSubview(subSubView)

Y este es el resultado:

Debido a esta línea:

subSubView.frame.origin = subView.frame.origin;

Esperas que el origen del rectángulo morado sea el mismo que el de los padres (el rectángulo negro) pero va por debajo, ¿y por qué? Porque cuando agrega una vista a otra vista, el marco de subView "mundo" ahora es su RETRATO DE OBJETIVO principal, si tiene una vista de que su origen en la pantalla principal está en coords (15,15) para todas sus subvistas, el esquina superior izquierda será (0,0)

Esta es la razón por la cual siempre debe referirse a un elemento primario por su rectángulo encuadernado, que es el "mundo" de sus subvistas, permítanos fijar esta línea a:

subSubView.frame.origin = subView.bounds.origin;

Y vea la magia, la subSubview ahora se encuentra exactamente en su origen principal:

Entonces, te gusta "ok, solo quería centrar mi punto de vista según mi opinión de los padres, ¿cuál es el problema?" bueno, no es gran cosa, solo necesitas "traducir" el punto central del padre que se toma de su fotograma al centro de límites de los padres al hacer esto:

subSubView.center = subView.convertPoint(subView.center, fromView: subSubView);

En realidad, le estás diciendo "lleva a los padres a ver el centro y conviértelo en el mundo de SubSubView".

Y obtendrás este resultado:

Answer 3

Con IOS9 puede usar la API de anclaje de diseño.

El código se vería así:

childview.centerXAnchor.constraintEqualToAnchor(parentView.centerXAnchor).active = true
childview.centerYAnchor.constraintEqualToAnchor(parentView.centerYAnchor).active = true

La ventaja de esto sobre CGPointMake o CGRect es que con esos métodos está configurando el centro de la vista en una constante, pero con esta técnica establece una relación entre las dos vistas que se mantendrá para siempre, sin importar cómo parentview la vista parentview .

Solo asegúrese de hacer esto antes de hacerlo:

        self.view.addSubview(parentView)
        self.view.addSubView(chidview)

y para establecer las translatesAutoresizingMaskIntoConstraints para cada vista en falso.

Esto evitará que se bloquee y AutoLayout interfiera.

Answer 4

La forma más fácil:

child.center = parent.center

Answer 5

Otra solución con Purelayout utilizando autoCenterInSuperview .

// ...
UIView *innerView = [UIView newAutoLayoutView];
innerView.backgroundColor = [UIColor greenColor];
[innerView autoSetDimensionsToSize:CGSizeMake(100, 30)];

[outerview addSubview:innerView];

[innerView autoCenterInSuperview];

Así es como se ve:

Answer 6

Puedes hacer esto y siempre funcionará:

child.center = [parent convertPoint:parent.center fromView:parent.superview];

Y para Swift:

child.center = parent.convert(parent.center, from:parent.superview)

Answer 7

Puedes usar

yourView.center = CGPointMake(CGRectGetMidX(superview.bounds), CGRectGetMidY(superview.bounds))

Y en Swift 3.0

yourView.center = CGPoint(x: superview.bounds.midX, y: superview.bounds.midY)

Answer 8

Tratar:

yourSubView.center = CGPointMake(yourView.frame.size.width  / 2, 
                                 yourView.frame.size.height / 2);

Answer 9

Usar el mismo centro en la vista y subvista es la forma más sencilla de hacerlo. Puedes hacer algo como esto,

UIView *innerView = ....;
innerView.view.center = self.view.center;
[self.view addSubView:innerView];

Answer 10

Yo usaría:

child.center = CGPointMake(parent.bounds.height / 2, parent.bounds.width / 2)

Esto es simple, corto y dulce. Si usa la respuesta de parent.center anterior y parent.center está configurado a cualquier cosa que no sea (0,0) su subvista no estará centrada.

Answer 11

Yo usaría:

self.childView.center = CGPointMake(CGRectGetMidX(self.parentView.bounds),
                                    CGRectGetMidY(self.parentView.bounds));

Me gusta usar las opciones de CGRect ...

SWIFT 3:

self.childView.center = CGPoint(x: self.parentView.bounds.midX,
                                        y: self.parentView.bounds.midY);

Answer 12

Establezca esta máscara de aumento automático en su vista interna.