2013-05-24 3 views
0

Я довольно смущен новой функцией автоматического макета xCode 4.5.Autolayout and Constraints для iPad

Вот что я хочу сделать,

Установив раскадровку, у меня есть этот вид портрета создана. enter image description here

С помощью автоопределения и ограничений (и контактов), как я могу преобразовать макет, когда он перевернулся на такой пейзаж? enter image description here

Я пробовал кодирование и изменение CGRect (размер и координаты местоположения), когда его ландшафтный дизайн, но безрезультатно.

ответ

1

Autolayout отлично подходит для выражения отношения одного объекта к другому и разрешения конфликтов - но в нем нет каких-либо условных концепций. Для вашего макета, я думаю, вам будет проще всего добавлять и удалять ограничения на вращение, зайдите в https://developer.apple.com/library/ios/#documentation/AppKit/Reference/NSLayoutConstraint_Class/NSLayoutConstraint/NSLayoutConstraint.html, чтобы узнать, как их добавить.

Вы также можете настроить свои ограничения и настроить приоритеты так, чтобы они делали правильную работу при вращении, но для правильной работы потребуется некоторое тестирование и настройка. Я провел некоторое тестирование локально, и я думаю, что я делаю это правильно, но это просто с пустыми представлениями, у которых нет встроенного контента. Тем не менее, вот что я думаю, что требуется, чтобы сделать все это с помощью раскадровки:

  • Убедитесь, что синий вид имеет ширину < = ширина портретный и> = минимальный пейзаж ширина
  • Убедитесь, что красный вид имеет минимальную высоту
  • Исправьте ширину желтого изображения и установите высоту, чтобы быть> = высота портрета
  • Прикрепите каждый вид к углу, в котором он всегда будет оставаться (например, штифт и нижний для надзора для желтого)
  • Выравнивание верхней части желтого вида с синим видом, с низким приоритетом
  • Увеличение сопротивления сжатия контента для желтого

Я думаю о нем, как, начиная с голубой вид, имеющий довольно высокий приоритет максимальный размер, а желтый вид зная, как расширить вверх, но будучи низким приоритетом , Когда он вращается, синий вид сохраняет свой максимальный размер, который освобождает желтый вид, чтобы расширяться вверх. Затем я заполняю необходимые ограничения, чтобы поддерживать выравнивание.

Это довольно сложно описать в тексте, вот скренграб, показывающий три вида и ограничения между ними. Он не показывает все, но вы можете хотя бы осмотреть отношения между видами: xcode showing constraints

2

NSLayoutConstraints заменяет необходимость в CGRits в Auto Layout. Сначала опишите макет в словах. Вот как я опишу ваш пример с портретом:

  • Ширина красного составляет 60% от его надзора.
  • Высота синего составляет 55% от его надзора.
  • Левые левые & Правые края касаются его надзора.
  • Левый край красного цвета касается его надзора, правый край красного цвета близок к левому краю желтого, а правый правый правый край касается его надзора.
  • Верхняя кромка Blue касается сенсорного экрана, нижний край синего близок к верхнему краю красного, а нижний край красного касается его супервизора.
  • Нижний край синего близок к верхнему краю желтого цвета, а нижний край желтого цвета касается его надзора.

Вот метод, который устраняет существующие ограничения superview, а затем применяет новые ограничения для данной ориентации интерфейса.

- (void) buildConstriantsForInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation { 
    // Remove existing constraints. 
    [superview removeConstraints:superview.constraints] ; 
    // Build an array to hold new constraints. 
    NSMutableArray* constraints = [NSMutableArray new] ; 

    // Add 2 constraints that apply to both Portrait & Landscape orientations. 
    [constraints addObject:[NSLayoutConstraint constraintWithItem:red attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:superview attribute:NSLayoutAttributeWidth multiplier:0.6 constant:0]] ; 
    [constraints addObject:[NSLayoutConstraint constraintWithItem:blue attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:superview attribute:NSLayoutAttributeHeight multiplier:0.55 constant:0]] ; 

    // Build a dictionary to store references to NSViews. 
    NSDictionary* views = NSDictionaryOfVariableBindings(superview, blue, red, yellow) ; 
    // To eliminate repeated NSLayoutConstraint code, build an array of Format Strings with which to build constraints. 
    NSArray* formatStrings ; 
    if (UIInterfaceOrientationIsPortrait(interfaceOrientation)) { 
     formatStrings = @[@"H:|[blue]|", @"H:|[red]-[yellow]|", @"V:|[blue]-[red]|", @"V:[blue]-[yellow]|"] ; 
    } 
    else { 
     formatStrings = @[@"H:|[blue]-[yellow]|", @"H:|[red]-[yellow]", @"V:|[blue]-[red]|", @"V:|[yellow]|"] ; 
    } 

    for (NSString* formatString in formatStrings) { 
     [constraints addObjectsFromArray:[NSLayoutConstraint constraintsWithVisualFormat:formatString options:0 metrics:nil views:views]] ; 
    } 

    // Add the newly created constraints. 
    [superview addConstraints:constraints] ; 
} 

Вы можете вызвать этот метод всякий раз, когда представление загружается или вращается.

-(void) viewDidLoad { 
    superview.translatesAutoresizingMaskIntoConstraints = NO ; 
    [self buildConstriantsForInterfaceOrientation:self.interfaceOrientation] ; 
} 

- (void) willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration { 
    [self buildConstriantsForInterfaceOrientation:toInterfaceOrientation] ; 
}