Utiliser la mise en page automatique pour définir dynamique UIView pour correspondre à conteneur de vue

J'ai une UIView de l'IB qui a un autre UIView l'intérieur d'elle, que je suis en utilisant un conteneur de vue. Dans le code, j'ai créer trois différents points de vue et puis d'animer le plus approprié dans le récipient de vue en fonction de l'état de l'application. Un seul des trois différents points de vue seront valables à un moment donné. Le problème c'est que quand je lance sur différentes iPhone dans le simulateur, mon nouveau sous-vues ne sont pas mis à l'échelle pour correspondre le conteneur de vue. Je suis en utilisant la mise en page automatique. Pour des fins de test, j'ai mis en place mon sous-vues à être juste un gros bouton qui a toutes ses bords contraint à l'superview. Et le conteneur de vue a aussi ses bords contraint à superview. Ce que je veux, c'est de la sous-vue de faire correspondre le conteneur de vue. j'.e le bouton s'étend sur la totalité de la taille du conteneur de vue. Lorsqu'il est exécuté sur différents iPhones de la taille du conteneur de vue et, par conséquent, la sous-vue doivent évoluer proportionnellement par rapport à l'autre iPhone de tailles d'écran.

Ci-dessous le code que j'utilise pour init mon sous-vue et de mettre en place de contraintes par rapport au conteneur vue.

UIView *containerView = self.subView;
UIView *newSubview = [[mySubview alloc] init];
[newSubview setTranslatesAutoresizingMaskIntoConstraints:NO];
[self.containerView addSubview:newSubview];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeTop multiplier:1.0 constant:0]];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0]];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeWidth multiplier:1.0 constant:0]];

[self.containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.containerView attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0]];

J'ai juste ne peut pas sembler obtenir que cela fonctionne. Je suis assez nouveau à mise en page automatique et ne suis pas sûr de ce que je fais de mal et pour cesser de se taper la tête contre ce mur. Toute aide serait formidable. 🙂

************* PLUS D'INFOS **************

Désolé, je n'ai pas déclaré mon problème aussi clairement que je pouvais avoir. Voici donc quelques infos avec des captures d'écran. Tout d'abord, je vais vous décrire ce que j'ai fait au niveau du code.

Dans didFinishLaunchingWithOptions dans AppDelegate.m, j'ai créer MyViewController comme ça,

self.myViewController = [[MyViewController alloc] initWithNibName:@"MyViewController" bundle:nil];

Dans le viewDidLoad dans MyViewController.m, j'ai créer mySubview et de l'ajouter à ma containerView et de créer des contraintes, comme cela,

UIView *containerView = self.containerView;
UIView *mySubview = [[MySubview alloc] init];
[mySubview setTranslatesAutoresizingMaskIntoConstraints:NO];
[containerView addSubview:mySubview];

NSDictionary *views = NSDictionaryOfVariableBindings(mySubview);
[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[mySubview]|"
                                                                 options:0
                                                                 metrics:nil
                                                                   views:views]];
[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[mySubview]|"
                                                                  options:0
                                                                  metrics:nil
                                                                    views:views]];

Et enfin dans l'init dans MySubview.h-je ajouter de la plume comme une sous-vue comme ça,

- (id)init
{
    if(self = [super init])
    {
        NSArray *nibArray = [[NSBundle mainBundle]loadNibNamed:@"MySubview" owner:self options:nil];
        [self addSubview:[nibArray objectAtIndex:0]];
    }
    return self;
}

Un couple de choses à noter qu'il peut aider,

Dans MyViewController.xib, j'ai une UIView que je suis en utilisant le containerView. Il a un IBOutlet de UIView* containerView est celui qui est mentionné ci-dessus. Les seules contraintes que j'ai pour le containerView de l'IB sont, de leader, de fuite et en bas de l'espace de Superview et supérieur de l'espace de Superview = 44.

Pour MySubview.xib, la hauteur et la largeur de 300, (pas de contraintes sont utilisées pour la hauteur ou la largeur). J'ai l'impression que ces tailles ne devrait pas d'importance depuis mySubview est censé être contraint de containerView.

Dans MySubview.xib, j'ai 3 objets, topButton: hauteur = 29, middleView: hauteur = 242 et bottomButton: hauteur = 29. (voir image jointe) TopButton a conduit, de fuite et de haut en Superview contraintes et un bas middleView contrainte. MiddleView a attaque et de fuite de Superview contraintes et un haut de topButton contrainte et un bas bottomButton contraintes. Et enfin bottomButton a la principale, arrière et bas de Superview contraintes et un haut de middleView contrainte.

Ce que je veux est pour mySubview à l'échelle pour s'adapter à la containerView depuis des contraintes ont été créer et ajouter mais au lieu de cela, mySubview devient très grande et clips containerView.

Voici quelques captures d'écran:

MyViewController.xib, le rectangle bleu en dessous du titre de mon conteneur vue et a la IBOutlet containerView.

Utiliser la mise en page automatique pour définir dynamique UIView pour correspondre à conteneur de vue

MySubview.xib

Utiliser la mise en page automatique pour définir dynamique UIView pour correspondre à conteneur de vue

Et enfin, le résultat, qui sont incorrectes.

Utiliser la mise en page automatique pour définir dynamique UIView pour correspondre à conteneur de vue

Au lieu je voudrais que ce que j'ai faux juste pour obtenir la copie d'écran.

Sur l'iPhone 4,

Utiliser la mise en page automatique pour définir dynamique UIView pour correspondre à conteneur de vue

De l'iPhone 5,

Utiliser la mise en page automatique pour définir dynamique UIView pour correspondre à conteneur de vue

Comme vous pouvez le voir dans les fausses captures d'écran, mySubview échelle pour s'adapter à la containerView, de même que containerView échelles un peu pour s'ajuster à l'autre téléphone tailles d'écran.

Espère que je n'ai pas trop d'info. Toute aide serait formidable. Je sens que je suis proche, mais doit manquer une étape clé. Grrrrr.

InformationsquelleAutor Feta | 2013-04-22
  1. 58

    Un couple de pensées:

    1. En fait cela a l'air bien, en dehors du nom de la variable d'étrangeté: Votre variable locale, containerView est égal à self.subView, mais toutes les autres lignes se référer à une autre variable, à une propriété de classe, self.containerView. Avez-vous omettez une ligne où vous définissez que containerView des propriétés de la classe? Mais quand je le fixe, votre code a bien fonctionné pour moi.

    2. Assurez-vous que vous n'êtes pas essayer de regarder la frame immédiatement après la définition de contraintes, comme le changement ne sera pas encore être reflétés dans le frame paramètres. Vous pouvez faire un [containerView layoutIfNeeded]; si vous voulez forcer la nouvelle disposition tout basée sur les contraintes. Aussi, si vous souhaitez confirmer frame paramètres, il est préférable de reporter les valeurs jusqu'à ce que après viewDidAppear (c'est à dire viewDidLoad est trop tôt dans la vue processus de construction).

    3. Un mineur tweak sur votre code (et sans rapport avec votre problème), mais quand je suis les contraintes à l'intérieur d'un conteneur de vue, j'ai souvent non seulement NSLayoutAttributeTop et NSLayoutAttributeLeading, comme vous l'avez fait, mais aussi NSLayoutAttributeBottom et NSLayoutAttributeTrailing (plutôt que NSLayoutAttributeWidth et NSLayoutAttributeHeight). Il accomplit la même chose que votre code, mais lors de l'utilisation des valeurs non nulles, c'est une fraction plus intuitive.

      De toute façon, j'ai juste fait le code suivant, la permutation de la vôtre, et il fonctionne très bien:

      - (IBAction)didTouchUpInsideAddView:(id)sender
{
UIView *containerView = self.containerView;
UIView *newSubview = [[UIView alloc] initWithFrame:CGRectZero]; //initializing with CGRectZero so we can see it change
newSubview.translatesAutoresizingMaskIntoConstraints = NO;
newSubview.backgroundColor = [UIColor lightGrayColor];
[containerView addSubview:newSubview];
[containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
attribute:NSLayoutAttributeTop
relatedBy:NSLayoutRelationEqual
toItem:containerView
attribute:NSLayoutAttributeTop
multiplier:1.0
constant:0.0]];
[containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
attribute:NSLayoutAttributeLeading
relatedBy:NSLayoutRelationEqual
toItem:containerView
attribute:NSLayoutAttributeLeading
multiplier:1.0
constant:0.0]];
[containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
attribute:NSLayoutAttributeBottom
relatedBy:NSLayoutRelationEqual
toItem:containerView
attribute:NSLayoutAttributeBottom
multiplier:1.0
constant:0.0]];
[containerView addConstraint:[NSLayoutConstraint constraintWithItem:newSubview
attribute:NSLayoutAttributeTrailing
relatedBy:NSLayoutRelationEqual
toItem:containerView
attribute:NSLayoutAttributeTrailing
multiplier:1.0
constant:0.0]];
//the frame is still `CGRectZero` at this point
NSLog(@"newSubview.frame before = %@", NSStringFromCGRect(newSubview.frame));
//if not doing this in `viewDidLoad` (e.g. you're doing this in
//`viewDidAppear` or later), you can force `layoutIfNeeded` if you want
//to look at `frame` values. Generally you don't need to do this unless
//manually inspecting `frame` values or when changing constraints in a
//`animations` block of `animateWithDuration`.
[containerView layoutIfNeeded];
//everything is ok here
NSLog(@"containerView.bounds after = %@", NSStringFromCGRect(containerView.bounds));
NSLog(@"newSubview.frame after = %@", NSStringFromCGRect(newSubview.frame));
}

    4. Vous pouvez simplifier ce code un peu à l'aide de format visuel de la langue, par exemple:

      NSDictionary *views = NSDictionaryOfVariableBindings(newSubview);
[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[newSubview]|"
options:0
metrics:nil
views:views]];
[containerView addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[newSubview]|"
options:0
metrics:nil
views:views]];

      Je le trouve plus facile d'obtenir les contraintes de droite à l'aide de visual format de la langue. Un peu moins d'erreur (pour moi, au moins). Il ya, cependant, certaines contraintes qui ne peuvent être représentées dans un format visuel, de la langue, auquel cas je revenir à la syntaxe que vous décrivez.

    5. Dans votre nouvelle question, vous nous montrez un init méthode pour votre sous-vue, qui ne un autre addSubview. Vous devez définir des contraintes, là aussi. Bas de ligne, où vous faire addSubview, vous devez définir vos contraintes, par exemple

      - (id)init
{
if(self = [super init])
{
NSArray *nibArray = [[NSBundle mainBundle]loadNibNamed:@"MySubview" owner:self options:nil];
UIView *subview = [nibArray objectAtIndex:0];
subview.translatesAutoresizingMaskIntoConstraints = NO;
[self addSubview:subview];
NSDictionary *views = NSDictionaryOfVariableBindings(subview);
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|[subview]|"
options:0
metrics:nil
views:views]];
[self addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|[subview]|"
options:0
metrics:nil
views:views]];
}
return self;
}
    • Ah, mais oui, vous avez raison, je n'ai gâcher mes noms de variables lors de l'écriture de la question. Désolé pour la confusion. Le format visuel de la langue a l'air sympa. Je crois que je vais rester à l'écart jusqu'à ce que je peux obtenir ce travail, alors je vais passer de l'un à l'utiliser. Étapes de bébé. 🙂 Malheureusement, cela ne fonctionne toujours pas pour moi. Je suis actuellement à la recherche à l'épinglage de la largeur et de la hauteur de la suggestion et puis de modifier la prise de contrainte dans le code. Je ne suis pas sûr de ce que je devrais changer la contrainte des constantes de valeurs?
    • Précisément ce qui ne va pas? Je demande parce que si j'utilise votre code, il fonctionne très bien. Assurez-vous que vous n'essayez pas de les examiner la frame paramètres immédiatement après la définition de contraintes, comme cela ne fonctionnera pas à moins que (a) vous le faites en viewDidAppear ou plus tard; et/ou (b) vous force layoutIfNeeded. Ligne de fond, comment avez-vous conclu que les contraintes ne sont pas de travail? Voir ma réponse révisée pour quelques autres observations.
    • J'ai édité ma réponse à donner une description plus détaillée de ce que je suis en train de faire. Auparavant, j'étais réglage de mes contraintes dans le viewDidLoad, j'ai juste changé la viewDidAppear et a également fait un appel à layoutIfNeeded mais je suis toujours obtenir les mêmes résultats incorrects. 🙁
    • Alors j'ai essayé ton code et ça a fonctionné, c'est parfait! En quelque sorte. 🙂 Quand je change de "UIView *newSubview = [[UIView alloc] initWithFrame:CGRectZero];" à "UIView *newSubview = [[MySubview alloc] initWithFrame:CGRectZero];" Elle ne travaille pas et se comporte comme je l'ai souligné dans mon édité question. MySubview des charges d'une plume, je suppose que je dois regarder plus dans ce qu'il semble qu'elle pourrait être à l'origine des problèmes.
    • est la mise en page automatique drapeau activé dans votre PLUME?
    • Se rapproche... Oui, la mise en page automatique indicateur est allumé dans mes PLUMES. Donc, je viens de regarder le journal de sortie à partir de votre code (que j'utilise), newSubview de l'image est correctement changer après l'appel à layoutIfNeeded. Et c'est la valeur correcte pour les téléphones différents, génial! Le problème est, newSubview n'est pas redimensionné.
    • N'êtes-vous pas manquer un ensemble de contraintes? Dans votre sous-vue du init, vous êtes en train de faire l'autre addSubview. Donc, il suffit de répéter la contrainte processus de création, là aussi. Voir le point n ° 5 dans ma réponse révisée.
    • Qu'il a été. Je ne savais pas que j'avais à définir des contraintes pour chaque sous-vue... mais bien sûr, vous ne. Une fois que vous l'avez dit, je savais que c'était le chaînon manquant (repère de la musique). 🙂 Merci à vous! Je suis juste désolé que ma cote est trop faible à voter vous.
    • Grand. accepté c'est. 🙂
    • Woow....patron de votre point numéro 5 a travaillé pour la sous-vue comme une magie....excellent travail

    InformationsquelleAutor Rob
  2. 1

    Dans le problème de l'état "mon nouveau sous-vues ne sont pas mis à l'échelle pour correspondre le conteneur view" - mais à partir de la description que je pense qu'ils sont - le problème, c'est que votre conteneur de vue n'a pas de taille fixe.

    Je pense que si vous réglez votre conteneur en vue de fixe, de la largeur et de la hauteur qui doit le faire, vous pouvez aussi avoir besoin d'appeler 

    [self.containerView layoutSubviews]

    à force de redimensionnement après la mise à jour des contraintes.

    Je voudrais aussi vous suggère de swap à l'aide de la base de texte mise en forme, vous pouvez échanger vos lignes ci-dessus pour quelque chose comme "H:|[newSubview]|" et "V:|[newSubview]|"

    • Je pense que cela peut être la droite ligne de la pensée. Comment puis-je mettre à jour les contraintes de manière à ce qu'ils ampleur par rapport à l'appareil de la taille de l'écran? Dois-je le pin le conteneur de vue de la hauteur et la largeur de l'IB, puis accrocher jusqu'à la contrainte de débouchés et de modifier les constantes quand j'ai créer le sous-vues? Si oui, disons de l'IB, de mon conteneur en vue de la hauteur est de 400, et que la valeur est correcte pour l'iPhone 5, donc je ne voudrais pas le modifier. Comment et où dois-je le changer lorsque l'application est en cours d'exécution sur l'iPhone 4 pour l'obtenir à l'échelle vers le bas un peu pour être proportionnelle à l'écran plus petit?
    • Eh bien, quelle est la relation entre la vue et la taille de l'écran? Oui, la taille doit être dépend de l'écran, mais le but est d'exprimer que, dans la les contraintes, plutôt qu'avec des numéros fixes. Si par exemple, le containerView hauteur doit être de 30% de la superview vous pouvez faire glisser la hauteur de la contrainte de l'IB dans votre contrôleur et de l'utiliser pour définir la mise à l'échelle de la charge. Vous pouvez également essayer de changer la hauteur d'une égalité (=) à la une de l'inégalité (>=)
    • Je pense que je suis le faire. Le containerView a des contraintes à la super pour elle du haut et du bas que j'ai mis dans de l'IB. Vous dites que je devrais "montée en charge" qui fait sens pour moi aussi, mais où puis-je obtenir que le facteur d'échelle. Par exemple, l'iPhone 5, la hauteur est de 1136 et l'iPhone 4, la hauteur est de 960, donc je pense qu'il y a quelque part je peux obtenir un facteur d'échelle ou 0.845 (960 / 1136) je sais que je pourrais le faire dans le code en divisant le courant de la hauteur de l'écran par la hauteur de l'écran que le point de vue a été construit, mais qui ne semble pas droit et semble être quelque chose de mise en page automatique doit traiter. Je suis mal là?
    • Comme il est, quand j'ai créer mon sous-vue (ce qui a été construit pour l'iPhone 5) et le contraint à le conteneur affichage dans le code, il n'a pas d'effet sur la sous-vue de la taille et du bas de l'affichage est coupé lors de l'affichage sur les petits écrans comme l'iPhone 4.
    • À l'échelle de la charge a été un mauvais choix de mots, il devrait plutôt être en déduire la hauteur basé sur les contraintes existantes pour superview de la charge. Une bouchée. Pourriez-vous poster une capture d'écran? Est votre sous-vue s'étendant au-delà du conteneur affichage sur des écrans plus petits, ou est le conteneur de vue déjà s'étendant au-delà du fond avant d'ajouter la sous-vue? Toutes les erreurs ou les messages dans les logs quand il clips?
    • J'ai ajouté quelques captures d'écran à ma question initiale, j'espère que ça aide à expliquer ce que je fais et ce qui ne va pas. Je ne reçois pas toutes les erreurs ou les messages dans les journaux. Aussi, lorsque j'utilise "po [[UIWindow keyWindow] _autolayoutTrace]" toutes les contraintes sont valides.

    InformationsquelleAutor James