SlideShare uma empresa Scribd logo
1 de 15
Baixar para ler offline
Auto-Layout
in iOS 7

By Pushpendra Singh
Layout

Layout Consist of four things:
• Center
• Bounds
• Auto-resizing mask
• Transform
Auto Layout

Using Auto Layout, you can create a
dynamic and versatile interface that
responds appropriately to changes in
screen size, device orientation, and
localization.
Basic Concept
Expression of the form y = m*x + b,
where:
y and x are attributes of views.
m and b are floating point values.
An attribute is one of left, right, top,
bottom, leading, trailing, width, height,
centerX, centerY, and baseline.
constraints

Layout NSLayoutConstraint
Content NSContentSizeLayoutConstraint
AutosizingNSAutoresizingMaskLayoutConstraint
Constraints Attribute
view1.attribute1 RELATION multiplier * view2.attribute2 +
constant
NSLayoutAttributeLeft
NSLayoutAttributeRight
NSLayoutAttributeTop
NSLayoutAttributeBottom
NSLayoutAttributeLeading
NSLayoutAttributeTrailing
NSLayoutAttributeWidth
NSLayoutAttributeHeight
NSLayoutAttributeCenterX
NSLayoutAttributeCenterY
NSLayoutAttributeBaseline
NSLayoutRelationEqual
NSLayoutRelationGreaterThanOrEqual
NSLayoutRelationLessThanOrEqual
NSLayoutAttributeNotAnAttribute
Constraints Code
view1.attribute1 RELATION multiplier * view2.attribute2 +
constant
constraint = [NSLayoutConstraint
constraintWithItem: view
attribute: NSLayoutAttributeWidth
relatedBy: NSLayoutRelationEqual
toItem: nil
attribute: NSLayoutAttributeNotAnAttribute
multiplier: 1.0
constant:100.0];
[view addConstraint: constraint];
constraint = [NSLayoutConstraint
constraintWithItem: view
attribute: NSLayoutAttributeWidth
relatedBy: NSLayoutRelationEqual
toItem: nil
attribute: NSLayoutAttributeNotAnAttribute
multiplier: 1.0
Constant: 80.0];
[view addConstraint: constraint];
Check For Ambiguous Layout

view.hasAmbiguousLayout
view.exerciseAmbiguityInLayout

for (UIView *view in self.subviews) {
if ([view hasAmbiguousLayout]){
NSLog(@"<%@:0x%0x>", view.description, (int)self);
}
}
Intrinsic ContentSize

Suggested size for the view.
- (CGSize) intrinsicContentSize {
return mySize;
}
[self invalidateIntrinsicContentSize];
UIImage *img = UIImage imageNamed:@"Icon.png"];
UIImageView *iv = [[UIImageView alloc] initWithImage:img];
NSLog(@"%@", NSStringFromCGSize(iv.intrinsicContentSize));
Visual Format Language

[NSLayoutConstraint
! constraintsWithVisualFormat:@"H:|-[buttonA]-|" ! options:0
! metrics:nil
! views:@{@"buttonA":buttonA}];
UIView
Opting in to Constraint-Based Layout
+ requiresConstraintBasedLayout
– translatesAutoresizingMaskIntoConstraints
– setTranslatesAutoresizingMaskIntoConstraints:

Managing Constraints
–
–
–
–
–

constraints
addConstraint:
addConstraints:
removeConstraint:
removeConstraints:

Measuring in Constraint-Based Layout
–
–
–
–
–
–
–

systemLayoutSizeFittingSize
intrinsicContentSize
invalidateIntrinsicContentSize
contentCompressionResistancePriorityForAxis:
setContentCompressionResistancePriority:forAxis:
contentHuggingPriorityForAxis:
setContentHuggingPriority:forAxis:
UIView

Aligning Views with Constraint-Based Layout
–
–
–
–

alignmentRectForFrame:
frameForAlignmentRect:
alignmentRectInsets
viewForBaselineLayout

Triggering Constraint-Based Layout
–
–
–
–

needsUpdateConstraints
setNeedsUpdateConstraints
updateConstraints
updateConstraintsIfNeeded

Debugging Constraint-Based Layout
– constraintsAffectingLayoutForAxis:
– hasAmbiguousLayout
– exerciseAmbiguityInLayout
Queries
Auto-Layout in iOS 7

Mais conteúdo relacionado

Destaque

Introduction to auto layout
Introduction to auto layoutIntroduction to auto layout
Introduction to auto layoutCiklum Ukraine
 
Understanding Auto Layout
Understanding Auto LayoutUnderstanding Auto Layout
Understanding Auto LayoutHenrique Morbin
 
Introduction to xcode
Introduction to xcodeIntroduction to xcode
Introduction to xcodeSunny Shaikh
 
Introduction to data structures and Algorithm
Introduction to data structures and AlgorithmIntroduction to data structures and Algorithm
Introduction to data structures and AlgorithmDhaval Kaneria
 
VIdeo Compression using sum of Absolute Difference
VIdeo Compression using sum of Absolute DifferenceVIdeo Compression using sum of Absolute Difference
VIdeo Compression using sum of Absolute DifferenceDhaval Kaneria
 
Linux booting procedure
Linux booting procedureLinux booting procedure
Linux booting procedureDhaval Kaneria
 
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)Derek Lee Boire
 
Serial Peripheral Interface(SPI)
Serial Peripheral Interface(SPI)Serial Peripheral Interface(SPI)
Serial Peripheral Interface(SPI)Dhaval Kaneria
 
Autolayout keynote
Autolayout keynoteAutolayout keynote
Autolayout keynoteLi Lin
 

Destaque (19)

Introduction to auto layout
Introduction to auto layoutIntroduction to auto layout
Introduction to auto layout
 
Object Calisthenics in Objective-C
Object Calisthenics in Objective-CObject Calisthenics in Objective-C
Object Calisthenics in Objective-C
 
Auto layout 介紹
Auto layout 介紹Auto layout 介紹
Auto layout 介紹
 
Understanding Auto Layout
Understanding Auto LayoutUnderstanding Auto Layout
Understanding Auto Layout
 
X-Debug in Php Storm
X-Debug in Php StormX-Debug in Php Storm
X-Debug in Php Storm
 
Introduction to xcode
Introduction to xcodeIntroduction to xcode
Introduction to xcode
 
Introduction to data structures and Algorithm
Introduction to data structures and AlgorithmIntroduction to data structures and Algorithm
Introduction to data structures and Algorithm
 
VIdeo Compression using sum of Absolute Difference
VIdeo Compression using sum of Absolute DifferenceVIdeo Compression using sum of Absolute Difference
VIdeo Compression using sum of Absolute Difference
 
Code Review for iOS
Code Review for iOSCode Review for iOS
Code Review for iOS
 
Introduction of Xcode
Introduction of XcodeIntroduction of Xcode
Introduction of Xcode
 
HDMI
HDMIHDMI
HDMI
 
Swine flu
Swine flu Swine flu
Swine flu
 
Network security
Network securityNetwork security
Network security
 
Token bus standard
Token bus standardToken bus standard
Token bus standard
 
Linux booting procedure
Linux booting procedureLinux booting procedure
Linux booting procedure
 
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
Adjusting to Auto Layout (Tutorial / Tips for iOS Auto Layout)
 
Serial Peripheral Interface(SPI)
Serial Peripheral Interface(SPI)Serial Peripheral Interface(SPI)
Serial Peripheral Interface(SPI)
 
Mems technology
Mems technologyMems technology
Mems technology
 
Autolayout keynote
Autolayout keynoteAutolayout keynote
Autolayout keynote
 

Semelhante a Auto-Layout in iOS 7

WMP_MP02_revd(10092023).pptx
WMP_MP02_revd(10092023).pptxWMP_MP02_revd(10092023).pptx
WMP_MP02_revd(10092023).pptxfahmi324663
 
Responsive Web design _2013
Responsive Web design _2013 Responsive Web design _2013
Responsive Web design _2013 Suresh B
 
responsive web design 1_oct_2013
responsive web design  1_oct_2013 responsive web design  1_oct_2013
responsive web design 1_oct_2013 Suresh B
 
responsive web design
responsive web designresponsive web design
responsive web designSuresh B
 
Datavisualization - Embed - Focus + Text
Datavisualization - Embed - Focus + TextDatavisualization - Embed - Focus + Text
Datavisualization - Embed - Focus + TextRashmiMilan
 
Multidimensional Perceptual Map for Project Prioritization and Selection - 20...
Multidimensional Perceptual Map for Project Prioritization and Selection - 20...Multidimensional Perceptual Map for Project Prioritization and Selection - 20...
Multidimensional Perceptual Map for Project Prioritization and Selection - 20...Jack Zheng
 
Manual Layout Revisited
Manual Layout RevisitedManual Layout Revisited
Manual Layout Revisitedgillygize
 
Tk2323 lecture 2 ui
Tk2323 lecture 2   uiTk2323 lecture 2   ui
Tk2323 lecture 2 uiMengChun Lam
 

Semelhante a Auto-Layout in iOS 7 (13)

Autolayout in iOS
Autolayout in iOSAutolayout in iOS
Autolayout in iOS
 
Material design
Material designMaterial design
Material design
 
Autolayout
AutolayoutAutolayout
Autolayout
 
WMP_MP02_revd(10092023).pptx
WMP_MP02_revd(10092023).pptxWMP_MP02_revd(10092023).pptx
WMP_MP02_revd(10092023).pptx
 
Responsive Web design _2013
Responsive Web design _2013 Responsive Web design _2013
Responsive Web design _2013
 
responsive web design 1_oct_2013
responsive web design  1_oct_2013 responsive web design  1_oct_2013
responsive web design 1_oct_2013
 
Rwd ppt
Rwd pptRwd ppt
Rwd ppt
 
responsive web design
responsive web designresponsive web design
responsive web design
 
Datavisualization - Embed - Focus + Text
Datavisualization - Embed - Focus + TextDatavisualization - Embed - Focus + Text
Datavisualization - Embed - Focus + Text
 
Solidworks software
Solidworks softwareSolidworks software
Solidworks software
 
Multidimensional Perceptual Map for Project Prioritization and Selection - 20...
Multidimensional Perceptual Map for Project Prioritization and Selection - 20...Multidimensional Perceptual Map for Project Prioritization and Selection - 20...
Multidimensional Perceptual Map for Project Prioritization and Selection - 20...
 
Manual Layout Revisited
Manual Layout RevisitedManual Layout Revisited
Manual Layout Revisited
 
Tk2323 lecture 2 ui
Tk2323 lecture 2   uiTk2323 lecture 2   ui
Tk2323 lecture 2 ui
 

Mais de Mindfire Solutions (20)

Physician Search and Review
Physician Search and ReviewPhysician Search and Review
Physician Search and Review
 
diet management app
diet management appdiet management app
diet management app
 
Business Technology Solution
Business Technology SolutionBusiness Technology Solution
Business Technology Solution
 
Remote Health Monitoring
Remote Health MonitoringRemote Health Monitoring
Remote Health Monitoring
 
Influencer Marketing Solution
Influencer Marketing SolutionInfluencer Marketing Solution
Influencer Marketing Solution
 
ELMAH
ELMAHELMAH
ELMAH
 
High Availability of Azure Applications
High Availability of Azure ApplicationsHigh Availability of Azure Applications
High Availability of Azure Applications
 
IOT Hands On
IOT Hands OnIOT Hands On
IOT Hands On
 
Glimpse of Loops Vs Set
Glimpse of Loops Vs SetGlimpse of Loops Vs Set
Glimpse of Loops Vs Set
 
Oracle Sql Developer-Getting Started
Oracle Sql Developer-Getting StartedOracle Sql Developer-Getting Started
Oracle Sql Developer-Getting Started
 
Adaptive Layout In iOS 8
Adaptive Layout In iOS 8Adaptive Layout In iOS 8
Adaptive Layout In iOS 8
 
Introduction to Auto-layout : iOS/Mac
Introduction to Auto-layout : iOS/MacIntroduction to Auto-layout : iOS/Mac
Introduction to Auto-layout : iOS/Mac
 
LINQPad - utility Tool
LINQPad - utility ToolLINQPad - utility Tool
LINQPad - utility Tool
 
Get started with watch kit development
Get started with watch kit developmentGet started with watch kit development
Get started with watch kit development
 
Swift vs Objective-C
Swift vs Objective-CSwift vs Objective-C
Swift vs Objective-C
 
Material Design in Android
Material Design in AndroidMaterial Design in Android
Material Design in Android
 
Introduction to OData
Introduction to ODataIntroduction to OData
Introduction to OData
 
Ext js Part 2- MVC
Ext js Part 2- MVCExt js Part 2- MVC
Ext js Part 2- MVC
 
ExtJs Basic Part-1
ExtJs Basic Part-1ExtJs Basic Part-1
ExtJs Basic Part-1
 
Spring Security Introduction
Spring Security IntroductionSpring Security Introduction
Spring Security Introduction
 

Último

Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024The Digital Insurer
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonetsnaman860154
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdfhans926745
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processorsdebabhi2
 
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...gurkirankumar98700
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreternaman860154
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxMalak Abu Hammad
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEarley Information Science
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Enterprise Knowledge
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Scriptwesley chun
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationSafe Software
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Allon Mureinik
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024The Digital Insurer
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024The Digital Insurer
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Servicegiselly40
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 

Último (20)

Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024Tata AIG General Insurance Company - Insurer Innovation Award 2024
Tata AIG General Insurance Company - Insurer Innovation Award 2024
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
Kalyanpur ) Call Girls in Lucknow Finest Escorts Service 🍸 8923113531 🎰 Avail...
 
Presentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreterPresentation on how to chat with PDF using ChatGPT code interpreter
Presentation on how to chat with PDF using ChatGPT code interpreter
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
 
Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...Driving Behavioral Change for Information Management through Data-Driven Gree...
Driving Behavioral Change for Information Management through Data-Driven Gree...
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024Partners Life - Insurer Innovation Award 2024
Partners Life - Insurer Innovation Award 2024
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 

Auto-Layout in iOS 7

  • 1. Auto-Layout in iOS 7 By Pushpendra Singh
  • 2. Layout Layout Consist of four things: • Center • Bounds • Auto-resizing mask • Transform
  • 3. Auto Layout Using Auto Layout, you can create a dynamic and versatile interface that responds appropriately to changes in screen size, device orientation, and localization.
  • 4. Basic Concept Expression of the form y = m*x + b, where: y and x are attributes of views. m and b are floating point values. An attribute is one of left, right, top, bottom, leading, trailing, width, height, centerX, centerY, and baseline.
  • 6. Constraints Attribute view1.attribute1 RELATION multiplier * view2.attribute2 + constant NSLayoutAttributeLeft NSLayoutAttributeRight NSLayoutAttributeTop NSLayoutAttributeBottom NSLayoutAttributeLeading NSLayoutAttributeTrailing NSLayoutAttributeWidth NSLayoutAttributeHeight NSLayoutAttributeCenterX NSLayoutAttributeCenterY NSLayoutAttributeBaseline NSLayoutRelationEqual NSLayoutRelationGreaterThanOrEqual NSLayoutRelationLessThanOrEqual NSLayoutAttributeNotAnAttribute
  • 7.
  • 8. Constraints Code view1.attribute1 RELATION multiplier * view2.attribute2 + constant constraint = [NSLayoutConstraint constraintWithItem: view attribute: NSLayoutAttributeWidth relatedBy: NSLayoutRelationEqual toItem: nil attribute: NSLayoutAttributeNotAnAttribute multiplier: 1.0 constant:100.0]; [view addConstraint: constraint]; constraint = [NSLayoutConstraint constraintWithItem: view attribute: NSLayoutAttributeWidth relatedBy: NSLayoutRelationEqual toItem: nil attribute: NSLayoutAttributeNotAnAttribute multiplier: 1.0 Constant: 80.0]; [view addConstraint: constraint];
  • 9. Check For Ambiguous Layout view.hasAmbiguousLayout view.exerciseAmbiguityInLayout for (UIView *view in self.subviews) { if ([view hasAmbiguousLayout]){ NSLog(@"<%@:0x%0x>", view.description, (int)self); } }
  • 10. Intrinsic ContentSize Suggested size for the view. - (CGSize) intrinsicContentSize { return mySize; } [self invalidateIntrinsicContentSize]; UIImage *img = UIImage imageNamed:@"Icon.png"]; UIImageView *iv = [[UIImageView alloc] initWithImage:img]; NSLog(@"%@", NSStringFromCGSize(iv.intrinsicContentSize));
  • 11. Visual Format Language [NSLayoutConstraint ! constraintsWithVisualFormat:@"H:|-[buttonA]-|" ! options:0 ! metrics:nil ! views:@{@"buttonA":buttonA}];
  • 12. UIView Opting in to Constraint-Based Layout + requiresConstraintBasedLayout – translatesAutoresizingMaskIntoConstraints – setTranslatesAutoresizingMaskIntoConstraints: Managing Constraints – – – – – constraints addConstraint: addConstraints: removeConstraint: removeConstraints: Measuring in Constraint-Based Layout – – – – – – – systemLayoutSizeFittingSize intrinsicContentSize invalidateIntrinsicContentSize contentCompressionResistancePriorityForAxis: setContentCompressionResistancePriority:forAxis: contentHuggingPriorityForAxis: setContentHuggingPriority:forAxis:
  • 13. UIView Aligning Views with Constraint-Based Layout – – – – alignmentRectForFrame: frameForAlignmentRect: alignmentRectInsets viewForBaselineLayout Triggering Constraint-Based Layout – – – – needsUpdateConstraints setNeedsUpdateConstraints updateConstraints updateConstraintsIfNeeded Debugging Constraint-Based Layout – constraintsAffectingLayoutForAxis: – hasAmbiguousLayout – exerciseAmbiguityInLayout