entendendo o básico de auto layout usando xcode 6

15
André Cytryn Cofundador Saída Certa @acytryn /andrecytryn /acytryn

Upload: andre-cytryn

Post on 07-Jul-2015

317 views

Category:

Technology


0 download

DESCRIPTION

Lightning talk sobre o básico de Auto Layout no XCode 6 no evento CocoaHeads RJ sediado no escritório do Hotel Urbano. Código dos exemplos: https://github.com/cytryn/AutoLayoutExample -- Lightning talk about the basics of Auto Layout on Xcode 6 at the CocoaHeads RJ event headquartered in the office of the Hotel Urbano. Examples found at: https://github.com/cytryn/AutoLayoutExample

TRANSCRIPT

Page 1: Entendendo o básico de Auto Layout usando XCode 6

André  CytrynCo-­‐fundador  Saída  Certa

@acytryn /andrecytryn/acytryn

Page 2: Entendendo o básico de Auto Layout usando XCode 6

Entendendo  Auto  Layout

• Possibilidades  de  layout;  

• Gerando  suas  constraints;  

• Resolvendo  ambiguidades;  

• Animando  com  Auto  Layout.

Page 3: Entendendo o básico de Auto Layout usando XCode 6

Possibilidades  de  layout

Page 4: Entendendo o básico de Auto Layout usando XCode 6

• Código;  • Xibs;  • Storyboard;  (recomendado)

Page 5: Entendendo o básico de Auto Layout usando XCode 6

Gerando  suas  constraints

Page 6: Entendendo o básico de Auto Layout usando XCode 6

• O  Xcode  deve  ser  capaz  de  calcular  como  uma  equação;  

• Existem  prioridades;  • Não  tenha  medo  de  criar  muitas  constraints.

Page 7: Entendendo o básico de Auto Layout usando XCode 6

Constraint  to  Margin  

• Nova  opção  para  iOS  8;  • DeTinir  uma  constraint  relativa  a  uma  margem  predeTinida  em  sua  superview.

Page 8: Entendendo o básico de Auto Layout usando XCode 6

Resolvendo  ambiguidades

Page 9: Entendendo o básico de Auto Layout usando XCode 6

• Frame;  • Constraint.  

Mais  uma  vez,  matemática!

Page 10: Entendendo o básico de Auto Layout usando XCode 6

Animando  com  Auto  Layout

Page 11: Entendendo o básico de Auto Layout usando XCode 6

Animando  sem  mudar  

constraint

Page 12: Entendendo o básico de Auto Layout usando XCode 6

Animando  mudando  a  constraint

Page 13: Entendendo o básico de Auto Layout usando XCode 6

@interface PlantZombieViewController : UIViewController

@property (nonatomic, weak) IBOutlet NSLayoutConstraint *plantTopConstraint;

@property (nonatomic, weak) IBOutlet UIImageView *plantImageView;

@end

@implementation PlantZombieViewController

- (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. }

- (IBAction)smashButtonTapped:(UIButton *)button { if (self.plantTopConstraint.constant == 0) { button.titleLabel.text = @"SMASH"; [UIView animateWithDuration:1.0 animations:^{ self.plantTopConstraint.constant = self.view.frame.size.height - self.plantImageView.frame.size.height; [self.view layoutIfNeeded]; }]; } else { button.titleLabel.text = @"RESET"; self.plantTopConstraint.constant = 0; } }

- (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. }

@end

Page 14: Entendendo o básico de Auto Layout usando XCode 6

Exemplos

https://github.com/cytryn/AutoLayoutExample

Page 15: Entendendo o básico de Auto Layout usando XCode 6

Obrigado!  

Dúvidas?

@acytryn /andrecytryn/acytryn