Дмитрий Захаров «Компоновка элементов пользовательского интерфейса»
Upcoming SlideShare
Loading in...5
×
 

Дмитрий Захаров «Компоновка элементов пользовательского интерфейса»

on

  • 1,347 views

Видео и расшифровка по ссылке: http://mbltdev.ru/presentations/34

Видео и расшифровка по ссылке: http://mbltdev.ru/presentations/34

Statistics

Views

Total Views
1,347
Views on SlideShare
1,184
Embed Views
163

Actions

Likes
0
Downloads
3
Comments
0

3 Embeds 163

http://mbltdev.ru 150
http://test.mbltdev.ru 8
http://www.mbltdev.ru 5

Accessibility

Categories

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Дмитрий Захаров «Компоновка элементов пользовательского интерфейса» Дмитрий Захаров «Компоновка элементов пользовательского интерфейса» Presentation Transcript

  • Компоновка UI Дмитрий Захаров, iOS Lead Engineer, e-Legion (dmitry.zakharov@e-legion.com)
  • iPhone 5
  • Решения < iOS 6• Springs and Struts в Interface Builder• Autoresizing Mask в Code• - (void)layoutSubviews { ... }
  • Springs and struts Autoresizing mask typedef enum UIViewAutoresizing { UIViewAutoresizingNone, ...FlexibleLeftMargin, ...FlexibleWidth, ...FlexibleRightMargin, ...FlexibleTopMargin, ...FlexibleHeight, ...FlexibleBottomMargin };
  • Проблемы S&S
  • Проблемы S&S
  • Проблемы S&S
  • Проблемы S&Sif (UIInterfaceOrientationIsLandscape(toInterfaceOrientation)) { CGRect rect = self.topLeftView.frame; rect.size.width = 210; rect.size.height = 120; self.topLeftView.frame = rect;  rect = self.topRightView.frame; rect.origin.x = 250; rect.size.width = 210; rect.size.height = 120; self.topRightView.frame = rect;  rect = self.bottomView.frame; rect.origin.y = 160; rect.size.width = 440; rect.size.height = 120; self.bottomView.frame = rect; } else { ... }
  • Решение:Cocoa Autolayout.
  • Autolayout? Что это?• Это другое мышление (setFrame:, setCenter:, setBounds:)• Больше возможностей по сравнению с S&S• Поддержка IB: программируем мышкой• Visual Format Language• Поддержка отладки
  • Constraints на примере
  • Подробнее о Autolayout• LayoutManager оперирует системами линейных уравнений и нестрогих неравенств y = | ≤ | ≥ k • x + b k, b ∈ D • x, b одно из: • left, right, top, bottom • width, height • leading, trailing • centerX, centerY, baseline
  • Подробнее о Autolayout• Layout равняет по границе выравнивания (alignment rects): • intrinsicContentSize • alignmentRectForFrame: • alignmentRectInsets
  • Interface Builder
  • Interface Builder
  • Проблемы CAL• Ambiguent Constraints (insufficient)• Unsatisfiable Constraints (conflicts)
  • Решение: Приоритетыenum { UILayoutPriorityRequired = 1000, ...DefaultHigh = 750, ...DefaultLow = 250, ...FittingSizeLevel = 50};typedef float UILayoutPriority;
  • Приоритеты при изменении собственных размеров•Content Hugging Priority•Content CompressionResistance Priority
  • Visual Format Language• ASCII-art подобный способ задания [buttonA]-[buttonB] |-[buttonA(<=200@100)]-(10)- [buttonB(==buttonA)]-(5)-|• приоритет читаемости над полнотой
  • Пример “жесткого” кодаconstraint = [NSLayoutConstraint constraintWithItem:button1 attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:button2 attribute:NSLayoutAttributeLeft multiplier:1.0 constant:-12.0];[view addConstraint:constraint];
  • Отладка• Unsatisfiable Constraints: Exceptions• Ambiguent Constraints: Run multiple times, or • – constraintsAffectingLayoutForAxis: • – hasAmbiguousLayout • – exerciseAmbiguityInLayout